Basic Column Chart - CanvasJS

Basic Column Chart

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", {
  title:{
    text: "Basic Column Chart"
  },
  axisX: {
  	labelFormatter: (e) => {
    	return e.label;
    }
  },
  data: [{				
    dataPoints: [
      { x: new Date("2020"), y: 71, label: "label 1" },
      { x: new Date("2021"), y: 55, label: "label 2" },
      { x: new Date("2022"), y: 50, label: "label 3" },
      { x: new Date("2023"), y: 65, label: "label 4" },
      { x: new Date("2024"), y: 95, label: "label 5" },
      { x: new Date("2025"), y: 68, label: "label 6" },
      { x: new Date("2026"), y: 28, label: "label 7" },
      { x: new Date("2027"), y: 34, label: "label 8" },
      { x: new Date("2028"), y: 14, label: "label 9" }
    ]
  }]
});

chart.render();