Basic HTML5 Chart Example - CanvasJS

Basic HTML5 Chart Example

by daniel silva

HTML

<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var data = [{
    "type": "line",
        "axisYType": "primary",
        "color": "#00FFFF",
        "xValueType": "dateTime",
        "name": "e-rab_phase_est_sr",
        "showInLegend": true,
        "markerSize": 5,
        "dataPoints": [{
        "x": 1397520000000,
            "y": 99.801
    }, {
        "x": 1397606400000,
            "y": 99.869
    }, {
        "x": 1397692800000,
            "y": 99.836
    }, {
        "x": 1397779200000,
            "y": 99.84
    }, {
        "x": 1397865600000,
            "y": 99.868
    }, {
        "x": 1397952000000,
            "y": 99.899
    }, {
        "x": 1398038400000,
            "y": 99.887
    }, {
        "x": 1398124800000,
            "y": 99.86
    }, {
        "x": 1398211200000,
            "y": 99.9
    }, {
        "x": 1398297600000,
            "y": 99.885
    }, {
        "x": 1398384000000,
            "y": 99.889
    }, {
        "x": 1398470400000,
            "y": 99.902
    }, {
        "x": 1398556800000,
            "y": 99.919
    }, {
        "x": 1398643200000,
            "y": 99.9
    }, {
        "x": 1398729600000,
            "y": 99.865
    }, {
        "x": 1398816000000,
            "y": 99.913
    }, {
        "x": 1398902400000,
            "y": 99.932
    }, {
        "x": 1398988800000,
            "y": 99.87
    }, {
        "x": 1399075200000,
            "y": 99.912
    }, {
        "x": 1399161600000,
            "y": 99.907
    }, {
        "x": 1399248000000,
            "y": 99.846
    }, {
        "x": 1399334400000,
            "y": 99.886
    }, {
        "x": 1399420800000,
            "y": 99.913
    }, {
        "x": 1399507200000,
            "y": 99.9
    }, {
        "x": 1399593600000,
            "y": 99.861
    }, {
        "x": 1399680000000,
            "y": 99.911
    }, {
        "x": 1399766400000,
            "y": 99.874
    }, {
        "x": 1399852800000,
            "y": 99.894
    }, {
        "x": 1399939200000,
            "y": 99.865
...