在传单中显示关系（踪迹）

Question

全部，

当我转到这个 url: OpenStreetMap 时，我看到一张地图上面有一个“关系”（我假设这是显示的路径的术语）。

我正在尝试让这条线索也显示在我使用 django-leaflet 的 Django 网站上。

目前我的代码如下所示：

<script>
    function map_init_basic (map, options) {
        map.setZoom(16);
        map.setView([51.6020, 4.8514]);
    }
</script>
{% leaflet_map "trailmap" callback="window.map_init_basic" %}

这会将地图设置为正确的区域，但我该如何添加实际路径？

致以最崇高的敬意。

Answer 1

在地图上添加路径非常简单。您应该能够在 map_init_basic() 函数的底部添加一行代码，例如 L.polyline(latlngs).addTo(map); （其中 latlngs 是定义路线的 [lat, lng] 坐标对的数组你的踪迹）；或 L.geoJSON(trail).addTo(map);（其中 trail 是 GeoJSON format object that describes the trail). See the Leaflet documentation for Polyline and GeoJSON 以获得更多详细信息。

更复杂的部分是如何获取 lat/lng 跟踪数据。一种方法是使用 Overpass Turbo 在线 API 从 OpenStreetMap 检索数据。在 Overpass window 的左侧输入以下查询，点击 'Run'，然后切换到 'Data' 选项卡以查看结果：

rel(6754945);  // Id number of the OSM Relation to fetch.
(._;>;);
out;

数据选项卡应显示构成编码为 OSM XML 文件的轨迹的点。您可以复制它并操作文本以提取坐标，或者使用 Overpass 中的 'Export' 菜单将数据下载为 GeoGSON 或各种其他格式。将数据放到地图上的最佳方式取决于应用程序的详细信息，但如果 data 是一个包含路线 GeoJSON 的字符串，那么这会将其添加到地图上：

L.geoJSON(JSON.parse(data)).addTo(map);

在 How to convert an OSM relation to a list of lat/lng points?

的回答中描述了获取路径坐标的其他一些选项

Answer 2

使用OSMPythonTools您可以使用天桥API从OSM数据库中获取轨迹关系，并将其几何提取为坐标数组：

from OSMPythonTools.overpass import Overpass
overpass = Overpass()

def fetch_relation_coords(relation): 
    rel = overpass.query('rel(%s); (._;>;); out;' % relation)
    coords = [el.geometry().coordinates for el in rel.elements() if el.type() == 'node']

    # Convert (lng, lat) to (lat, lng)
    latlngs = [[x[1], x[0]] for x in coords]

    return latlngs

latlngs = fetch_relation_coords("6754945")

# [[51.602685, 4.861282], [51.60629, 4.851437], [51.599504, 4.838481], [51.599561, 4.839231], ...]

我对 Django 不够熟悉，无法理解如何将生成的坐标数组放到您的网页上，但是一旦您在 Javascript 中有了它，您就可以将它作为折线添加到 Leaflet 地图上与：

 L.polyline(latlngs).addTo(map);

在传单中显示关系（踪迹）

Display relation (trail) in leaflet

openstreetmap

leaflet

django-leaflet