如何在 Folium 地图中动态呈现 Flask 服务器发送的 GeoJSON 数据？

在 Folium 地图中显示 Flask 服务器发送的 GeoJSON 数据

问题

在 GUI 地图上实时显示纬度和经度数据时遇到困难。从 Flask 服务器发送的数据无法在地图中正确呈现。

解决方案

1. Flask 服务器设置

确保 Flask 服务器运行在端口 5000 上，并提供 GeoJSON 数据。检查 random_position.geojson 路径是否正确。

2. Folium Realtime 插件

在 Folium 中使用 Realtime 插件，将 interval 设置为较短的时间间隔，如 1000 毫秒，以更频繁地更新地图。

3. 代码调整

调整 plot_flight_path 函数中 JsCode 函数中的 f 为 feature。确保 feature_collection JSON 数据格式正确。

4. 排查错误

检查浏览器的控制台是否有错误消息。发送简单的 GeoJSON 文件到 Flask 服务器的 random_position.geojson 路径，以验证服务器是否正确发送数据。

代码示例

Flask 服务器

from flask import Flask, jsonify
import random

app = Flask(__name__)

@app.route('/random_position.geojson')
def random_position():
    # ... same code as before

    return jsonify(feature_collection), 200, {'Content-Type': 'application/json'}

if __name__ == '__main__':
    app.run(debug=True, port=5000)

Folium 地图

def plot_flight_path(self):
    # ... same code as before

    rt = folium.plugins.Realtime(
        "http://127.0.0.1:5000/random_position.geojson",
        get_feature_id=JsCode("(feature) => { return feature.properties.objectid; }"),
        interval=1000,
    )

    rt.add_to(self.m)

    # ... same code as before

注意事项

确保所发送的 GeoJSON 数据符合规范，调整 interval 以找到最合适的更新频率。如果问题仍然存在，请检查代码中的拼写和语法错误。

常见问题解答

1. 我无法在地图中看到数据，但控制台没有显示错误。
   检查 random_position.geojson 中 GeoJSON 数据的格式是否正确。

2. 数据在地图上显示不正确。
   检查坐标是否在正确的范围内，并且 GeoJSON 数据符合规范。

3. 地图更新频率太慢。
   尝试缩短 interval 值以增加更新频率。

4. 我收到了 Invalid JSON 错误。
   检查 Flask 服务器是否正确返回 JSON 数据。

5. 我得到 Request failed with status code 404 错误。
   确保 Flask 服务器正在运行并且 random_position.geojson 路径正确。