0

我有通过 GeoJson 加载的数千个功能的 MapBox JS 实现。一项要求是允许用户选择一个标记并能够更新其上的一些数据。我通过处理一个“点击”处理程序并显示一个允许一些新输入的窗口和一个更新按钮来实现这一点，该按钮调用服务器并返回响应。简单的场景。

但是，当更改回调的属性值时，它似乎不会在再次单击时显示新数据。我有以下示例来显示我的过程的简化版本。更新发生在第 160 行。

        // When a click event occurs on a feature open a popup at the
        // location of the feature, which allows upadting
        map.on('click', 'places', function(e) {
            var coordinates = e.features[0].geometry.coordinates.slice();
            var description = e.features[0].properties.description;

            // Ensure that if the map is zoomed out such that multiple
            // copies of the feature are visible, the popup appears
            // over the copy being pointed to.
            while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) {
                coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360;
            }


            new mapboxgl.Popup()
                .setLngLat(coordinates)
                .setHTML(description)
                .addTo(map);

            // change the description value. this is only a POC. 
            // real applications will update data on a server and only then update the description.
            // is this a copy or a reference to the feature?!?
            e.features[0].properties.description = "my new description"; // update happens here - #160
        });

我假设在e.features下的“点击”处理程序上返回的功能是对原始功能的引用，因此可以轻松更改，但似乎并非如此。我看到的唯一替代方法是从源中查询特征、查找原始特征对象、更新它并重置源中的数据，但这似乎开销太大。

这里的正确方法是什么？

4

2 回答 2

0

如果我理解正确，您的工作流程是：

  1. 从服务器加载 GeoJSON
  2. 将 GeoJSON 添加到地图
  3. 用户导致服务器上的更新
  4. 从服务器加载部分 GeoJSON？
  5. ...某物...
  6. 地图现在显示最新的 GeoJSON

对于第 5 步，您有几个备选方案。

最简单的是：

  • 在步骤 1 中，保留 GeoJSON 的副本
  • 在第 4 步中，使用新信息更新该副本（即更新被触摸的单个特征的属性）
  • 在第 5 步中，map.setData()再次调用。
于 2020-05-05T10:59:15.887 回答
0

AFAIK & 根据这个github 问题，目前仍然无法自动和有选择地对您的功能进行差异检查，除非您手动执行此操作。

这个和其他演示setData在每个新的（或者，在您的情况下，更新的）功能的到来时重新完全。

由于数据重新加载，您是否已经遇到了减速/卡顿，或者您即将实施？

于 2020-05-05T08:53:17.763 回答