score:5

Accepted answer

If you want to use the USA map, you need to change the url to: "https://code.highcharts.com/mapdata/countries/us/us-all.geo.json" and the postal-code from US.MA to MA:

this.mapData.getWorld().then(r => {
  ...
    for (let i in this.state.mapData["features"]) {
      ...
        var postalCode = mapInfo.properties["postal-code"];

        ...
    }
    ...
});

Live demo: https://codesandbox.io/s/highcharts-react-demo-jmu5h

To use the word map, you need to also change the part related with the postal-code and joinBy property:

series: [{
    joinBy: ['iso-a2', 'code'],
    ...
}]

this.mapData.getWorld().then(r => {
    ...
    for (let i in this.state.mapData["features"]) {
      let mapInfo = this.state.mapData["features"][i];
      if (mapInfo["id"]) {
        var code = mapInfo["id"];

        ...
        this.options.series[0].data.push({
          "code": code,
          ...
        });
      }
    }
    ...
});

Live demo: https://codesandbox.io/s/highcharts-react-demo-sxfr2

API Reference: https://api.highcharts.com/highmaps/series.map.joinBy


Related Query

More Query from same tag