XAxis 标签问题

Question

下午好。

当数据很大（重叠层）并且您指示我插入新行 (*) 时，我问您如何解决 xAxis 标签的问题，尽管我的 slipt 函数有问题。

有人对此问题有所了解。

• How do I include newlines in labels in D3 charts?

我的图表： http://jsfiddle.net/superboggly/tL2hW/

解决方案：

var insertLinebreaks = function (d) {
  var el = d3.select(this);
  var words = d.split(' ');
  el.text('');

  for (var i = 0; i < words.length; i++) {
    var tspan = el.append('tspan').text(words[i]);
    if (i > 0)
        tspan.attr('x', 0).attr('dy', '15');
  }
};

svg.selectAll('g.x.axis g text').each(insertLinebreaks);

Answer 1

我建议使用以下解决方案： http://www.d3noob.org/2013/01/how-to-rotate-text-labels-for-x-axis-of.html

旋转 x 轴的标签可以工作，直到你有太多的条形图。如果条数过多，我建议重新考虑表格，因为任何人都不容易看到。如果您使用 google 信息可视化，则有相关指南。

要为旋转为水平的轴的单位设置一个通用标签，请使用

.attr("transform", "rotate(-XX)")

在特定的文本元素上 XX 度。