html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    var csv = '1|10082.7803|10111.9102|9972.3896|10040.8203|1249400064, ' +

        '2|10040.8096|10143.7598|9989.6504|10110.1396|1199900032, ' +

        '3|10111.0996|10159.54|10046.7197|10073.0498|1021900032, ' +

        '4|10074.8896|10165.0703|10044.6602|10098.6299|1092499968, ' +

        '5|10098.4902|10224.29|10041.9297|10181.7402|1192199936, ' +

        '6|10181.0703|10225.6104|10124.8799|10173.4102|1023600000, ' +

        '7|10174.0703|10235.4902|10143.9102|10195.0098|845400000, ' +

        '8|10193.8301|10226.8701|10110.4297|10122.5195|843100032, ' +

        '9|10121.9697|10198.0303|10056.0898|10173.9199|1138200064, ' +

        '10|10170.1201|10230.4805|10092.3701|10168.46|1142099968, ' +

        '11|10168.3896|10312.9902|10129.0098|10290.2803|1118400000, ' +

        '12|10277.8203|10346.9902|10229.5195|10260.2002|924169984, ' +

        '13|10261.5195|10388.9502|10255.6201|10341.1602|1214400000, ' +

        '14|10342.4199|10390.6396|10267.9404|10313.3604|1246300032, ' +

        '15|10313.3604|10337.3301|10269.4902|10289.0996|1371299968, ' +

        '16|10289.4697|10348.6797|10196.1904|10313.0703|1261200000, ' +

        '17|10306.6504|10380.4697|10250.6104|10314.7598|1299800064, ' +

        '18|10315.1299|10374.79|10260.9297|10318.1602|1204499968, ' +

        '19|10316.9004|10324.8701|10195.5996|10231.3604|1256000000, ' +

        '20|10231.5898|10315.7197|10194.3496|10244.4902|1113900032, ' +

        '21|10245.8203|10352.3701|10219.71|10284.46|1422599936, ' +

        '22|10283.8701|10293.2305|10152.9004|10204.8896|1197600000, ' +

        '23|10204.5195|10291.3896|10159.54|10244.9297|1324999936, ' +

        '24|10244.0498|10244.0498|10075.3301|10109.1797|1379900032';

​

    var dataTable = anychart.data.table();

    dataTable.addData(csv, 0, {'rowsSeparator': ', ', columnsSeparator: '|'});

​

    var lineMapping = dataTable.mapAs({value: 1});

​

    var ohlcMapping = dataTable.mapAs({open: 1, high: 2, low: 3, close: 4});

​

    var chart = anychart.stock();

​

    var plot = chart.plot();

    plot.line(lineMapping);

​

    var scroller = chart.scroller();

​

    // Adds ohlc series.

    scroller.ohlc(ohlcMapping);

​

    chart.title('Add OHLC series to a scroller using data as CSV');

    chart.container('container');

    chart.draw();

});