我目前正在将我为 OpenLayers 创建的特殊动态图层类型从 OL2 迁移到 OL3。该图层显示在预定义轨迹上移动的标记(其中很多,通常大约 1000 个)。轨迹以特殊的 JSON 格式从服务器加载。
我当前的 OL2 方法非常高效,经过大量优化并使用 Raphael 库 ( http://raphaeljs.com/ )。一般应用程序布局如下所示:
- OpenLayers2 已加载,地图已创建
- 创建了一个特殊的层“DynLayer”,它模仿 OL2 自己的 VectorLayer。该层处理与 OL2 的通信(缩放、平移、拖动等),并提供非常复杂的异步机制来根据当前交互(例如,如果用户刷新率下降)重绘到地图(即移动标记)当前正在平移到地图以防止出现口吃效果)。在构建过程中,DynLayer 创建一个 Raphael SVG 层并将其附加到 DOM 中。如果地图被平移或缩放,则 Raphael 图层由 DynLayer 同步。
- 然后在 SVG 层上创建标记,并定期更新它们的位置
这种方法非常有效,并且因为 Raphael 支持较旧的 IE 版本,它也可以在 IE8 和 IE7 中运行。它还使我能够提供基于 Raphaels 内置动画方法的动画。
我现在正在尝试将此应用程序迁移到 OL3,但我不能 100% 确定最好的方法是什么。OL3 加载后是否可以在 OL3 中添加自定义层?如果是这样,是否有任何文件?我尝试实现自己的 VectorLayer 版本,但 OL3 引发了大量与 Closure API 提供的 goog 对象相关的错误。
更一般地说:重新创建我的旧方法并在 OL3 之上绘制一个 Raphael 层会更好吗?这种方法可以让我重用我以前的大部分代码。还是应该使用 OL3 提供的方法直接在 HTML5 画布上绘制?如果是这样,我怎样才能控制画布的刷新率?
我让我看了一下http://ol3js.org/en/vector-api/examples/dynamic-data.html?q=dynamic上的示例,但它并没有真正满足我的需求。标记在无限循环中进行动画处理,我需要对刷新率进行特定控制。更一般地说,如何防止我的标记在 OL3 自己的画布刷新之一中被删除(例如,如果加载了新的图块)。
我对 OL3 的总体印象是,添加自己的扩展比使用 OL2 更难,对我来说,它似乎比 OL3 更“开放”。
谢谢你的帮助!