2

スケールでの実際の値とパーセンテージの表示を切り替えたい。現在、データはcsvファイルからインポートされており、csvを処理してデータのドメインを見つけ、グラフを正常に表示します。軸ドメインが0〜100になるのでパーセンテージ表示に切り替えることができますが、csvファイルを再処理せずに実際のデータドメインに戻すことができるようにしたいと思います。

データを軸にアタッチして取得することはできますか？このようなもの：

     vis.append("g")
                .data([calculated_y_domain, [0, 100]])
                .attr("class", "axis yaxis")
                .attr("transform", "translate("+padding+",0)")
                .call(yAxis);

それとももっと良いアプローチがありますか？

ここに例がありますhttp://bl.ocks.org/3131368 私は片付けの過程にありますが、それを行う方法は、軸ドメインを切り替えるための最良のアプローチに依存します。

4

1 に答える 1

4

2つのスケール（パーセンテージと値）を利用する2つの軸コンポーネントを作成し、データを遷移するときに2つの軸間を遷移することができます。

var xAxisValue = d3.svg.axis()
    .scale(valueScale)
    .orient("bottom");
var xAxisPercentage = d3.svg.axis()
    .scale(percentageScale)
    .orient("bottom");

d3.select("svg").append("g")
    .attr("class", "x-axis")
    .call(xAxisValue);

/* More code... */

// At the point you want to switch...
var dur = 1500;
d3.select(".x-axis").transition().duration(dur).call(xAxisPercentage);
于 2012-07-17T21:05:45.273 に答える