Leaflet.js 从 AJAX 添加图层

Question

我有一个 ASP.NET 网站，其中包含一个设置为显示数据的传单地图实例。我有通过 jQuery 更改触发事件的下拉列表，这些下拉列表依次获取下拉值并将它们传递给从服务器检索新数据的 Web 服务。此数据是 geoJson 数据，以字符串的形式返回。尝试将这些新数据应用于地图是行不通的。这是代码，我知道返回的内容是正确的，我已将其输出到 Div，复制并手动加载它，它运行良好。现在把我的头发扯掉了。

我将返回输出到 div 以证明它确实有效...

$("#MainContent_DropDownList1").change(function () {

    $.ajax({

        url: "services/AJAXMapping.asmx/GetNewData",
        dataType: "text",
        type: "POST",
        data: { species: $(this).val() },
        error: function (err) {

            alert("Error: " + err.responseText.toString())

        },
        success: function (data) {

            $("#testarea").html(data);
            geojson.clearLayers();

            geojson = L.geoJson((data), {
                style: choroStyle,
                onEachFeature: onEachFeature
            }).addTo(map);

        }
    });

});

Answer 1

我认为问题在于您没有将 json-string 解析为对象。

geojson = L.geoJson((JSON.parse(data)), {
    style: choroStyle,
    onEachFeature: onEachFeature
}).addTo(map);

或者你可以使用$.parseJSON(data) 来代替JSON.parse(data)，就像你使用jquery一样。

您还可以将 ajax 调用的 dataType 设置为 json，但如果您仍想将 geojson 数据输出到 div，则必须将数据对象转换回字符串。 你可以用JSON.stringify(data)来做到这一点

如果这不能解决您的问题，请发布您收到的错误消息。