Highcharts Demo

author(s): Torstein Hønsi

by metalshark7

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
   <script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

var getJSON = function(url, successHandler, errorHandler) {
	var xhr = typeof XMLHttpRequest != 'undefined'
		? new XMLHttpRequest()
		: new ActiveXObject('Microsoft.XMLHTTP');
	xhr.open('get', url, true);
	xhr.responseType = 'json';
	xhr.onreadystatechange = function() {
		var status;
		var data;
		// https://xhr.spec.whatwg.org/#dom-xmlhttprequest-readystate
		if (xhr.readyState == 4) { // `DONE`
			status = xhr.status;
			if (status == 200) {
				successHandler && successHandler(xhr.response);
			} else {
				errorHandler && errorHandler(status);
			}
		}
	};
	xhr.send();
};

var Series = [];


getJSON('https://intelligen.outsystemscloud.com/IntelligenServices/rest/Indicadores/Demograficos?cvegeo=2&year=', function(data) {
	for(var i in data) {    
		var item = data[i];   
		var Serie = [];
		Serie.push(item.year);
		Serie.push(item.pob);
    Serie.push(item.pobh);
    Serie.push(item.pobm);
		Series.push(Serie);
	}
}, function(status) {
	alert('Something went wrong.');
});

Highcharts.chart('container', {

    chart: {
        type: 'column'
    },

    title: {
        text: 'Data input as column arrays'
    },

    data: {
        columns: Series
    }
});