D3 4.0的rangeRoundBands相当于？

我看到很多D3代码都是这样的：

var x = d3.scale.ordinal() .rangeRoundBands([0, width], .1); 

从D3版本4.0开始， d3.scale.ordinal()现在是d3.scaleOrdinal ， rangeRoundBands似乎不见了。

 > d3.scaleOrdinal() { [Function: scale] domain: [Function], range: [Function], unknown: [Function], copy: [Function] } 

这个代码（来自Mike Bostock的条形图示例 ）的D3 v4等价物是什么？

 var x = d3.scale.ordinal() .rangeRoundBands([0, width], .1); 

Answer 1

在D3 4.x rangeRoundBands被移动到新的乐队规模：

 d3.scaleBand() .range([range]) .round([round]); 

这相当于：

 d3.scaleBand() .rangeRound([range]); 

这里是API： https ： //github.com/d3/d3-scale#band-scales

Answer 2

 var x = d3.scale.ordinal() .rangeRoundBands([0, width], .1); 

以上计算波段并在波段之间设置填充。 在第四版中，等价的是

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

Answer 3

 var svg = d3.select("svg"), margin = {top: 20, right: 20, bottom: 30, left: 60}, width = +svg.attr("width") - margin.left - margin.right, height = +svg.attr("height") - margin.top - margin.bottom; var x = d3.scaleBand().rangeRound([0, width]).padding(0.1), y = d3.scaleLinear().rangeRound([height, 0]); var g = svg.append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); d3.tsv("data.txt", function(d) { dy = +dy; return d; }, function(error, data) { if (error) throw error; x.domain(data.map(function(d) { return dx; })); y.domain([0, d3.max(data, function(d) { return dy; })]); 

使用scaleBand和scaleLinear的经典图表的可启动语法。