d3.js v4 изменить линию на гистограмму

Question

Я пытаюсь преобразовать линейный график в столбец, у меня проблемы с пониманием, где я делаю ошибку. Я использую d3.js v4.

Эта строка кода отображает код, который работает для области строки:

var area = d3.area()
          .x(function(d) { return   time_scale(d['timestamp'])+6.5; })
          .y0(-80+width -max_y)
          .y1(function(d) { return measure_scale(+d[field]); })
          .curve(d3.curveStep)
          ;

// append a SVG path that corresponds to the line chart
d3.select('#chart').append("path")
         .datum(neigh_data)
         .attr("class", "area")
         .attr("d", area)
         .attr('transform', 'translate(' + margin + ', -15)')

         ;

Эта строка кода не работает для баров (похоже, высота прямоугольника неверна, и я не использую заливку цветом):

   d3.select('#chart').selectAll(".bar").append("path")
  .datum(neigh_data)
  .enter().append("rect")
  .attr("class", "bar")
  .attr("x", function(d) { return   time_scale(d['timestamp']); })
  .attr("y", function(d,i) { return measure_scale(+d[field]); })
  .attr("width", time_scale.bandwidth())    
  .attr("height", function (d,i) {  return height -  measure_scale(+d[field]); }) 
       ;    

Я действительно что-то балуюсь.