3

私はd3を初めて使用し、値「16」が2回表示される数値の配列を使用して単純なチャートを作成するために使用しています。

2 番目の '16' 値に対して 1 つの '欠けている' 'rect' 要素を含むチャートを生成します。html をチェックすると、両方の '16' rect が同じ 'y' 値 72 であることがわかります。

私が間違っていることを教えてください、ありがとう

コード:

var data = [4, 8, 15, 16, 23, 16];

var chart = d3.select("body").append("svg")
     .attr("class", "chart")
     .attr("width", 420)
     .attr("height", 20 * data.length);


var x = d3.scale.linear()
     .domain([0, d3.max(data)])
     .range([0, 420])

var y = d3.scale.ordinal()
     .domain(data)
     .rangeBands([0, 120]);

chart.selectAll("rect")
     .data(data)
     .enter().append("rect")
     .attr("y", y)
     .attr("width", x)
     .attr("height", y.rangeBand());
4

2 に答える 2