asp.net mvc 如何加载本地 geojson 文件并将其显示在传单地图上？

Question

我有一个保存在文件夹中的本地 geojson 文件。我想在地图上加载并显示带有标记的坐标。我已成功将地图加载到我的 html 但我无法将数据加载到地图。

       var mymap = L.map('mapid').setView([1.3521, 103.8198], 13);

        L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
            attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
            maxZoom: 18,
            id: 'mapbox/streets-v11',
            tileSize: 512,
            zoomOffset: -1,
            accessToken: 'pk.eyJ1IjoiaGlnaHBpZXMiLCJhIjoiY2p0Nml4NmR1MGhxajRhczA1NGFqZXV0NSJ9.c2tn1B3vCBSVni_W9dXQkQ'
        }).addTo(mymap);
        var hospitals = "~/Content/hospitals.geojson";
        var geojsonMarkerOptions = {
            radius: 8,
            fillColor: "#ff7800",
            color: "#000",
            weight: 1,
            opacity: 1,
            fillOpacity: 0.8
        };
        function onEachFeature(feature, layer) {
            if (feature.properties && feature.properties.Description) {
                layer.bindPopup(feature.properties.Description);
            }
        }
        L.geoJSON(hospitals, {
            onEachFeature: onEachFeature
        }).addTo(map);

这是我收到的错误无效的 GeoJSON 对象

Answer 1

您不能直接使用 L.geoJSON 加载 geojson 文件，您可以使用 Leaflet-Ajax

L.geoJson.ajax(hospitals, {
   onEachFeature: onEachFeature
}).addTo(map);

asp.net mvc 如何加载本地 geojson 文件并将其显示在传单地图上？

How to load local geojson file and display it on leaflet map in asp.net mvc?

javascript

asp.net

model-view-controller

leaflet