JSFiddle - React, Tailwind, and code Playground

by Preeti_Patial

HTML

<!-- I am facing an issue when updating the datapoints of canvas chart, and the error message says “Uncaught TypeError: Cannot read property ‘getTime’ of undefined”. Below is my html (I am making ajax call to update the datapoints) -->

<html>

<body>
  <a href="javascript:void(0);" onclick="ajax_statistics_graph_data();"><button type="button" class="btn btn-warning btn-flat">Today</button></a>
  <div id="chartContainer" style="height: 289px; width: 100%;"></div>

</body>
</html>

JavaScript

//I get data on ajax succes:-> "{x:new Date(2020,02,24),y:2},"

function ajax_statistics_graph_data(){
alert("hello");
	/* var GraphData=[];
	$.ajax({type:"POST",url:"here_is_my_php_file_path",data:{Actval:Actval},
	  success:function(ajax_data){
	    
	    
	    // var GraphDataPoints =  JSON.parse(ajax_data);
	    GraphData.push({name:"Total Patients",type:"column",lineThickness:1,color:"#F16D0C",markerSize:0,axisYType:"primary",axisYIndex:0,dataPoints:[ "{x:new Date(2020,02,24),y:2},"]});
	    var chart_appointments = new CanvasJS.Chart("chart-appointments", {
	      animationEnabled: true,
	      axisX:{
	        // interval: 1,
	        // intervalType: "hour",
	        valueFormatString: "DDDD",
	        interval: 1,
	        intervalType: "day"
	      },
	      axisY:{gridColor:"#aaa",gridDashType:"dot",titleFontSize:12,titleFontWeight:600,labelFontSize:11,valueFormatString:"####0.#",minimum:0},		
	      toolTip:{enabled:true,shared:true,fontSize:11,borderThickness:1},	
	      data:GraphData
	
	    });chart_appointments.render();
	}}); */
}