D3 4.0 rangeRoundBands 동등?

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] 
}

이 코드에 해당하는 D3 v4 (Mike Bostock의 막대 차트 예제 )는 무엇입니까?

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

---

D3에서 4.x rangeRoundBands는 새로운 밴드 스케일 로 이동되었습니다 .

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

이는 다음과 같습니다.

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

API는 다음과 같습니다. https://github.com/d3/d3-scale#band-scales

---

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

위는 밴드를 계산하고 밴드 사이의 패딩을 설정합니다. v4에서 동등한 것은

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

---

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) {
  d.y = +d.y;
  return d;
}, function(error, data) {
  if (error) throw error;

  x.domain(data.map(function(d) { return d.x; }));
  y.domain([0, d3.max(data, function(d) { return d.y; })]);

scaleBand 및 scaleLinear를 모두 사용하는 클래식 차트의 시작 가능한 구문입니다.

참고 URL : https://stackoverflow.com/questions/37548408/d3-4-0-rangeroundbands-equivalent