growstuff/app/assets/javascripts/graphs/bar_group.js

// =require d3
// = require graphs/width_scale
// = require graphs/height_scale

/*
 * This represents bars for a bar graph.
 * Currently these are used for HorizontalBarGraph.
 */
(function() {
  'use strict';


  var growstuff = (window.growstuff = window.growstuff || {});
  var WidthScale = growstuff.WidthScale;
  var HeightScale = growstuff.HeightScale;

/**
 * data object for bar group
 * @param {Object} data Graph configuration
 */
function BarGroup(data) {
  this._data = data;
}
  BarGroup.prototype.render = function(root) {
    var data = this._data;
    var bars = this._data.bars;
    var widthScale = new WidthScale(data).render();
    var heightScale = new HeightScale(data).render();

    return root.append('g')
      .attr('class', 'bar')
      .selectAll('rect')
      .data(bars.map(function(bar) {
   return bar.value;
  }))
    .enter()
    .append('rect')
    .attr('y', function(d, i) {
      return heightScale(i);
    })
    .attr('height', heightScale.rangeBand())
    .attr('fill', data.bar_color)
    .attr('width', function(d) {
      return widthScale(d);
    })
    .append('title')
    .text(function(d) {
      return 'This value is ' + d + '.';
    });
  };

  growstuff.BarGroup = BarGroup;
}());