当比例是 d3js 折线图（v3）中的范围时，将数据点与 x 轴比例对齐

Question

请找到附加的图像来解释这个问题。

以下是 xScale 定义：

const xScale = d3.scaleBand()
            .rangeRound([0, width - margin])
            .padding(0)
            .domain(data[maxObjectNo].value.map(function (d, i) {
                return d.xName;
            }));

对于 1 个折线图，xName 是一个类似 ['0-1', '1-3', '3-6'] 的范围，对于其他折线图，它是 [1,2,3,4]

const line = d3.line()
            .x((d,i) => return xScale(d.xName))
            .y(d => yScale(d.value));

线上的圆圈（数据）

lines.selectAll('circle-group')
.attr('cx', function (d, i) {
                return xScale(d.xName);
            })