OpenLayers实现不同地图卷帘对比

使用到的Openlayers版本 7x-10x都可以,结合vue3.

先来看下效果:

这个功能不能直接复刻官网上的layer-swipe。因为在实际项目中没有人会用input滑动条来滑动地控制地图范围。基本上都是地图中间放个分界线来滑动,因此需要改动操作方式。

另外使用到的核心原理其实还是裁剪。根据中间分割线的位置,计算位于上层的图层的宽高,然后重新渲染,这里的上层的意思就是按照zindex的顺序,位于上层的那个图层。

所谓的重新渲染其实还是利用了裁剪的原理,比如当滑块滑动的时候,那么上层图层的宽是在不断变化的,然

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

WebGIS小智

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值