Basic Column Chart - CanvasJS JavaScript Charts

Basic Column Chart - CanvasJS JavaScript Charts

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/>
<!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
  data: [{
      type: "spline",
      dataPoints: [{
          x: 10,
          y: 71
        },
        {
          x: 20,
          y: 55
        },
        {
          x: 30,
          y: 50
        },
        {
          x: 40,
          y: 65
        },
        {
          x: 50,
          y: 95
        },
        {
          x: 60,
          y: 68
        },
        {
          x: 70,
          y: 28
        },
        {
          x: 80,
          y: 34
        },
        {
          x: 90,
          y: 14
        }
      ]
    },
    {
      type: "scatter",
      markerSize: 10,
      markerType: "cross",
      markerColor: "red",
      dataPoints: [{x: 30, y:50, label: "Apple"}],
      indexLabelFormatter: function(e) {
        return e.dataPoint.label;
      },
      indexLabelFontSize: 36,
      indexLabelFontColor: "black"
    }
  ]
});

chart.render();