在谷歌图表中格式化图例和轴答案

【问题标题】：Formatting legend and axis in Google Charts在谷歌图表中格式化图例和轴
【发布时间】：2012-02-15 11:54:25
【问题描述】：

我是 Google Charts 的新手，我无法通过图表周围的文字获得良好的结果。

这就是我的图表的样子：

如您所见，它确实削减了水平轴和图例，因此最终结果不如预期的那么好。有没有办法解决这个问题？我一直在阅读official documentation 和这里的一些帖子，但我还没有找到这样做的方法。

回顾：我们如何修改图例或轴文本以使其完全可见？

【问题讨论】：

标签： javascript graph draw google-visualization

【解决方案1】：

经过一段时间的试验，我敢说无法选择可以显示图例或轴上的文字的多少部分。

但是，您可以调整它们的尺寸和位置，从而或多或少地获得我们想要的东西。这是可以做到的：

legend: {position: 'top', textStyle: {fontSize: 14}}

我还把图像放大了一点，这样它就可以毫无问题地适合 x 轴了（还有缩小文本的选项）。

这样做，你会得到：

【讨论】：

【解决方案2】：

它基本上是关于设置图表区域与宽度/高度。

width: [yourChoice]px,
chartArea: {width: '50%'}

参考https://stackoverflow.com/a/6870732/661584

正如@ArcDare 所说，使用其他可用的样式选项，例如字体大小等

【讨论】：

【解决方案3】：

对于优化的图表区域，

chartArea: {'width': '90%', 'height': '60%'}, 
legend: { position: 'bottom' },
hAxis : { textStyle : { fontSize: 10} },
vAxis : { textStyle : { fontSize: 10} },

诀窍是设置轴 textStyle 字体大小可以更好地将图例放置在图表底部，因为图表面积约为 60-70%

随意使用我的自定义 Google Charts 插件，它可以创建图表和表格。 https://github.com/cosmoarunn/gapiExt

【讨论】：