Highcharts Demo

author(s): Øystein Moseng Torstein Hønsi

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js"></script>
<script src="http://code.highcharts.com/maps/highmaps.js"></script>
<script src="http://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="http://code.highcharts.com/mapdata/custom/world-highres.js"></script>

<link rel="stylesheet" type="text/css" href="http://cloud.github.com/downloads/lafeber/world-flags-sprite/flags32.css" />


<div id="container"></div>

CSS

#container {
    height: 500px;
    min-width: 310px;
    max-width: 1500px;
    margin: 0 auto;
}
.loading {
    margin-top: 10em;
    text-align: center;
    color: gray;
}

.f32 .flag {
	vertical-align: middle !important;
}

.highcharts-tooltip>span {
	background: rgba(255,255,255,0.85);
	border: 1px solid silver;
	border-radius: 3px;
	box-shadow: 1px 1px 2px #888;
	padding: 8px;
	font-size: 20pt;
}

JavaScript

$(function () {

    var H = Highcharts,
        map = H.maps['custom/world-highres'],
        chart;
        var json =[{"cityRef":"48208","name":"Toronto","countryCode":"ca","value1":"427","value2":"194275","value3":"194.3 billion","lat":"43.6487","lon":"-79.38545","country":"Canada"},{"cityRef":"63892","name":"Calgary","countryCode":"ca","value1":"59","value2":"198900","value3":"198.9 billion","lat":"51.04522","lon":"-114.06302","country":"Canada"},{"cityRef":"65922","name":"Mississauga","countryCode":"ca","value1":"497","value2":"210456","value3":"210.5 billion","lat":"43.58691","lon":"-79.64535","country":"Canada"},{"cityRef":"59306","name":"Montreal","countryCode":"ca","value1":"200","value2":"118986","value3":"119 billion","lat":"45.51241","lon":"-73.55469","country":"Canada"},{"cityRef":"76553","name":"Vancouver","countryCode":"ca","value1":"65","value2":"56032","value3":"56 billion","lat":"49.26039","lon":"-123.11336","country":"Canada"},{"cityRef":"76587","name":"Edmonton","countryCode":"ca","value1":"24","value2":"2974","value3":"3 billion","lat":"53.54624","lon":"-113.49037","country":"Canada"},{"cityRef":"68360","name":"Winnipeg","countryCode":"ca","value1":"23","value2":"6890","value3":"6.9 billion","lat":"49.89954","lon":"-97.14111","country":"Canada"},{"cityRef":"55328","name":"Ottawa","countryCode":"ca","value1":"1","value2":"233","value3":"233 million","lat":"45.42179","lon":"-75.69119","country":"Canada"},{"cityRef":"96277","name":"Markham","countryCode":"ca","value1":"402","value2":"183161","value3":"183.2 billion","lat":"43.85652","lon":"-79.33982","country":"Canada"},{"cityRef":"81561","name":"Quebec","countryCode":"ca","value1":"6","value2":"1306","value3":"1.3 billion","lat":"46.81275","lon":"-71.2193","country":"Canada"},{"cityRef":"47778","name":"New York","countryCode":"us","value1":"956","value2":"1664181","value3":"1.7 trillion","lat":"40.71455","lon":"-74.00714","country":"United...