MapChart with "countries/us/us-all"

Question

I can't bind the high map us all countries.

I am having error in data series, below is my map configuration.

importing files

import { MapChart } from 'angular-highcharts';
import * as Highcharts from 'highcharts/highmaps';
import * as usJson from 'src/assets/maps/us-all.geo.json';

map configuration

new MapChart({
            chart: {
                map: usJson
            },
            title: {
                text: "Highmaps basic demo"
            },
            subtitle: {
                text:
                    'Source map: <a href="http://code.highcharts.com/mapdata/custom/world.js">World, Miller projection, medium resolution</a>'
            },
            mapNavigation: {
                enabled: true,
                buttonOptions: {
                    alignTo: "spacingBox"
                }
            },
            legend: {
                enabled: true
            },
            colorAxis: {
                min: 0
            },
            series: [
                {
                    type: 'mappoint',
                    mapData: usJson,
                    name: 'Cities',
                    data: [
                        {
                            "value": 438,
                            "code": "nj"
                        },
                        {
                            "value": 387.35,
                            "code": "ri"
                        }
                    ]
                }],

        });
    }

}

Also added highmaps module in app module file.

*here is all series data link. https://cdn.jsdelivr.net/gh/highcharts/[email protected]/samples/data/us-population-density.json