I am trying to create an html cluster map using Mapbox, but “cluster”: true is not creating a “point_count” attribute. I can confirm that the geojson is loaded correctly and individual point markers appeared when “cluster”:true was removed.

Current approach

var geoData = {
                "type": 'FeatureCollection',
                "features": [
                    {
                        "type": "Feature",
                        "geometry": {
                            "type": "Point",
                            "coordinates": [-72.4050504,40.90369252]
                        },
                        "properties": {
                            "title": "title",
                            "description": "description"
                        }
                    },
                    {
                        "type": "Feature",
                        "geometry": {
                            "type": "Point",
                            "coordinates": [-72.40584471,40.89771544]
                        },
                        "properties": {
                            "title": "title",
                            "description": "description"
                        }
                    }
                ]
            };

map.addSource('crash', {
                        type: 'geojson',
                        data: geoData,
                        cluster: true,
                        clusterMaxZoom: 10, // Max zoom to cluster points on
                        clusterRadius: 50 // Radius of each cluster when clustering points (defaults to 50)
                    });

                map.addLayer({
                        id: 'clusters',
                        type: 'circle',
                        source: 'crash',
                        filter: ['has', 'point_count'],
                        paint: {
                            'circle-color': "#f1f075",
                            'circle-radius': 40
                        }
                    });
                    map.addLayer({
                        id: 'cluster-count',
                        type: 'symbol',
                        source: 'crash',
                        filter: ['has', 'point_count'],
                        layout: {
                            'text-field': '{point_count_abbreviated}',
                            'text-font': ['Arial Unicode MS Bold'],
                            'text-size': 12
                        }
                    });
                    map.addLayer({
                        id: 'unclustered-point',
                        type: 'circle',
                        source: 'crash',
                        filter: ['!', ['has', 'point_count']],
                        paint: {
                            'circle-color': '#11b4da',
                            'circle-radius': 5,
                            'circle-stroke-width': 0.8,
                            'circle-stroke-color': '#fff'
                        }
                    });

Desired approach

I was expecting hoping to recreate the styles in this mapbox example: https://docs.mapbox.com/mapbox-gl-js/example/cluster/

Mapbox example of HTML cluster map