D3.js scaleOrdinal doesn't support rangeRoundBands method

Instead of this:

var x = d3.scaleOrdinal()
.domain(data.map(function(d) { return d.name; }))
.rangeRoundBands([0, width], 0.1);

In d3 v4

It should have been:

var x = d3.scaleBand()
    .rangeRound([0, width])
    .padding(0.1);

working code here


Thanks for Cyril Cherian . 90% of this gentleman’s answer is correct.

The following are inspirational answers. I have passed the test on d3-5.7.2.

// old v3 code
var x = d3.scaleOrdinal()
.domain(data.map(function(d) { return d.name; }))
.rangeRoundBands([0, width], 0.1);




// new v4 code
var x = d3.scaleBand()

// pay attention here ! the next statement is necessary . It is not part of 【conversion from v3 to v4】
.domain(data.map(function(d) { return d.name; })) 

// below is the 【conversion from v3 to v4】
.rangeRound([0, width])
.padding(0.1);

Tags:

D3.Js