javascript - 在 Cesium.js 中使用 GeoJsonDataSource 加载更新数据

Question

我正在尝试将 Cesium 1.11 与现有后端发送 GeoJSON 集成。我能够从第一条消息成功地将数据加载到 View 中，但是对 load() 的后续调用不会更新显示。

我已将问题简化为以下内容，也可用作 fiddle 。

• 我预计第二次加载调用会更新显示以将标记移至纽约，但它仍保留在伦敦。
• 功能窗口仍将“foo”属性显示为 123，我预计为 456。

代码

var viewer = new Cesium.Viewer('cesiumContainer');
var source = new Cesium.GeoJsonDataSource("name123");
viewer.dataSources.add(source);

source.load({
    type: "FeatureCollection",
    crs: {
        type: "name",
        properties: {
            name: "urn:ogc:def:crs:OGC:1.3:CRS84"
        }
    },
    features: [{
        type: "Feature",
        properties: {
            foo: 123,
        },
        geometry: {
            type: "Point",
            coordinates: [0.1275, 51.5072] // London
        },
        id: "123"
    }]
});

// workaround, but has side effect of destroying feature window
// source.entities.removeAll();

// sometime later...
source.load({
    type: "FeatureCollection",
    crs: {
        type: "name",
        properties: {
            name: "urn:ogc:def:crs:OGC:1.3:CRS84"
        }
    },
    features: [{
        type: "Feature",
        properties: {
            foo: 456,
        },
        geometry: {
            type: "Point",
            coordinates: [-75.1890, 42.3482] // New York
        },
        id: "123"
    }]
});

我尝试过的

• 通过调用 source.entities.removeAll()“强制”更新，但是如果功能窗口在更新期间处于打开状态，这会产生关闭功能窗口的副作用。我每秒都收到消息，所以这是不可取的。

• 是的，我知道专有的 CZML 系统，但是对于这个相对简单的系统，我想坚持使用 GeoJSON。

更新:进一步调试。这个问题似乎是一个设计特征......

• GeoJsonDataSource 中的 load() 辅助方法调用 that._entityCollection.removeAll()。这是在 suspendEvents() 和 resumeEvents() 之间，因此不会导致功能窗口关闭。
• 在 resumeEvents()“更改”事件被触发后，即使实体实际上已被重新创建
• 由 Cesium.Viewer 创建的现有 BillboardVisualizer 将缓存实例保存到它第一次呈现时使用的实体
• BillboardVisualizer.update() 不断从“陈旧”实体实例中读取第一个位置，因此看不到任何更新。

Answer 1

这看起来像是 Cesium 中的一个错误，我刚刚提交了 issue #2891，并将尝试在 8 月 3 日的 1.12 版本中进行修复。同时，您应该能够使用 removeAll 策略结合加载后重置所选实体来解决此问题(这应该保留 InfoBox，这就是我认为您所说的功能窗口的意思.) 这是一个完整的示例，您可以将其作为 Sandcastle 的基础来查看它的实际效果。

var viewer = new Cesium.Viewer('cesiumContainer');
var source = new Cesium.GeoJsonDataSource("name123");
viewer.dataSources.add(source);

Sandcastle.addToolbarButton('Load 1', function(){
    source.entities.removeAll();
    source.load({
        type: "FeatureCollection",
        crs: {
            type: "name",
            properties: {
                name: "urn:ogc:def:crs:OGC:1.3:CRS84"
            }
        },
        features: [{
            type: "Feature",
            properties: {
                foo: 123
            },
            geometry: {
                type: "Point",
                coordinates: [0.1275, 51.5072] // London
            },
            id: "123"
        }]
    }).then(function(){
        viewer.selectedEntity = source.entities.values[0];
    });
});

Sandcastle.addToolbarButton('Load 2', function() {
    source.entities.removeAll();
    source.load({
        type: "FeatureCollection",
        crs: {
            type: "name",
            properties: {
                name: "urn:ogc:def:crs:OGC:1.3:CRS84"
            }
        },
        features: [{
            type: "Feature",
            properties: {
                foo: 456
            },
            geometry: {
                type: "Point",
                coordinates: [-75.1890, 42.3482] // New York
            },
            id: "123"
        }]
    }).then(function(){
        viewer.selectedEntity = source.entities.values[0];
    });
});