【问题标题】:Y axis some text cut of in d3js bar chartd3js条形图中的Y轴一些文本剪切
【发布时间】:2017-02-12 09:06:55
【问题描述】:

我有一个带有 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");

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

【问题讨论】:

    标签: javascript d3.js bar-chart


    【解决方案1】:

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

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

    【讨论】:

      【解决方案2】:

      增加 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?

      【讨论】:

      • 感谢您的帮助和建议
      猜你喜欢
      • 2020-04-20
      • 1970-01-01
      • 2018-03-21
      • 1970-01-01
      • 1970-01-01
      • 2019-02-18
      • 1970-01-01
      • 2017-08-30
      • 2018-10-18
      相关资源
      最近更新 更多