JSFiddle - React, Tailwind, and code Playground
by Alexandru Gatea
HTML
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer"></div>
<script>
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
theme: "light1",
axisX: {
title: "Time"
},
axisY: {
title: "Intensity",
minimum: 0,
maximum: 100
},
data: [{
type: "column",
indexLabel: "{y}",
dataPoints: [
{ x: 10, y: 40 },
{ x: 20, y: 35 },
{ x: 30, y: 45 },
{ x: 40, y: 30 },
{ x: 50, y: 50 },
{ x: 60, y: 40 },
{ x: 70, y: 45 },
{ x: 80, y: 30 },
{ x: 90, y: 50 }
]
}]
});
chart.render();
}
</script>