JSFiddle - React, Tailwind, and code Playground
HTML
<div id="chartContainer" style="height: 360px; width: 100%;"></div>
<script src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
JavaScript
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
height: 300,
title: {
text: "Simple Column Chart with Index Labels"
},
axisY: {
minimum: 0,
maximum: 100,
suffix: "%"
},
data: [{
type: "column", //change type to bar, line, area, pie, etc
indexLabel: "{y}", //Shows y value on all Data Points
dataPoints: [{
"x": new Date("2019-03-26T00:00"),
"y": 30
},
{
"x": new Date("2024-02-14T00:00"),
"y": 0.2,
"indexLabel": "0",
"toolTipContent": "{x}: 0",
"highlightEnabled": false
}
]
}]
});
chart.render();
}