【问题标题】:Rerender page after Leaflet drawing with flask, ajax使用烧瓶、ajax 绘制传单后重新渲染页面
【发布时间】:2020-05-01 19:10:59
【问题描述】:

您好,我正在开发一个带有 Flask 和 Leaflet 地图的应用程序。地图上有几何对象。在绘图工具的帮助下,用户在地图上绘制多边形形状,并且所有落在形状内的对象数据(即“id”)都应该在 html 表格中呈现。 绘制形状后,POST 请求就完成了。虽然我可以在 traceback 中打印出数据并在 Devtools Network Preview 选项卡中看到它,但我仍然无法在 html 中呈现这些数据。

这是我在绘制形状后发送 Post 请求的 JS 代码。输出给出形状顶点坐标。

mymap.on('pm:create', e => {
    var map_data = e["layer"]["_latlngs"][0];
    console.log(map_data);
    $.ajax({
      type: "POST",
      contentType: "application/json",
      url: "/",
      traditional: "true",
      data: JSON.stringify({map_data}),


      });
});

然后我用这个坐标分配一个变量并在 app.py 中打印出来。使用不同的地理工具功能,我还资助了多边形内的东西:

shape_coord = request.get_json() //gets shape coordinates

if shape_coord:
 filter_markers = marker_within_polygon(markers, shape_coord) //function finds markers within shape
 filter_lines = lines_within_polygon(lines, shape_coord)//function finds lines within shape

 print(shape_coord)// OK
 print(filter_markers, filter_lines)//OK. prints out stuff inside polygon

这是我的 jinja2:

<tbody id="table_body">

                        {% for mk in  filter_markers%}
                            <tr>
                                {% for ln in filter_lines %}
                                     <th>{{ ln }}</th>
                                     <th>{{ mk }}</th>
                                {% endfor %}
                             </tr>
                        {% endfor %}
 </tbody>

我尝试像这样在 Ajax 中使用成功回调,但除了需要的数据之外,它还会在表格中插入整个 HTML 正文标记:

mymap.on('pm:create', e => {
    var map_data = e["layer"]["_latlngs"][0];
    console.log(map_data);
    $.ajax({
      type: "POST",
      contentType: "application/json",
      url: "/",
      traditional: "true",
      data: JSON.stringify({map_data}),
      success: function (data) {
                    $("#table_body").html(data);

      });
});

我怎样才能只渲染我的标记和线条数据?

【问题讨论】:

    标签: javascript python ajax flask leaflet


    【解决方案1】:

    我解决了这个问题。成功取决于正确的问题) 我在这里找到了答案: Query ajax response not displaying when returning to current page

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2021-04-02
      • 1970-01-01
      • 2021-07-19
      • 2018-04-17
      • 1970-01-01
      • 2018-03-25
      • 1970-01-01
      相关资源
      最近更新 更多