Risk - Business Units Location

Business Units

by Amit Sinha

HTML

<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="https://code.highcharts.com/mapdata/custom/world.js"></script>

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

CSS

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

JavaScript

// Prepare demo data
// Data is joined to map using value of 'hc-key' property by default.
// See API docs for 'joinBy' for more info on linking data and map.
var data = [
    ['us', 0],
    ['ru', 1],
    ['af', 2],
    ['gb',3]
];
var mapData = 'custom/world';
// Create the chart
var bumap = function(){
$('#container').highcharts('Map', {
//Highcharts.mapChart('container', {
    chart: {
        map: mapData
    },
		credits: {
                enabled: false
            },
    title: {
        text: 'Risk Map'
    },
	exporting: {
  				enabled: false,
            //sourceWidth: 600,
            //sourceHeight: 500
        },
   /* mapNavigation: {
        enabled: true,
        buttonOptions: {
            verticalAlign: 'bottom'
        }
    },*/
    legend: {
         enabled: false
            },
    series: [{
        data: data,
        name: 'Risk',
        color: '#c6ac19',
        states: {
            hover: {
                color: '#BADA55'
            }
        },
        dataLabels: {
            enabled: true,
            format: '{point.hc-key}'
        },
        /////////
        
        point: {
                    events: {
                        // On click, look for a detailed map
                        click: function (e) {
                            var name = this.name;
                            var Key = this["hc-key"];
                            
                            console.log(Key);
														
                            //$('#container').highcharts().destroy();
                           
                      
                        }
                    }
                }
        ////////
    }]
});
};

bumap();