javascript - d3.partition 冰柱图的层次结构级别标签

Question

我对 D3 相当陌生，我正在尝试创建 icicle chart here 的修改版本。我需要在图表上方添加标签来指定层次结构级别名称 (不是每个分区的名称，而是代表层次结构中的级别的列名称)。 我有一个数组中的名称，并且在绑定(bind)实际的分层数据之前尝试将它们添加到图表中，但我似乎无法让标 checkout 现在该图表上方。 我不确定是否需要减少图表占用的垂直空间量，或者是否需要移动每个层次结构级别的标签

var levels=["LEV 1", "LEV 2", "LEV 3", "LEV 4"];

vis.selectAll("g").append('g') 
      .data(levels).enter()
      .append("text") 
      .attr("dy", ".55em")
      .attr('y', 5)
      .attr('x', function(d,i){ 
        return (i+1)* (w / levels.length) ;})
      .attr('text-anchor', 'start')
      .attr("class", "pHeader") 
      .text(function(d) {  return d; });   

任何帮助将不胜感激

Answer 1

在我看来，您的问题只是在设置绘图区域大小时留出边距空间的问题。

本教程应该有帮助: D3 Margin Convention

您可能还想考虑使用带有序数刻度的 D3 轴来间隔级别标签。