如何在 GraphHopper 中添加 GeoJSON 层？

Question

我有一个 GeoJSON 文件，其中包含我希望能够在单独的 GraphHopper 层中显示的 POI。经过几次尝试并在互联网上搜索，我就是无法找到一种方法。

这是 GeoJSON 文件的一个示例（我用 JSON 验证器检查了整个文件，一切正常）。

{"type": "特征", “特性”： { “费用”：“不”， "bicycle_parking": "锚点", “参考”：“PVNAN23”， “地址”：“Rue Gabriel Goudy 44200 Nantes”， "name": "皮米尔 P+R", “容量”：“24”， "park_ride": "是的", "便利设施": "bicycle_parking", “覆盖”：“是” }, “几何”：{“类型”：“点”，“坐标”：[-1.5406709, 47.1960031]}}， {“类型”：“特征”， “特性”： { "bicycle_parking": "支架", “地址：邮政编码”：“44000”， “地址：国家”：“法国”， “名称”：“玛德琳”， “容量”：“6”， "便利设施": "bicycle_parking", "addr:street": "chaussée de la Madeleine", “注意”：“验证”， “地址：城市”：“南特”， “覆盖”：“不”， “地址：门牌号”：“35” }, “几何”：{“类型”：“点”，“坐标”：[-1.55076671448, 47.21000114109]}}

]}

我尝试了How to load external geojson file into leaflet map 中的说明，但无法正常工作。

Answer 1

如果您的 JSON 有效，并不意味着您正在使用有效的 GeoJSON 对象。例如：{"foo": "bar"} 是完全有效的 JSON，但绝不是有效的 GeoJSON 对象。 L.GeoJSON，leaflet 的 GeoJSON 层需要一个 FeatureCollection 或一个包含 Features 的数组。

一个有效的 FeatureCollection：

{
    "type": "FeatureCollection",
    "features": [{
        "type": "Feature",
        "properties": {
            "id": 1
        },
        "geometry": {
            "type": "Point",
            "coordinates": [0,0]
        }
    },{
        "type": "Feature",
        "properties": {
            "id": 2
        },
        "geometry": {
            "type": "Point",
            "coordinates": [1,1]
        }
    }]
}

或者只是具有特征的数组：

[{
    "type": "Feature",
    "properties": {
        "id": 1
    },
    "geometry": {
        "type": "Point",
        "coordinates": [0,0]
    }
},{
    "type": "Feature",
    "properties": {
        "id": 2
    },
    "geometry": {
        "type": "Point",
        "coordinates": [1,1]
    }
}]

（请注意，只有一组特征不是有效的 GeoJSON 对象，但 Leaflet 会毫无问题地处理它）

要将这些加载到 L.GeoJson 层中，您需要在脚本中使它们可用。您可以在创建图层之前简单地声明对象。例如：

// Declare GeoJSON object
var geojson = {
    type: "FeatureCollection",
    features: [
        // Features here
    ]
}

// Create a new GeoJSON layer with geojson object
// And add to map (assuming your map instance is assigned to "map")
var layer = new L.GeoJSON(geojson).addTo(map);

但是，当您拥有大量功能时，这将变得一团糟，并且将逻辑和数据分开总是更好，因此您应该将数据对象放在单独的文件中。因此，假设您将对象存储在一个名为“geo.json”的文件中，然后您可以使用您选择的 XHR/AJAX 解决方案加载该文件。我在以下示例中使用 jQuery：

// Fetch geo.json file and assign the data to geojson variable
$.getJSON('geo.json', function (geojson) {
    // Create a new GeoJSON layer with GeoJSON object
    // And add to map (assuming your map instance is assigned to "map")
    var layer = new L.GeoJSON(geojson).addTo(map);
});

这是一个关于 Plunker 的工作示例：http://plnkr.co/edit/Mh8p4F?p=preview