Kodjo
Posts: 5
Joined: Thu Oct 21, 2021 3:23 am

Maps with Bubbles instead of colored countries

Hi team.

here is the map option I have.
I want to build a bubble map, but everytime i set type: 'mapbubble', in the series the map become all grey. Without specifying the mapbuble type I have a mono color over the countries instead.
Anything I am doing wrong here ?

Thanks
K

Code: Select all


const mapOptions = {
    chart: {
        map: mapDataIE,
        borderWidth: 0
    },
    title: {
      text: ''
    },
    credits: {
        enabled: false
    },
    legend:{
      enabled: false
    },
    borderColor: "#343a40",
    mapNavigation: {
      enabled: true,
      enableDoubleClickZoomTo: true,
      buttonOptions: {
          theme: {
              fill: '#eead2200',
              'stroke-width': 0,
              stroke: '#eead2200',
              r: 0,
              states: {
                  hover: {
                      fill: '#eead2200'
                  },
                  select: {
                      stroke: '#eead2200',
                      fill: '#eead2200'
                  }
              }
          },
          verticalAlign: 'bottom'
      },
      buttons:{
        zoomIn: {
          text: ""
        },
        zoomOut: {
          text: ""
        }
      }
    },
    series: [{
    name: 'Countries',
    color: '#E0E0E0',
    enableMouseTracking: false
},{
  type: 'mapbubble',
    borderWidth:0,
    borderColor: '#a8a8a8',
    nullColor: '#a8a8a8',
    joinBy: ['hc-key'],
    data: data,
    minSize: 9,
    maxSize: 9,
    cursor: 'pointer' 
  }]
  }
    
   
magdalena
Posts: 517
Joined: Tue Aug 24, 2021 1:32 pm

Re: Maps with Bubbles instead of colored countries

Hi,

Thanks for contacting us with your question!

Your chart config looks correct: https://jsfiddle.net/BlackLabel/xe6fjs97/

I suppose that problem is with the proper use of joinBy option.

API Reference:
https://api.highcharts.com/highmaps/plo ... ies.joinBy

Could you please provide your data and map that you use or reproduce your examplee to the online editor? You can use the demo above.

Regards!
Magdalena Gut
Developer and Highcharts Support Engineer
Kodjo
Posts: 5
Joined: Thu Oct 21, 2021 3:23 am

Re: Maps with Bubbles instead of colored countries

Thanks for the tip, indeed I needed to use "joinBy: ["iso-a3", "code3"],"
It works.
magdalena
Posts: 517
Joined: Tue Aug 24, 2021 1:32 pm

Re: Maps with Bubbles instead of colored countries

You're welcome! In case of any further questions, feel free to contact us again.
Magdalena Gut
Developer and Highcharts Support Engineer

Return to “Highcharts Maps”