记录在使用leaflet-rotate-src.js时遇到的旋转拖动问题

最新推荐文章于 2024-04-30 16:57:21 发布
最新推荐文章于 2024-04-30 16:57:21 发布
阅读量205 收藏
点赞数 2
分类专栏： Android 文章标签： javascript android 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/n2726213998_zxc/article/details/136940698
版权

问题： leaflet

设置开启旋转时双指缩放旋转后添加的图层无法跟着缩放和移动，比如geoGSON数据层
只有底图瓦片可以移动和缩放了，除非手指离开屏幕

先公布我的修复方案
找到leaflet-rotate-src.js文件中的setBearing方法把*this.fire(‘rotate’);*方法注释掉问题解决

未修改的样子👇🏼

未修改例图

修改完成👇🏼

修改完毕例图

这是改完后的样几👇🏼
第一张，无问题的图

问题明显👇🏼
问题图片例图
蓝色的是添加的geoJSON数据，双指移动中并没有跟着移动、缩放。

寻梦少年`
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
leaflet-rotate：Leaflet插件，允许添加旋转功能以映射图块
02-13
单张旋转 一个Leaflet插件，允许向地图图块添加旋转功能 有关工作示例，请参见以下 最初基于IvánSánchezOrtega的（请参阅： ） 旁注： 请注意，这是一个概念证明，显示了如何更改核心传单库以及如何将旋转功能用作独立插件。 如果您想使用更稳定和可靠的解决方案，请查看fnicollet的分支。 与以下项目相比，已对该项目的最新更改进行了更新： : : （参考： ） 兼容： 贡献者： ， ， ，
Leaflet中根据数据绘制的polygon存在变形的问题
Banterise的博客
02-26 518
之前做过通过Turf生成圆的polygon数据，用Leaflet加载其生成的geoJson存在变形，通过对数据的反复尝试，发现当geojson中，是由于多边形经纬度数组的头个数据和结尾数据相同导致的（应为Leaflet本身的bug），临时解决方案是对该结果数据进行处理，对结尾数据的经纬度进行微度调整（例如±0.0001）。 ...
leaflet关于旋转地图问题
黄-小智的博客
02-12 2727
leaflet关于旋转地图问题 openLayers支持地图旋转，但要满足其他的功能需求，其文档和使用方式都相对比较复杂 据官网leaflet是无法支持地图在web端旋转的，但是可以借助大佬的改造，添加了setBearing方法，可以完成 leaflet-rotate地址 第一步：引用leaflet和大佬的leaflet-rotate（上面链接获取） 第二步：调用setBearing方法或地图初始化是使用bearing 在源码中方法的位置（./dist/leaflet-rotate-src.js）：
leaflet、leaflet-draw、leaflet-toolbar、leaflet-draw-toolbar源码编译
wang_390486690的专栏
10-13 755
一、leaflet源码编译 1、安装cnpm npm install -g --registry=https://registry.npm.taobao.org cnpm 2、使用cnpm安装所需模块 cnpm install rollup rollup-plugin-git-version rollup-plugin-json git-rev-sync cnpm install -g uglify...
leaflet动态添加路线使用插件--L.Polyline.AntPath
m0_61177996的博客
09-14 1323
leaflet动态添加路线使用插件--L.Polyline.AntPath
leaflet-vector-scalar-js:基于leaflet.js实现的矢量、标量数据可视化Demo
05-28
leaflet-vector-scalar-js 基于leaflet.js实现的矢量、标量数据可视化Demo。 包含风场、海浪、洋流、气压、温度等矢量或标量气象数据的可视化展示。 Demo 视频 依赖安装 npm install 本地开发调试 npm run serve ...
leaflet-side-by-side.js
02-11
leaflet 多个影像卷帘
leaflet-d3:将 d3.js 与 Leaflet 一起使用的插件集合
07-24
@asymmetrik/leaflet-d3 单张D3提供的集合基于可视化插件。 现在支持 D3 v5目录安装通过 npm 安装包及其对等依赖项： npm install d3 d3-hexbin leaflet如果你想不使用... 现场演示： JSFiddle 要使用，只需声明一个 h
ember-leaflet-rotated-marker:扩展标记层以支持旋转
05-26
余烬小叶旋转标记 该插件扩展了的组件以支持旋转。 这使用来完成。 不适用于IE <9 xss=removed xss=removed xss=removed> < layers xss=removed xss=removed xss=removed xss=removed></ LeafletMap> 争论类型默认...
vue快速入门（四十六）Router的安装与使用
不起眼小菜菜的博客
04-26 653
步骤很详细，直接上教程……
报表控件Stimulsoft在JavaScript报告工具中的事件：查看器事件（上）
励志做最业余的专业博主，控件产品可以私我~
04-28 754
在本文中，我们为JS报告工具中的查看器事件提供了全面的指南，包括它们的详细描述、参数列表等一系列详细内容。
bpmn-js推荐几款常用的插件
最新发布
飞云先生
04-30 37
bpmn-js整体框架库的风格是以组件的方式进行实现的，这样的结构也更加便于我们更好的对其进行功能扩展，以及客制化功能实现。其实bpmn.io已经为我们实现了较多场景的组件的实现，了解对应组件的功能更能便于我们区分是否需要自己实现，降低重复造轮子的行为，提高开发效率，本篇文章主要是介绍常见的bpmn-js中使用的组件库。
用Typescript写自动化工作流
联蔚盘云的博客
04-29 897
acao 的命令还有一些其他用法，比如指定执行某个 job 或者忽略依赖 通过命令行参数的方式注入等等，详细使用方式可以查看文档这个项目最近也在持续更新中，后续也会支持更多的预设，web ui 的操作方式也在计划中小伙伴想参与预设的开发也欢迎 pr 呀。
前端Vue2项目搭建过程
xuemen11的博客
04-25 1213
vue2,vuex,vant组件库
[email protected]使用懒加载
weixin_44072254的博客
04-25 213
【代码】[email protected]使用懒加载。
echarts+百度地图如何定义边界线
abc8002117034的博客
04-30 190
5.setOption里面的参数option.series是echarts散点图的配置项,option.bmap是百度地图的配置项，比如center是当前地图的中心点，zoom是缩放数值，roam是是否可以缩放，mapStyle是地图的样式。3.方法getCenterPoint是获取当前区域中心点的经纬度，我们将会在区域的中心点显示区域名称和具体数值。4.方法convertData返回的是地图上红色散点里面的数据，是对idata的数据格式做的一层转换。2.变量styleJson是地图的样式，可以去。
macOS asdf 工具版本管理器
Winsom1的博客
04-30 417
如果您只想在当前项目中指定特定的 Node.js 版本，而不影响全局环境，可以使用 asdf local 命令来设置项目的本地 Node.js 版本。3、如果开发者本地没有使用asdf，.tool-versions不影响项目任何内容，可当作提示使用，如果使用了asdf工具，本地没有当前所需node版本会提示安装，如果有会自动将当前文件作用域下的node切换为.tool-versions 指定的版本。要在特定的 Node.js 版本下运行项目，可以使用 asdf 管理器来管理 Node.js 版本。
leaflet-wmts.min.js下载
08-01
在使用 leaflet-wmts.min.js 之前，需要确保已经引入了 Leaflet 地图库的核心文件。接下来，可以通过在 HTML 文件中添加一个 script 标签来引入 leaflet-wmts.min.js 文件。例如： ```html <!DOCTYPE html> <!--...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值