Question

我不知道此时我做错了什么。 scalePoint工作，值与轴一致，但scaleBand由于某种原因左移。

我文件中代码的选定部分：

var x = d3.scaleBand() 
        .range([0, width]);

var y = d3.scaleLinear()
        .range([height, 0]);


var xAxis = d3.axisBottom()
    .scale(x);

var yAxis = d3.axisLeft()
    .scale(y);


// the domain
x.domain(myData.map(function (d)  
{   
    console.log(d.ball);
    return d.ball;
}));


y.domain([0, d3.max(myData, function (d)
{   
    //console.log("our maxtime" + d.finaltime);
    return d["ball data"]["final time"];
})]);   

// the scatterplot
myChart.selectAll("dot")
    .data(myData)
    .enter()
    .append("circle")
    .style("fill", "orange")
    .attr("r", 5)
    .attr("cx", function (d)
    {
        return x(d.ball);
    })
    .attr("cy", function (d)
    {
        if (!d["ball data"]["final time"]) { return height/2 } else { 
        return y(d["ball data"]["final time"]);}
    });

Answer 1

波段标度不会将值向左移动。您在图表中获得的是预期的行为，这正是scalePoint和scaleBand之间的差异。在乐队范围内：

离散输出值由比例自动计算，将连续范围除以均匀的波段（强调我的）。

现在，对于每个圈子，你都会获得乐队的开始：

return x(d.ball);

因此，要获得类似于磅值的输出，您应该将波段除以2：

return x(d.ball) + x.bandwidth()/2;

这是你的小提琴：https://jsfiddle.net/jxdsqqwy/

scaleBand（）将值左移

1 个答案: