1

私はこの単純な線形スケールを持っています:

var x = d3.scale.linear().domain([0, 250]);

x.ticks(6)、予想どおり、次を返します。

[0, 50, 100, 150, 200, 250]

ただし、以下をx.ticks(11)返します。

[0, 20, 40, 60, 80, 100, 120, 140, 160, 180, 200, 220, 240]

私が欲しいのは:

[0, 25, 50, 75, 100, 125, 150, 175, 200, 225, 250]

これを修正するにはどうすればよいですか?

4

3 に答える 3

1

x.ticks(11) を目的の配列に置き換えることで、これを修正できます。

したがって、コードが次のようになり、x が線形スケールの場合:

chart.selectAll("line")
    .data(x.ticks(11))
    .enter()
    .append("line")
    .attr("x1", x)
    .attr("x2", x)
    .attr("y1", 0)
    .attr("y2",120)
    .style("stroke", "#CCC");

x.ticks(11) を配列に置き換えることができます。

var desiredArray = [0, 25, 50, 75, 100, 125, 150, 175, 200, 225, 250]
chart.selectAll("line")
    .data(desiredArray)
    .enter()
    .append("line")
    .attr("x1", x)
    .attr("x2", x)
    .attr("y1", 0)
    .attr("y2",120)
    .style("stroke", "#CCC");

線形スケールは、入力に基づいて目的の軸を自動的に配置します。ticks() が目的の分離を提供しない理由は、d3 が ticks() を提案として扱うためです。

于 2013-04-08T16:00:55.167 に答える
0
  axis.tickvalues((function(last, values) {
    var myArray = [0];
    for(var i = 1; i < values; i++) {
      myArray.push(last*i/(values-1))
    }
    return myArray;
  })(250, 11));

これにより、特定の範囲で必要な目盛り値の数を指定するための等間隔の配列が得られます。

于 2016-04-28T00:01:28.043 に答える