基于openlayers、cesium实现二、三维地图切换

3D模型在线预览提供多种低代码平台3D模型在线预览解决方案，实现了将多种3D模型格式无缝集成到低代码业务表单中。这意味着用户可以在不离开低代码平台的情况下，直接查看和操作3D模型，极大地提升了数据可视化的效果和用户交互体验。

场景需求

先搞清楚需求：

1、openlayers加载地图

2、cesium加载三维地图

3、实现二、三维地图切换

4、在vue框架上实现以上功能

实现步骤

用openlayers加载地图

此处略过，虽然简单，但是对于没有接触过gis的前端同学还是有入门门槛的。那既然是要实现以上需求，应该就是要做gis项目的人。既然是做gis项目的，那这个ol加载地图就不应该是难点，官网有很多示例，所以此处略过。

还是给一个示例代码：

用cesium加载三维地图

cesium加载三维地图对于gis行业的同学来说也是个麻烦事，更别说要在vue框架上实现了。

以vuecli3为例，引用cesium其实只用几步：

安装vue-cli-plugin-cesium插件

直接在vue组件中使用

安装好了就可以直接new出来用，因为它已经绑定了vue实例

实现二、三维地图切换

安装olcs插件

这是一个用于实现openlayers与cesium切换的插件

实现二、三维切换

需要注意的就是上面代码中的ol2dMap是openlayers绑定的地图对象，这个业内同学都懂。结合前面的ol示例，就是那个olmap对象。

注意要点

如果有这样的需求：本来是二维地图有个矢量地图，比如一个什么专题图；然后切换到了三维地图，我仍然要能在三维地图上看到那个专题图。

现在切换到三维后，效果是有了，平面变三维地球，问题是之前的那个专题图也看不见了！ 原因就是切换到三维后，二维地图被覆盖了。 解决办法就是，切换到三维后，再用cesium引擎加载平面专题图。

cesium加载平面地图

下面的示例地图是一个aricgis动态服务。