Chart.js

Chart.js example

by karthick Chandran

HTML

<canvas id="myChart" width="1000" height="500"></canvas>

JavaScript

var ctx = document.getElementById("myChart");
var mixedChart = new Chart(ctx, {
  type: 'bar',
  data: {
    datasets: [{
          label: 'Bar Dataset',
          data: [10, 20, 30, 40],
           backgroundColor: 'rgba(255, 99, 132, 0.2)',
        }, {
          label: 'Line Dataset',
          data: [0, 15, 30, 50],
          borderColor: 'rgba(255, 255, 0, 0.1)',
					backgroundColor: 'rgba(255, 99, 132, 0.1)',
          // Changes this dataset to become a line
          type: 'line'
        }],
    labels: ['January', 'February', 'March', 'April']
  },
  options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        },
      title: {
            display: true,
            text: 'Chart.js example'
        },
      legend: {
            display: true,
            position: 'bottom'
        }
    }
});