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: 360px;"></div>

CSS

#chartContainer{
    overflow: hidden;
}

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {

      toolTip: {
        shared: true,
        content: function(e){
          var str = "";
          for (var i = 0; i < e.entries.length; i++){
            var  temp = e.entries[i].dataSeries.name + " <strong>"+  e.entries[i].dataPoint.y + "</strong> <br/>" ; 
            str = str.concat(temp);
          }
          return (str);
        }
      },

      data: [
      {
        type: "line",
        name: "alpha 5555555555555 555555555 5555555",
        dataPoints: [
        { x: 10, y: 10 },
        { x: 20, y: 15 },
        { x: 30, y: 25 },
        { x: 40, y: 30 },
        { x: 50, y: 28 }
        ]
      },


      ]
    });

chart.render();