Google Chart中的自动宽度滚动条

我在HTML5项目中使用Google Chart。 它采用JSON值（来自DB）绘制图形。

如果数据在JSON值中超过5到6，我需要有一个滚动条。 我通过JSFiddle创建了示例附加链接。

目前我已经给出了22个值。 当JSON值有3或4个值时，我需要相同的效果。 即使JSON有50个值，条形宽度也不会有任何变化，它应该保持相同的宽度。

请给我解决方案，非常感谢你。 🙂

这是链接： – http://jsfiddle.net/gK9r7/

Answer 1

这是解决方案： http ： //jsfiddle.net/hsakX/

设置bar.groupWidth选项以固定条的宽度。 然后使图表的宽度成为条宽和要显示的条数的函数：

var options = { title: 'Company Performance', hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}, width: data.getNumberOfRows() * 65, bar: {groupWidth: 20} }; 

设置包含div的overflow-x滚动：

 #chart_div { overflow-x: scroll; overflow-y: hidden; width: 500px; height: 550px; }