1. ホーム
  2. d3.js

[解決済み] d3バージョン4の'd3.svg.axis()'とは何ですか?

2022-02-11 08:27:40

質問

以下の行を新しいバージョンのD3 APIに置き換えるにはどうすればよいですか?

私はすでに scale.linear()scaleLinear()

var xRange = d3.scaleLinear()
    .domain([OIResults.min,OIResults.max]).range([40, 360]);

var yRange = d3.scaleLinear()
    .domain(y_domain).range([360, 40]);

以下の行は、新しい API に従って置き換える必要があります。

var xAxis = d3.svg.axis().scale(xRange).tickFormat(function(d) { return d.x;});
var yAxis = d3.svg.axis().scale(yRange).orient("left");

解決方法は?

D3 v4 API はこちら . によると チェンジログ :

D3 4.0では、デフォルトのスタイルと短い構文が提供されます。d3.svg.axis と axis.orient の代わりに、D3 4.0 は各方向のための4つのコンストラクターを提供します: d3.axisTop, d3.axisRight, d3.axisBottom, d3.axisLeft です。

したがって、それらの行は、次のようになります。

var xAxis = d3.axisBottom(xRange).tickFormat(function(d){ return d.x;});
var yAxis = d3.axisLeft(yRange);


追記:目盛りを軸の下に表示させたいとのことですが、通常であれば orient を元の行に追加してください。

PPS: 執筆の時点では、リンク先のドキュメントはD3 v4に適用されます。 注意、レクター:いつでも変更可能です(以下のコメントを参照)。