Y轴在d3js条形图中有一些文字切割

时间:2017-02-12 09:06:56

标签: javascript d3.js bar-chart

我有一个带有d3的条形图,https://jsfiddle.net/1e87abkz/

并旋转我写的文字

.selectAll("text")  
            .style("text-anchor", "end")            
            .attr("dx", "-.8em")
            .attr("dy", ".15em")
            .attr("transform","rotate(-65)")
            .style("font-size","15px");

但在底部的一些文字剪切 enter image description here 请建议如何解决此问题以显示所有文字。

2 个答案:

答案 0 :(得分:1)

只需增加你的底部空间以留出足够的空间(小提琴中的第65行):

var margin = { top: 20, right: 30, bottom: 120, left: 40 },

答案 1 :(得分:1)

增加svg的高度以使其可见。

<svg id="graph" style="height:700px"></svg>

你也可以让你的svg做出回应,看看下面的问题就可以了。

Resize svg when window is resized in d3.js

Whats the best way to make a d3.js visualisation layout responsive?