在Firefox 13.0.1中,d3.js散点图中的刻度标签被截断

时间:2012-08-29 20:11:26

标签: javascript html css cross-browser d3.js

我目前正在使用d3.js制作散点图,这与此链接中的内容非常类似:

http://bost.ocks.org/mike/d3/workshop/dot-chart.html

我的问题是,当我使y轴'刻度标签真的很长并因此使用CSS增加SVG元素的填充大小时,部分刻度标签在Firefox 13.0.1中被切断但在Safari 6.0中没有

在CSS中,我通过将其添加到链接中的代码来增加SVG元素的填充大小:

svg{
    padding: 200px;
}

为了增加y轴'刻度标签的长度,我在d3脚本中添加了这个(在实例化yAxis变量之后):

yAxis.tickFormat(function(d){return "lolzReallyLongTickLabels"});

增加svg元素的填充大小可以防止截断Safari 6.0中的刻度标签,但不会阻止Firefox 13.0.1。如何让Firefox中的长标签不被截断?

1 个答案:

答案 0 :(得分:0)

现在你可能已经得到了答案。但如果没有,我发现一个页面似乎通过创建一个轴然后旋转它来处理你的问题。

http://bl.ocks.org/hlvoorhees/5986172