jquery - 使用本地 geoJSON 文件将其添加到我的 MapBox GL JS API 时出错

Question

我的本地路径中有一个包含 7000 个功能的 geoJSON 文件。在我的 ASP.NET MVC 视图（HTML 页面）中使用它来在地图上呈现它。我正在使用 jQuery $.getJSON 函数读取 geoJSON 文件。当我在控制台中检查它时，我发现数据已被读取。但是当我在添加源地图框函数中添加它时，我收到多个错误，指出输入数据不是有效的 GeoJSON 对象并且样式未完成加载。

在 MapboxAPI 中读取和添加的代码

    $("document").ready(function () {
        var datare = $.getJSON("/geojson/SDM769198.geojson", function () {
            console.log("success");
        })
            .done(function () {
                console.log("second success");
            })
            .fail(function () {
                console.log("error");

            })
            .always(function () {
                console.log("complete")
            });

        console.log(datare);
        map.on('load', function () {
            
            map.addSource('vicdata', {
                'type': 'geojson',
                'data': datare
            });
        });

控制台输出 JSON 响应

控制台错误

关于如何将本地数据加载到 Mapbox API 的任何建议？

我尝试了多种将 geoJSON 文件上传到 GitHub 存储库并将它们用作文档中提到的链接的方法，但仍然没有运气。

标签： jqueryjsonmapboxgeojsonmapbox-gl-js

Answer 1

这个错误的原因：

输入数据不是有效的 GeoJSON 对象

是您的输入数据不是有效的 GeoJSON 对象。

您可以使用 geojsonlint.com 来检测此类错误并获取有关如何修复它们的提示。