arty-charty/util.js
function makeBarsChartPath(chart, width, t, maxValue, chartHeight, chartHeightOffset, markerRadius, pointsOnScreen, paddingLeft, isRange) {
    let heightScaler = (chartHeight-markerRadius)/maxValue;
    let xSpacing = width / pointsOnScreen;
    let barWidth = xSpacing - paddingLeft;
    let fullWidth = paddingLeft/2 + (paddingLeft+barWidth) * (chart.data.length-1) + barWidth;
    let pathStr = []
    let barCords = [];
    let x1, y1, y2;
    chart.data.some((d, idx) => {
        x1 = paddingLeft/2 + (paddingLeft+barWidth) * idx;
        if (x1 > fullWidth * t && chart.drawChart) {
          return true;
        }
        if (chart.stretchChart) {
          x1 = x1 * t;
        }
        y1 = (chartHeight+chartHeightOffset) - d.value * heightScaler * (chart.timingFunctions ? chart.timingFunctions[idx % chart.timingFunctions.length](t) : 1);
        y2 = isRange ? (chartHeight+chartHeightOffset) - d.valueLow * heightScaler * (chart.timingFunctions ? chart.timingFunctions[idx % chart.timingFunctions.length](t) : 1) : (chartHeight+chartHeightOffset);
        pathStr.push('M');
        pathStr.push(x1);
        pathStr.push(y2);
        pathStr.push('H');
        pathStr.push(x1 + barWidth);
        pathStr.push('V');
        pathStr.push(y1);
        pathStr.push('H');
        pathStr.push(x1);
        pathStr.push('V');
        pathStr.push(y2);
        barCords.push({x1: x1, x2: x1+barWidth, y1: y1, y2: y2});
    });
    return {
      path: pathStr.join(' '),
      width: fullWidth,
      maxScroll: fullWidth - width,
      barCords: barCords
    };
  }
function makeBarsChartPath(chart, width, t, maxValue, chartHeight, chartHeightOffset, markerRadius, pointsOnScreen, paddingLeft, isRange) {
    let heightScaler = (chartHeight-markerRadius)/maxValue;
    let xSpacing = width / pointsOnScreen;
    let barWidth = xSpacing - paddingLeft;
    let fullWidth = paddingLeft/2 + (paddingLeft+barWidth) * (chart.data.length-1) + barWidth;
    let pathStr = []
    let barCords = [];
    let x1, y1, y2;
    chart.data.some((d, idx) => {
        x1 = paddingLeft/2 + (paddingLeft+barWidth) * idx;
        if (x1 > fullWidth * t && chart.drawChart) {
          return true;
        }
        if (chart.stretchChart) {
          x1 = x1 * t;
        }
        y1 = (chartHeight+chartHeightOffset) - d.value * heightScaler * (chart.timingFunctions ? chart.timingFunctions[idx % chart.timingFunctions.length](t) : 1);
        y2 = isRange ? (chartHeight+chartHeightOffset) - d.valueLow * heightScaler * (chart.timingFunctions ? chart.timingFunctions[idx % chart.timingFunctions.length](t) : 1) : (chartHeight+chartHeightOffset);
        pathStr.push('M');
        pathStr.push(x1);
        pathStr.push(y2);
        pathStr.push('H');
        pathStr.push(x1 + barWidth);
        pathStr.push('V');
        pathStr.push(y1);
        pathStr.push('H');
        pathStr.push(x1);
        pathStr.push('V');
        pathStr.push(y2);
        barCords.push({x1: x1, x2: x1+barWidth, y1: y1, y2: y2});
    });
    return {
      path: pathStr.join(' '),
      width: fullWidth,
      maxScroll: fullWidth - width,
      barCords: barCords
    };
  }
function makeBarsChartPath ( chart , width , t , maxValue , chartHeight , chartHeightOffset , markerRadius , pointsOnScreen , paddingLeft , isRange ) { let heightScaler = ( chartHeight - markerRadius ) / maxValue ; let xSpacing = width / pointsOnScreen ; let barWidth = xSpacing - paddingLeft ; let fullWidth = paddingLeft / 2 + ( paddingLeft + barWidth ) * ( chart . data . length - 1 ) + barWidth ; let pathStr = [ ] let barCords = [ ] ; let x1 , y1 , y2 ; chart . data . some ( ( d , idx ) => { x1 = paddingLeft / 2 + ( paddingLeft + barWidth ) * idx ; if ( x1 > fullWidth * t && chart . drawChart ) { return true ; } if ( chart . stretchChart ) { x1 = x1 * t ; } y1 = ( chartHeight + chartHeightOffset ) - d . value * heightScaler * ( chart . timingFunctions ? chart . timingFunctions [ idx % chart . timingFunctions . length ] ( t ) : 1 ) ; y2 = isRange ? ( chartHeight + chartHeightOffset ) - d . valueLow * heightScaler * ( chart . timingFunctions ? chart . timingFunctions [ idx % chart . timingFunctions . length ] ( t ) : 1 ) : ( chartHeight + chartHeightOffset ) ; pathStr . push ( 'M' ) ; pathStr . push ( x1 ) ; pathStr . push ( y2 ) ; pathStr . push ( 'H' ) ; pathStr . push ( x1 + barWidth ) ; pathStr . push ( 'V' ) ; pathStr . push ( y1 ) ; pathStr . push ( 'H' ) ; pathStr . push ( x1 ) ; pathStr . push ( 'V' ) ; pathStr . push ( y2 ) ; barCords . push ( { x1 : x1 , x2 : x1 + barWidth , y1 : y1 , y2 : y2 } ) ; } ) ; return { path : pathStr . join ( ' ' ) , width : fullWidth , maxScroll : fullWidth - width , barCords : barCords } ; }
Generate the SVG path for a bar chart.

@param  {object}  chart             The chart object
@param  {number}  width             Width of the chart in pixels
@param  {number}  t                 Scale parameter (range: 0-1), used for
animating the graph
@param  {number}  maxValue          The maximum value of chart data
@param  {number}  chartHeight       Height of the chart in pixels
@param  {number}  chartHeightOffset By how much to offset the chart height.
Note: The negation of this number is as
the marginTop for the component.
This is done so when the graph is
animated, overflow is not cut off.
@param  {number}  markerRadius      Radius of the markers on the line (only needed to calcualte the height scaler and keep it consistent with the line/area chart, refactor for better name!!!)
@param  {number}  pointsOnScreen    The number of points to show on the screen
without having to scroll. Used to calculate
the horizontal spacing between points. (maybe find better name????)
Generate the SVG path for a bar chart .