function makeSplineChartPath(chart, width, t, maxValue, chartHeight, chartHeightOffset, markerRadius, pointsOnScreen, closePath) {
    let heightScaler = (chartHeight-markerRadius)/maxValue;
    let xSpacing = width / pointsOnScreen;
    let centeriser = xSpacing / 2 - markerRadius;
    let fullWidth = xSpacing*(chart.data.length-1) + markerRadius + centeriser;

    let xCord;
    let xCords = [];
    let yCords = [];
    chart.data.forEach((d, idx) => {
        let spacing = idx*xSpacing + centeriser;
        if (spacing > fullWidth * t && chart.drawChart) {
          return true;
        }
        xCord = makeXcord(chart, fullWidth, t, spacing, markerRadius);
        xCords.push(xCord);
        yCords.push((chartHeight+chartHeightOffset) - d.value * heightScaler  * (chart.timingFunctions ? chart.timingFunctions[idx % chart.timingFunctions.length](t) : 1));
    });
    let px = computeSplineControlPoints(xCords);
	  let py = computeSplineControlPoints(yCords);
    let splines = [`M ${xCords[0]} ${yCords[0]}`];
      for (i=0;i<xCords.length-1;i++) {
        splines.push(makeSpline(xCords[i],yCords[i],px.p1[i],py.p1[i],px.p2[i],py.p2[i],xCords[i+1],yCords[i+1]));
      }
      if (closePath) { // close for area spline graph
        splines.push(`V ${chartHeight+chartHeightOffset} H ${xCords[0]} Z`);
      }
    return {
      path: splines.join(','),
      width: xCords.slice(-1) + markerRadius,
      maxScroll: fullWidth - xSpacing + markerRadius
    };
  }
/**
   * Generate the SVG path for a spline or spline-area 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 (needed here so we can add it to the width of the chart element, maybe change name to something better such as padding!!!!)
   * @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????)
   * @param  {boolean} closePath         Wether to close the spline (make it an
   *                                     area chart) or not.
   */
Generate the SVG path for a spline or spline-area chart.


Generate the SVG path for a spline or spline - area chart .
function makeSplineChartPath(chart, width, t, maxValue, chartHeight, chartHeightOffset, markerRadius, pointsOnScreen, closePath) {
    let heightScaler = (chartHeight-markerRadius)/maxValue;
    let xSpacing = width / pointsOnScreen;
    let centeriser = xSpacing / 2 - markerRadius;
    let fullWidth = xSpacing*(chart.data.length-1) + markerRadius + centeriser;
    let xCord;
    let xCords = [];
    let yCords = [];
    chart.data.forEach((d, idx) => {
        let spacing = idx*xSpacing + centeriser;
        if (spacing > fullWidth * t && chart.drawChart) {
          return true;
        }
        xCord = makeXcord(chart, fullWidth, t, spacing, markerRadius);
        xCords.push(xCord);
        yCords.push((chartHeight+chartHeightOffset) - d.value * heightScaler  * (chart.timingFunctions ? chart.timingFunctions[idx % chart.timingFunctions.length](t) : 1));
    });
    let px = computeSplineControlPoints(xCords);
	  let py = computeSplineControlPoints(yCords);
    let splines = [`M ${xCords[0]} ${yCords[0]}`];
      for (i=0;i<xCords.length-1;i++) {
        splines.push(makeSpline(xCords[i],yCords[i],px.p1[i],py.p1[i],px.p2[i],py.p2[i],xCords[i+1],yCords[i+1]));
      }
      if (closePath) { 
        splines.push(`V ${chartHeight+chartHeightOffset} H ${xCords[0]} Z`);
      }
    return {
      path: splines.join(','),
      width: xCords.slice(-1) + markerRadius,
      maxScroll: fullWidth - xSpacing + markerRadius
    };
  }
function makeSplineChartPath ( chart , width , t , maxValue , chartHeight , chartHeightOffset , markerRadius , pointsOnScreen , closePath ) { let heightScaler = ( chartHeight - markerRadius ) / maxValue ; let xSpacing = width / pointsOnScreen ; let centeriser = xSpacing / 2 - markerRadius ; let fullWidth = xSpacing * ( chart . data . length - 1 ) + markerRadius + centeriser ; let xCord ; let xCords = [ ] ; let yCords = [ ] ; chart . data . forEach ( ( d , idx ) => { let spacing = idx * xSpacing + centeriser ; if ( spacing > fullWidth * t && chart . drawChart ) { return true ; } xCord = makeXcord ( chart , fullWidth , t , spacing , markerRadius ) ; xCords . push ( xCord ) ; yCords . push ( ( chartHeight + chartHeightOffset ) - d . value * heightScaler * ( chart . timingFunctions ? chart . timingFunctions [ idx % chart . timingFunctions . length ] ( t ) : 1 ) ) ; } ) ; let px = computeSplineControlPoints ( xCords ) ; let py = computeSplineControlPoints ( yCords ) ; let splines = [ ` ${ xCords [ 0 ] } ${ yCords [ 0 ] } ` ] ; for ( i = 0 ; i < xCords . length - 1 ; i ++ ) { splines . push ( makeSpline ( xCords [ i ] , yCords [ i ] , px . p1 [ i ] , py . p1 [ i ] , px . p2 [ i ] , py . p2 [ i ] , xCords [ i + 1 ] , yCords [ i + 1 ] ) ) ; } if ( closePath ) { splines . push ( ` ${ chartHeight + chartHeightOffset } ${ xCords [ 0 ] } ` ) ; } return { path : splines . join ( ',' ) , width : xCords . slice ( - 1 ) + markerRadius , maxScroll : fullWidth - xSpacing + markerRadius } ; }
Generate the SVG path for a spline or spline-area chart.
Generate the SVG path for a spline or spline - area chart .
// close for area spline graph