d3版本4中的'd3.svg.axis()'是什么?

Vij*_*ngh 43 d3.js

如何使用新版本的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]);
Run Code Online (Sandbox Code Playgroud)

以下行需要根据新API进行替换:

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

Ger*_*ado 59

D3 v4 API 就在这里.根据更改日志:

D3 4.0提供默认样式和更短的语法.代替d3.svg.axis和axis.orient,D3 4.0现在为每个方向提供了四个构造函数:d3.axisTop,d3.axisRight,d3.axisBottom,d3.axisLeft.

因此,这些行应该是:

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

PS:我假设您希望刻度线低于轴,这通常是这种情况,因为您没有orient在原始线中显示.

PPS:在撰写本文时,链接文档适用于D3 v4.告诫者,lector:随时都可以改变(见下面的评论).