Adding charts to my razor view page

I am creating ASP.net core 2.0 razor page app. 

 I am trying to add a chartjs chart on my index view page but the chart does not come up on button click for some reason.      

index.cshtml.cs has two methods for get:  Task OnGetAsync() and OnGetChart()

OnGetAsyc is called on view load.  I am trying to call OnGetChart on button click.

The OnGetAsync returns proper output.  

my javascript:

$(document).ready(function () {
	console.debug("starting apChart()");$('#chartbtn').on('click', function (event) {
		console.log();
		mapChart();
	});
});

mapChart() simple makes ajax call to the OnGetChart() method which return dataset.  

function mapChart() {
		console.log("mapChart Start");$.ajax({
			type: "GET",
			url: "./SLMS/index?handler=Chart",
			async: false,
			contentType: "application/json; charset=utf-8",
			dataType: "json",
			success: function (chData) {
				var aData = chData;
				var aLabels = aData[0];
				var aDatasets1 = aData[1];
				var dataT = {
					labels: aLabels,
					datasets: [{
						label: "",
						data: aDatasets1,
						fill: false,
						backgroundColor: ["rgba(54, 162, 235, 0.2)", "rgba(255, 99, 132, 0.2)", "rgba(255, 159, 64, 0.2)", "rgba(255, 205, 86, 0.2)", "rgba(75, 192, 192, 0.2)", "rgba(153, 102, 255, 0.2)", "rgba(201, 203, 207, 0.2)"],
						borderColor: ["rgb(54, 162, 235)", "rgb(255, 99, 132)", "rgb(255, 159, 64)", "rgb(255, 205, 86)", "rgb(75, 192, 192)", "rgb(153, 102, 255)", "rgb(201, 203, 207)"],
						borderWidth: 1
					}]
				};
				console.log(aLabels);
				console.log(aDatasets1);
				var ctx = $("#myChart").get(0).getContext("2d");
				var myNewChart = new Chart(ctx, {
					type: 'bar',
					data: dataT,
					options: {
						responsive: true,
						title: { display: true, text: '' },
						legend: { position: 'bottom' },
						scales: {
							xAxes: [{ gridLines: { display: false }, display: true, scaleLabel: { display: false, labelString: '' } }],
							yAxes: [{ gridLines: { display: false }, display: true, scaleLabel: { display: false, labelString: '' }, ticks: { stepSize: 50, beginAtZero: true } }]
						},
					}
				});
			}
		});
	}

view page

<button id="chartbtn" type="button" class="btn btn-info">LoadGraph</button><div Style="font-family:Corbel; font-size:small; text-align:center" class="row"><div style="width:100%;height:100%"><canvas id="myChart" style="padding: 0;margin: auto;display: block;"> </canvas></div></div>