chart.js 2.1

by akmiecik

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.0/Chart.bundle.min.js"></script>
<canvas id="canvas"></canvas>

JavaScript

var labels = ["10/21/22", "10/24/22", "10/27/22", "10/28/22", "10/31/22", "11/03/22", "11/14/22", "11/26/22", "11/26/22", "11/28/22", "11/28/22", "11/30/22", "12/01/22", "12/02/22", "12/06/22", "12/07/22", "12/08/22", "12/09/22", "12/12/22", "12/13/22", "12/16/22", "12/21/22", "12/28/22", "01/10/23", "01/12/23", "01/13/23", "01/16/23", "01/17/23", "01/19/23", "01/21/23", "01/24/23", "01/26/23", "01/30/23", "02/04/23", "02/06/23", "02/08/23", "02/09/23", "02/14/23", "02/10/23", "02/13/23", "02/15/23", "02/16/23", "02/17/23", "02/21/23", "02/24/23", "02/27/23"];
var lap_ave = ["1:02", "1:04", "1:00", "1:01", "1:02", "1:01", "1:03", "1:03", "1:03", "0:59", "0:59", "1:01", "1:02", "1:01", "1:00", "1:00", "1:00", "1:00", "0:59", "00:58", "01:02", "01:04", "01:00", "01:02", "1.01", "1.04", "01:03.1000", "01:00.2188", "01:01.5862", "01:01.4516", "00:57.8621", "01:00.6129", "01:01.1290", "01:00.6563", "01:00.5000", "01:00.0909", "00:59.0294", "00:59.0294", "00:59.7059", "00:59.0000", "00:59.7000", "00:59.6757", "00:58.3125", "00:59.4118", "00:58.8056", "00:58.9459"]; 

var chartData = {
  labels: labels,
  datasets: [{
    label: 'value',
    backgroundColor: 'rgba(219, 20, 0, 0.2)',
    data: lap_ave
  }]
};
//  Start part 2:  The Chart and data
window.onload = function() {
      var ctx = document.getElementById('canvas').getContext('2d');
      window.myLine = new Chart(ctx, {
        type: 'line',
                data: {
          labels: labels,
          datasets: [{
            data: lap_ave,
            borderColor: "",
            borderWidth: 1,
            pointRadius: 2,
            pointColor: "#FF0000", 
          }]
        },
 
        options: {
          legend: false,
          scales: {
                yAxes: {
                    position: 'right',
                    ticks: {
                        // Include a dollar sign in the ticks
                        callback: function(value, index, ticks) {
                            return '$' + value;
...