JSFiddle - React, Tailwind, and code Playground
by Anjali Jain
HTML
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height:300px; width:100%"></div>
JavaScript
var dataPoints = [];
$.get("http://canvasjs.com/wp-content/uploads/samples/data/data.xml",function(data) {
$(data).find('england').each(function(){
var $england = $(this);
var month = $england.find('month').text();
var rainfall = $england.find('rainfall').text();
dataPoints.push({label:month,y:parseInt(rainfall)});
});
var chart = new CanvasJS.Chart("chartContainer", {
title: {
text: "CanvasJS Charts in using AJAX & XML",
},
data: [
{
type: "column",
dataPoints: dataPoints
}
]
});
chart.render();
});