随笔分类 -  前端开发 / Mapboxgl

摘要:很刁钻的问题,排查了好久。 我自己开发测试用的浏览器(版本为112)运行正常,在老版本(75)谷歌浏览器报错如下: mapbox-gl.js:32 Uncaught TypeError: Failed to execute 'getImageData' on 'CanvasRenderingCont 阅读全文
posted @ 2023-04-17 13:50 宇宙野牛 阅读(461) 评论(0) 推荐(0) 编辑
摘要:适用场景: 需要在地图上展示很多种数据,这些数据使用的图标形状是有限的几种,但颜色可能由后台自由配置后传给前端。 数据种类可能会变化,颜色可能会变化,这种情况下让设计同事切一堆图反而不方便维护,使用动态加载图标可以一定程度上节省前端的后期工作。 前端框架是vue3+vite,其他框架能否实现未验证。 阅读全文
posted @ 2023-04-12 13:53 宇宙野牛 阅读(552) 评论(0) 推荐(0) 编辑
摘要:mapbox-gl-draw官网给出的扩展模式终于无法满足需求,需要diy了。 因为是diy,所以不存在前文说的commonjs打包报错的问题,呵呵。 前文:Mapboxgl draw 自定义标绘:圆、矩形、自由多边形、上传读取geojson (有的概念可能会接续前文不做解释) 参考链接 自定义MO 阅读全文
posted @ 2023-04-12 10:40 宇宙野牛 阅读(2656) 评论(3) 推荐(0) 编辑
摘要:用于避免图层内标记点注册的点击事件重复触发(点位分布密集时容易出现) map.on("click", layerId, (e) => { // 禁止点击事件穿透 - 判断同一个event是否已经触发 if (e.defaultPrevented) return; // 你要做的逻辑 func(e); 阅读全文
posted @ 2023-04-04 13:43 宇宙野牛 阅读(703) 评论(0) 推荐(0) 编辑
摘要:还没做文字标绘,累了,以后有需要有机会再说 下一篇:Mapboxgl draw 自定义标绘之二:图标、文本、圆形的创建与编辑,重写原模式相关方法,保持当前模式 自定义标绘方法 Mapboxgl标绘相关库 我当前使用的版本是: "@mapbox/mapbox-gl-draw": "^1.4.1", " 阅读全文
posted @ 2023-03-30 18:37 宇宙野牛 阅读(4829) 评论(1) 推荐(1) 编辑
摘要:自定义弹窗的开发 自定义弹窗类CustomPopup.js export default class CustomPopup { // options.coordinates用于地图定位,必须有,其他属性根据具体业务调整 constructor(options) { this.popup = nul 阅读全文
posted @ 2023-03-30 16:45 宇宙野牛 阅读(2027) 评论(1) 推荐(0) 编辑
摘要:手动狗头,换选型就是这么突然。 选用框架:Vue3+Vite+Mapboxgl 在工程中引入mapboxgl 使用了好心人给的 mapboxgl.js 和 mapboxgl.css,放在 public/mapboxgl 目录下,在 index.html 中引入,mapboxgl可作为全局变量使用: 阅读全文
posted @ 2023-03-04 19:27 宇宙野牛 阅读(444) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示