Highmaps multiple series without disable one - Javascript highcharts

Javascript examples for highcharts:Chart Series

Description

Highmaps multiple series without disable one

Demo Code

ResultView the demo in separate window

<html>
   <head> 
      <title>Turkey - Highmaps</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.js"></script> 
      <style id="compiled-css" type="text/css">

#container {//from  w  w w. j a  v a2s. c om
   height: 500px;
   min-width: 310px;
   max-width: 800px;
   margin: 0 auto;
}
.loading {
   margin-top: 10em;
   text-align: center;
   color: gray;
}


      </style> 
      <script type="text/javascript">
$(function () {
    Highcharts.mapChart('container', {
        chart: {
            spacingBottom: 20
        },
        title: {
            text: 'Multiple Map Serie'
        },
        legend: {
            enabled: true
        },
        plotOptions: {
            map: {
                allAreas: false,
                mapData: Highcharts.maps['countries/tr/tr-all'],
                tooltip: {
                    headerFormat: '',
                    pointFormat: '{series.name}-{point.name}: <b>{point.value}</b>'
                }
            }
        },
        series:  [
            {
                allAreas: true,
                showInLegend: false
            },
            {
                name: 'AAA',
                data: $.map(['tr-an','tr-iz'], function (code) {
                    return { "hc-key": code , value : 150};
                })
            },
            {
                name: 'BBB',
                data: $.map(['tr-ib','tr-or'], function (code) {
                    return {  "hc-key": code , value : 122};
                })
            }
        ]
    });
});

      </script> 
   </head> 
   <body> 
      <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/countries/tr/tr-all.js"></script> 
      <div id="container"></div>  
   </body>
</html>

Related Tutorials