当前位置：文江博客话题详情

在 Google 图表中设置图例和轴的格式

发布于 2025-01-05 07:54:19 字数 331 浏览 1 评论 0原文

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

这就是我的图表的外观：

这就是我的图表的外观

如您所见，它确实切割了水平轴和传说，所以最后的结果并不如想象的那么好。有办法解决这个问题吗？我一直在阅读官方文档和这里的一些帖子，但我还没有找到方法来做到这一点。

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

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

紫﹏色ふ单纯 2025-01-12 07:54:19

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

然而，您可以调整它们的大小和位置，这样您或多或少就能得到我们想要的东西。
这是可以做的：

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

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

所以这样做，这就是你得到的：
在此处输入图像描述

After some time experimenting, I daresay it is not posible to choose how much part of the words on legend or axis you can show.

However, you can play with their sizes and position so you get -more or less- what we were looking for.
This is what can be done:

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

I've also made the image a little bit bigger so it fits the x-axis without problems (There was also the option of making its text smaller).

So doing this, this is what you get:
enter image description here

回复收藏 0 原文

〆一缕阳光ご 2025-01-12 07:54:19

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

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

ref https://stackoverflow.com/a/6870732/661584

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

Its basically about setting your chart area vs width / height.

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

ref https://stackoverflow.com/a/6870732/661584

Also as @ArcDare says using the other available styling options such as font size etc

回复收藏 0 原文

旧时光的容颜 2025-01-12 07:54:19

对于优化的图表区域，

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

技巧是设置 axis textStyle fontsize 可以更好地将图例放置在图表底部，因为图表区域约为 60-70%

随意使用我的自定义 Google Charts 插件来创建这两个图表和表格。
https://github.com/cosmoarunn/gapiExt

For optmized chart area,

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

The trick is setting axis textStyle fontsize will enable better placement of legend on the bottom of the chart as the chart Area is about 60-70%

Feel free to use my custom Google Charts plugin which creates both chart and table.
https://github.com/cosmoarunn/gapiExt

回复收藏 0 原文

~没有更多了~