2013-01-16 72 views
1

我在工作中实现了谷歌图表功能,它的工作原理一般。谷歌图表y轴文本切断(svg标签太宽)

我刚刚注意到图表中的错误。图表的左侧(更具体地说y轴的文本,正在被切断)

目前我的谷歌图表是460px的宽度,但是当我用萤火虫看图表时,我看到图中的SVG标签,正确设置为宽度460,但实际上是472px宽(导致什么ü可以下面的图片上看到的)。

http://i.imgur.com/uAuD7.png

有趣的是,在一个更大的显示器(FX 600像素宽)它工作得很好。如果我在javascript中插入yAxis标题,它的作品也是如此。

我不知道如何解决这个问题,但我希望你们中的一些人遇到同样的问题,并提出解决方案或修复方案。

图片绘制图表正常股利,用萤火虫布局采取接通

图片的SVG标签在谷歌图表(请注意,该元素是比其它更大,并且其使用更多的空间向左其父元素(DIV)

都可以在这里找到:。

http://imgur.com/8owiA,SsgM2#0

的问候,马丁

回答

0

问题在于谷歌图表计算了考虑到字体大小的图表中的头寸和大小。

我的css覆盖了谷歌图表使用的“自动”字体大小(在我的情况下是12px),并且我的css中有13px的字体大小。

解决方法是获得指定的“文本” CSS-路径的(在这种情况下:SVG GGG文本),使文字12像素(在.css文件)

或者干脆设置正确的字体大小关系到我的CSS在谷歌图表的JavaScript像这样:

vAxis: {textStyle: {fontSize: 13}}