1

これは SO: D3 - issues on first transition after initialization に関するこの質問のフォローアップです。

Mike と Jason の回答で説明されているように、主要な機能を調査して実装しました。このブログ投稿も役に立ちましたhttp://knowledgestockpile.blogspot.com/2012/01/understanding-selectall-data-enter.html

私は次のようなキーを使用しました

.data(svg.chartData, function(d) { return d.idSeries;})

1 対 1 のデータとインデックスをマップします。

ただし、期待どおりの結果が得られず、再描画時にデータ ポイントがスワップされます。http://jsbin.com/avoced/8/editをご覧ください。具体的には、次の関連機能を参照してください。

チャートの初期化:

    svg.series = svg.selectAll(".series").data(svg.chartData, function(d) { return d.idSer;})
    svg.series.enter().append("g").classed("series", true)

    svg.rects = svg.series.selectAll("rect").data(Object, function(d) { return d.x;})
    svg.rects.enter().append("rect")

再描画:

    svg.series = svg.selectAll(".series").data(svg.chartData, function(d) { return d.idSer;})
    svg.series.enter().append("g").classed("series", true)
    svg.series.exit().remove()

    svg.rects = svg.series.selectAll("rect").data(Object, function(d) { return d.x;})
    svg.rects.enter().append("rect")
    svg.rects.exit().remove()

スケール:

x = d3.scale.ordinal()
      .domain(svg.pointsNames, function(d) { return d;}) 
        .rangeRoundBands([0,width], .1); 

ここで何が欠けていますか?

どうもありがとう

4

0 に答える 0