What is 'd3.svg.axis()' in d3 version 4?

Question

How can I replace below lines with the new version of D3 API?

I have already replaced scale.linear() with scaleLinear()

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

Below Lines need to be replaced according to the new API:

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

Answer 1

The D3 v4 API is here. According to the changelog:

D3 4.0 provides default styles and shorter syntax. In place of d3.svg.axis and axis.orient, D3 4.0 now provides four constructors for each orientation: d3.axisTop, d3.axisRight, d3.axisBottom, d3.axisLeft.

Therefore, those lines should be:

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

---

PS: I'm assuming that you want the ticks to be below the axis, which is normally the case, since you didn't show the orient in your original lines.

PPS: At the time of the writing the linked documentation applies to D3 v4. Caveat, lector: that can change at any time (see comments below).