来自 geoJSON 的 Mapbox 标记未出现在 IE9 中

Question

我有一张从本地 geoJSON 文件加载标记的地图。这适用于我测试过的所有浏览器（FF、Chrome、Safari、Opera、IE10、IE11），但不适用于 IE9。

我在地图上添加了一个没有 geoJSON 的标记（黄色总线标记），它在 IE9 中显示良好。

以下是相关代码：

    // set up mapbox
    var map = new L.mapbox.map('map', '########', {
        tileLayer: {
            detectRetina: true,
            minZoom: 2
        },
        zoomControl: false
    });

    // marker without geoJSON
    L.marker([-37.9, -77], {
        icon: L.mapbox.marker.icon({
            'marker-size': 'large',
            'marker-symbol': 'bus',
            'marker-color': '#fa0'
        })
    }).addTo(map);

    // markers with geoJSON
    var geoJsonData = L.mapbox.featureLayer().loadURL('http://nomacorc.cuberishosting.com/wp-content/themes/nomacorc/map-lib/sellers-locations.php').addTo(map);

您可以在http://nomacorc.cuberishosting.com/purchase-test/ 看到一个工作示例。

这里是geoJSON文件的链接：http://nomacorc.cuberishosting.com/wp-content/themes/nomacorc/map-lib/sellers-locations.php

geoJSON 本身似乎在 http://geojsonlint.com/ 为我验证

Answer 1

看起来这与在 loadURL 函数中调用 JSON 的方式有关。我用 AJAX 提取 JSON 来修复它：

    // url to file with geojson data
    var url = 'http://nomacorc.cuberishosting.com/wp-content/themes/nomacorc/map-lib/sellers-locations.php';

    // load geojson file
    $.getJSON(url, function(data) {

        var featureMarkers = L.mapbox.featureLayer(data, {sanitizer: function(string) {return string;}});

        // The rest of my code here...
    });

Answer 2

将 geoJSON 粘贴到 http://geojsonlint.com/ 时确实收到错误：“无效的 GeoJSON，数据不是 JSON 可序列化的。”

我猜测为什么会发生此错误是您在描述字段中有双引号，这些字段也用双引号括起来。如果您将描述用单引号括起来，这可能会解决它（它还需要您将此字段中的其他单引号替换为双引号）。