angularjs - geojson の Angular Leaflet MarkerCluster

Question

マップにリーフレット MarkerCluster を表示したいのですが、問題は GeoJSON からデータを取得することです。

{
    "type": "FeatureCollection",
    "features": 
    [
        {
            "type": "Feature",
            "id": "sto",
            "properties": {
                "name": "Stoke"
            },
            "geometry": {
                "type": "Point",
                "coordinates": [
                   -0.0731,
                   51.5615
                ]
            }
        },
        {
            "type": "Feature",
            "id": "dal",
            "properties": {
                "name": "Dalston"
            },
            "geometry": {
                "type": "Point",
                "coordinates": [
                    -0.070,
                    51.545
                ]
            }
        },
        {
            "type": "Feature",
            "id": "wan",
            "properties": {
                "name": "Wandsworth"
            },
            "geometry": {
                "type": "Point",
                "coordinates": [
                    -0.1924,
                    51.4644
                ]
            }
        },
        {
            "type": "Feature",
            "id": "batt",
            "properties": {
                "name": "Battersea"
            },
            "geometry": {
                "type": "Point",
                "coordinates": [
                    -0.1677,
                    51.4638
                ]
            }
        }
    ]
}

2 つの例で同じ状況を再現しようとしました。

1. MarkerCluster は機能していますが、geojson データはありません
2. 2 番目に geojson を使用しますが、MarkerCluster は機能しません

2 番目の例の MarkerCluster が表示されない理由を知っている人はいますか? geojson の一部の属性を見逃していませんか?

Answer 1

このようなことを試すことができます（ディスカッションとコードスニペットはこちら）

// Get the countries geojson data from a JSON
$http.get("test.geojson").success(function(data, status) {
    addGeoJsonLayerWithClustering(data);

    function addGeoJsonLayerWithClustering(data) {
        var markers = L.markerClusterGroup();
        var geoJsonLayer = L.geoJson(data, {
            onEachFeature: function (feature, layer) {
                layer.bindPopup(feature.properties.Nome.value);
            }
        });
        markers.addLayer(geoJsonLayer);
        leafletData.getMap().then(function(map) {
            map.addLayer(markers);
            map.fitBounds(markers.getBounds());
        });
    }

});