Arable land WDI API
by E D
HTML
<!-- highchart library-->
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<!-- div to host the graph -->
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
//jsfiddle javascript parameter: "onload", library used: jquery
// information about the indicator, the country and time span we want:
var indicator="SP.RUR.TOTL.ZS";
var VNMiso3code="VNM";
var KHMiso3code="KHM";
var time=35;
var page=2*35
var country_name;
var indicatorName;
var array_data;
// url of the query
var VNMurl = "https://api.worldbank.org/v2/countries/"+VNMiso3code+"/indicators/"+indicator+"?per_page="+page+"&MRV="+time+"&format=json";
console.log(VNMurl)
var KHMurl = "https://api.worldbank.org/v2/countries/"+KHMiso3code+"/indicators/"+indicator+"?per_page="+page+"&MRV="+time+"&format=json";
console.log(KHMurl)
//---------------- get, parse and store the data ---------------------------
// create set some empty variable to host data
var array_dataVNM = [] // to store data for the X axis
var array_dataKHM = [] // to store data for the X axis
var year_list = [] // to store data for Y axis
$.ajax({
url:VNMurl,
complete: function(json) {
data= JSON.parse(json.responseText);
$.each(data[1], function(i, data) {
//Store indicator name
country_name1 = data.country.value;
console.log(country_name)
// Store indicator label
indicatorName = data.indicator.value;
// fill the date array
year_list.push(data.date);
// fill the string data array
array_dataVNM.push(parseFloat(data.value));
})
}
, error: function() {
console.log('there was an error!');
}
// check the result
}); // end of getjson function
$.ajax({
url:KHMurl,
complete: function(json) {
data= JSON.parse(json.responseText);
$.each(data[1], function(i, data) {
//Store indicator name
country_name2 = data.country.value;
console.log(country_name)
// Store indicator label
indicatorName = data.indicator.value;
// fill the date array
year_list.push(data.date);
// fill the...