如何标记Google柱形图栏

我正在使用Google Chart API为值创建图表，范围从1到数百万。

问题表示较小值（例如：小于50左右）的条在图上是不可见的，我无法看到哪些值对应于某个x轴。

如果我能以某种方式在条形图上打印y轴值，这将得到解决。但是，我在API文档中找不到任何关于如何做的提及。

这里有类似的问题，但它没有回答我的问题。

在Google交互式条形图中将标签放在内部栏的顶部

还有其他一些超过一年未解决的问题，我希望有人可能已经找到解决方案或解决方法 ，这就是为什么再次提出这个问题。

谷歌可视化：柱形图，简单的问题，但找不到答案

如何在Google Chart API列顶部显示值

你能告诉我如何实现我想要的东西如何自定义这个谷歌条形图？ ？

Answer 1

在这里查看Andrew Gallant的JSFiddle：

http://jsfiddle.net/asgallant/QjQNX/

它使用组合图表的聪明黑客来完成我认为你正在寻找的东西。

google.load("visualization", "1", {packages: ["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Name'); data.addColumn('number', 'Value'); data.addColumn({type: 'string', role: 'annotation'}); data.addRows([ ['Foo', 53, 'Foo text'], ['Bar', 71, 'Bar text'], ['Baz', 36, 'Baz text'], ['Cad', 42, 'Cad text'], ['Qud', 87, 'Qud text'], ['Pif', 64, 'Pif text'] ]); var view = new google.visualization.DataView(data); view.setColumns([0, 1, 1, 2]); var chart = new google.visualization.ComboChart(document.getElementById('chart_div')); chart.draw(view, { height: 400, width: 600, series: { 0: { type: 'bars' }, 1: { type: 'line', color: 'grey', lineWidth: 0, pointSize: 0, visibleInLegend: false } }, vAxis: { maxValue: 100 } }); } 

Answer 2

我使用注释和不可见线进行了一些挫折（例如，将它显示在工具提示中作为另一个系列）。

我已经对ComboChart进行了攻击（也可以使用BarChart和ColumnChart ，并进行了一些更改）将标签插入到SVG中。

看看这个小提琴： http ： //jsfiddle.net/augustomen/FE2nh/

在Firefox 21，Chrome 27和IE 9上测试过。