d3.js：路径在刻度线之间与轴相交

Question

我创建了一个平行坐标图，如Mikes示例here所示。

似乎我用于分类（字符串）数据的bandScale偏移了刻度之间的间距的1/2。路径不与表示它们所属的类别的刻度相交，它们在它们之间相交。我做错了什么可能导致这种情况？

以下是负责绘制尺寸的方法。 注意：this.dimensions是一个包含维度名称的对象，以及相应的比例。

＆＃13;

＆＃13;

  plotPathGroup(className: string, data) {
    return this.svg.append("g")
      .attr("class", className)
      .selectAll("path")
      .data(data)
      .enter().append("path")
      .attr("d", this.path.bind(this));
  },

  path(d) {
    const scaleMap = this.keys.map(key => [
      this.x(key),
      this.dimensions[key](d[key])
    ]);
    return d3.line()(scaleMap);
  },

  catDimensionScale(data, key) {
    return d3.scaleBand()
      .domain(data.map(d => d[key]))
      .range([this.size.h, 0]);
  },

＆＃13;

＆＃13;

＆＃13;

Answer 1

乐队规模不是正确的工具。问题在于，正如其名称所暗示的那样，频带规模具有带宽。

您应该使用点比例。正如API所说，

  

点标度是频带标度的变体，带宽固定为零。

所以，你的代码应该是：

catDimensionScale(data, key) {
    return d3.scalePoint()
        .domain(data.map(d => d[key]))
        .range([this.size.h, 0]);
}