html,

body,

#container {

  width: 100%;

  height: 100%;

  margin: 0;

  padding: 0;

}

anychart.onDocumentReady(function () {

  anychart.data.loadCsvFile('https://gist.githubusercontent.com/shacheeswadia/e2fd68f19e5331f87d38473a45a11dbe/raw/396b3e14f2d7e05aa188e0a420a7b622ed4111bd/amzohlcweekly.csv',

    function (data) {

      // create data table on loaded data

      var dataTable = anychart.data.table();

      dataTable.addData(data);

​

      // map loaded data for the ohlc series

      var mapping = dataTable.mapAs({

        open: 1,

        high: 2,

        low: 3,

        close: 4

      });

​

      // create stock chart

      var chart = anychart.stock();

​

      // create first plot on the chart

      var plot = chart.plot(0);

​

      // create ohlc series

      plot

        .ohlc()

        .data(mapping)

        .name('AMZ');

      // set grid settings

      plot

        .yGrid(true)

        .xGrid(true)

        .yMinorGrid(true)

        .xMinorGrid(true);

​

      // create scroller series with mapped data

      chart.scroller().area(dataTable.mapAs({ value: 4 }));

      // sets the title of the chart

      chart.title('Amazon Inc. Stock Prices');

​

      // set container id for the chart

      chart.container('container');

      // initiate chart drawing

      chart.draw();

​

    }

  );

});