Stepped Area Chart Example

An example of a Google Stepped Area Chart.

by ArtemGr

HTML

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
       <div id="chart_div" style="width: 900px; height: 500px;"></div>

JavaScript

google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['',  'ex4', 'server4you'],
          ['1st month', 910+50, 9*34],
          ['2nd',       910+50*2, 9*34*2],
          ['3rd',       910+50*3, 9*34*3],
          ['4th',       910+50*4, 9*34*4],
          ['5th',       910+50*5, 9*34*5],
          ['6th',       910+50*6, 9*34*6],
          ['7th',       910+50*7, 9*34*7],
          ['8th',       910+50*8, 9*34*8],
          ['9th',       910+50*9, 9*34*9]
        ]);

        var options = {
          title: 'ex4 vs. server4you',
          vAxis: {title: 'Accumulated Price'},
          isStacked: true
        };

        var chart = new google.visualization.SteppedAreaChart(document.getElementById('chart_div'));

        chart.draw(data, options);
      }