我目前正在研究使用 Cesium 作为一种可视化个人项目数据的方式,实时更新将是一件很棒的事情。
阅读 wiki,我发现这部分概述了如何使用 HTML EventSource API 完成 Cesium 中的动态更新对象。
我在 Node.js 中编写了一个相当简单的服务器,它创建了一个text/event-stream
定期发送对象位置更新的服务器。这部分工作正常,我可以成功连接到控制台并将这些数据记录到控制台。
我的问题在于铯。我花了几个小时研究文档(下载中包含的 Github wiki 和 JSDoc 文档),但我不知道如何将我的 CZML 添加到全球。使用源代码提供的 Cesium Viewer 应用程序,我可以看到如何从本地和远程资源加载 CZML 文件,但我不知道如何修改这种方法来摄取来自 EventSource 事件的 CZML 数据包。
我的 CZML 数据包示例:
{
'id': 'myObject',
'availability': '2014-01-15T00:00Z/2014-01-01T24:00Z',
'point': {
'color': {
'rgba': [255, 255, 0, 255]
},
'outlineWidth': 2.0,
'pixelSize': 3.0,
'show': true
},
'position': {
'cartesian': [0.0, -2957000.0, -840000.0, 5581000.0],
'epoch': '2014-01-01T00:00Z',
'interpolationAlgorithm': 'LINEAR',
'interpolationDegree': 1
}
}
我目前的做法如下:
var czmlStream;
var czmlStreamUrl = 'http://127.0.0.1:8080/czml-stream';
viewer.dataSources.add(czmlStream);
var czmlEventSource = new EventSource(czmlStreamUrl);
czmlEventSource.addEventListener('czml', function(czmlUpdate) {
czmlStream.load(JSON.parse(czmlUpdate.data));
}, false);
不幸的是,这不起作用。我基于如何加载静态 CZML 文件:
var source;
var sourceURL = 'http://127.0.0.1/czml-static.czml';
source.loadUrl(sourceURL).then(function() {
viewer.dataSources.add(source);
}
有谁知道我哪里出错了,或者更好的是,这样做的正确方法?我正在使用 Cesium b24 以防万一。如果您需要我提供更多信息以提供帮助,请询问,我会更新问题。
我已经尝试在谷歌上搜索解决方案和示例代码,但除了描述如何使用 EventSource的wiki 页面外,我找不到任何东西。