JSFiddle - React, Tailwind, and code Playground

HTML

<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

window.onload = function () {

var result = @Html.Raw(ViewBag.DataPoints);
var dataPoints = [];
for(var i = 0; i < result.length; i++){
	dataPoints.push({x:result[i].x, y:result[i].y});
}

var chart = new CanvasJS.Chart("chartContainer", {
    animationEnabled: true,
    title: {
        text: "MVC Chart"
    },
    data: [
    {
        type: "column",
        click: onclick,
        dataPoints: dataPoints,
    }
    ]
});
chart.render();

	function onClick(e) {
		alert(  e.dataSeries.type + ", dataPoint { x:" + e.dataPoint.x + ", y: "+ e.dataPoint.y + " }" );
	}
}