vue-baidu-map实现在地图上选择范围并解决相关问题

vue-baidu-map实现在地图上选择范围并解决相关问题

  • 实现地图上选择不规则范围
  • 实现功能遇到的问题
    • 1、覆盖物多边形怎么才能盖住覆盖物点
    • 2、遇到其他问题

实现地图上选择不规则范围

这个功能比较简单,只需要使用vue-baidu-map插件的覆盖物多边形功能就行了。

在这里插入图片描述
直接看文档,按照文档来就可以实现。

实现功能遇到的问题

1、覆盖物多边形怎么才能盖住覆盖物点

需求时需要添加一个中心,然后用户可以根据这个中心点,用不规则图形画出想要的范围。
但是里面有个很坑的问题,插件里面覆盖物点的层级总是比覆盖物多边形的层级高。
如下图示:

在这里插入图片描述
我觉得是插件写死了每一个功能模块所在的层级,这里官方文档也没有给出解决方案。
于是这里就不能用常规配置手段解决问题。
通过工具我们知道多边形覆盖物里面的点有指定的class=“BMap_vectex BMap_vectex_node”
解决思路是当多边形点画出来以后,我们找到对应点—>然后找到对应点的父级–>设置父级的层级超过覆盖物点的层

/*
	这里是在	bm-polygon组件参数 :path="polygonPath"改变的时候,调用
	我这里用setTimeout是省事情(覆盖物多边形绘制完成才能获取到对应的元素),
	实际开发时可以监听bm-polygon覆盖物的属性发生变化时触发
*/
setTimeout(()=>{
	let BMapVectex = document.getElementsByClassName('BMap_vectex');
	if(BMapVectex.length > 0) {
		BMapVectex[0].parentNode.style.zIndex = 9999
	}
}, 100)

2、遇到其他问题

我没遇到其他问题,如果遇到其他问题,文档没有的,参考问题1的思路,应该能解决80%的问题了吧。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/228276.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

重生奇迹mu卓越哪里掉的最多

项链篇 [火之项链] 1.地下城:(地狱猎犬怪,骷髅战士,地狱蜘蛛,死灵巫师,毒牛怪,暗黑骑士) 2.失落之塔:(鬼魂,剧毒鬼魂) 3.亚特兰蒂斯:(小巴哈姆特,死亡美人鱼,蓝翼海怪) [雷之项链] 1.地下城:(毒牛怪,暗黑骑士,魔鬼戈登) 2.失落之塔:(鬼魂,剧毒鬼魂,诅咒巫师,牛魔王,恶魔…

二叉树oj题总结

1.检查两颗树是否相同 https://leetcode.cn/problems/same-tree/ 分成子问题和结束条件 ,这里用前序的思想解题(先判断根,再左右子树),不然会很浪费时间。假如左右相等,最后根不同,白白比较了 …

员工持股平台模式有哪几种?

员工持股平台模式 目前在现有的市场环境下持股平台的模式主要有公司型的持股平台以及有限合伙企业的持股平台。 (一)公司型员工持股平台 设立公司型的员工持股平台的唯一目的是为了让平台公司受让母公司的股权,从而实现员工间接持有母公司股权…

自动定量包装机市场研究: 2023年行业发展潜力分析

中国包装机械业取得了快速发展,但也出现了一些低水平重复建设现象。据有关资料显示,与工业发达国家相比,中国食品和包装机械产品品种缺乏25%-30%,技术水平落后15-25年。我国包装专用设备制造行业规模以上企业有319家,主…

宁盾统一身份中台助力某集团公司实现统一身份认证和管理(如泛微OA、微软AD)

某集团公司是一家以钢铁为主业,涉足互联网金融、文化健康、智慧城市、现代物流等多领域的大型现代化企业集团。创业发展已有三十余年,拥有员工人数超万人,为了提升管理效率,同时实现国产化创新和数字化转型,公司采用了…

[MySQL] MySQL复合查询(多表查询、子查询)

前面我们学习了MySQL简单的单表查询。但是我们发现,在很多情况下单表查询并不能很好的满足我们的查询需求。本篇文章会重点讲解MySQL中的多表查询、子查询和一些复杂查询。希望本篇文章会对你有所帮助。 文章目录 一、基本查询回顾 二、多表查询 2、1 笛卡尔积 2、2…

JVM 命令行监控及诊断工具

面试题 你使用过Java虚拟机性能监控和故障处理工具吗?(美图) 怎么打出线程栈信息。(字节跳动) JVM诊断调优工具用过哪些? (京东) 怎么获取 Java 程序使用的内存?堆使用…

Linux学习教程(第十四章 Linux系统服务管理)一

第十四章 Linux系统服务管理(一) 什么是系统服务?服务是在后台运行的应用程序,并且可以提供一些本地系统或网络的功能。 那么,Linux 中常见的服务有那些,这些服务怎么分类,服务如何启动&#x…

diffusers pipeline拆解:理解pipelines、models和schedulers

diffusers pipeline拆解:理解pipelines、models和schedulers 翻译自:https://huggingface.co/docs/diffusers/using-diffusers/write_own_pipeline v0.24.0 diffusers 设计初衷就是作为一个简单且易用的工具包,来帮助你在自己的使用场景中构建…

四十、Saga模式

目录 一、定义 二、流程 三、优点 四、缺点 五、四种模式的对比 一、定义 Saga模式是一种用于处理复杂异步操作流的模式,通常用于React/Redux的应用程序中。在这种模式中,业务逻辑被分成多个离散步骤,每个步骤都是一个Generator函数&…

AUTOSAR CP Port Driver简介

Port Driver 1 背景2 基于 EB 及 TC39X 配置3 Port API 使用1 背景 Port driver 在 AUTOSAR 中是一个比较冷门的模块,基本上在 MCAL 层级,关注的人也少,他由不像其他模块那样通用型比较强,Port 在每种内核的 MCU 的配置都有区别,甚至有些芯片直接没有 Port 模块,使用其他方…

企业级高级美颜美妆SDK解决方案

人们对于美的追求已经不仅仅局限于现实世界,更延伸到了虚拟世界。为了满足这一需求,美摄科技全新开发了一款高级美颜美妆SDK,为企业提供了一站式的美颜美妆解决方案。 这款全新的美颜美妆SDK,是我们对美颜技术的一次全面升级。它…

Java实现布隆过滤器

一、概述 布隆过滤器本质上是一个很长的二进制数组,主要用来判断一个数据存不存在数组里,如果存在就用1表示,不存在用0表示,它的优点是空间效率和查询时间都比一般的算法要好的多,缺点是有一定的误识别率和删除困难。 …

教你pycharm运行Django第一个项目

文章目录 前言搭建Django:1.新建Django项目:2.为Django项目指定远程中创建的虚拟环境下的python解释器:3.配置ubuntu的端口转发(添加端口号为1234的端口):关于Python技术储备一、Python所有方向的学习路线二、Python基…

Nacos源码解读07——集群数据同步

Distro协议背景 Distro 协议是 Nacos 社区自研的⼀种 AP 分布式协议,是面向临时实例设计的⼀种分布式协议, 其保证了在某些 Nacos 节点宕机后,整个临时实例处理系统依旧可以正常工作。作为⼀种有状态 的中间件应用的内嵌协议,Dis…

【软件推荐】文本转语音,语音转wav,导入ue5

文字转语音 在线免费文字转语音 - TTSMaker官网 | 马克配音https://ttsmaker.cn/ 文件转换器 语音转wav Convertio — 文件转换器https://convertio.co/zh/

[英语学习][10][Word Power Made Easy]的精读与翻译优化

[序言] 下面这段话, 译者翻译没有太大问题, 就是某些单词上, 跟他理解得不一样. 另外还有一个关键的定语从句, 我认为译者理解不到位, 导致翻译不够通顺. [英文学习的目标] 提升自身的英语水平, 对日后编程技能的提升有很大帮助. 希望大家这次能学到东西, 同时加入我的社区讨…

静态HTTP和动态HTTP的混合使用:最佳实践

在当今的互联网环境中,静态HTTP和动态HTTP各有其优势和局限。静态HTTP具有速度快、安全性高和易于维护的特点,而动态HTTP则能够实现动态交互和处理大量动态数据。为了充分利用两者的优势,越来越多的网站开始采用静态HTTP和动态HTTP混合使用的…

两个分数相加。

输入两个分数&#xff0c;例如3/41/2&#xff0c;输出3/41/25/4。 运行程序时&#xff0c;如下图所示&#xff1a; 输入样例1: 1/61/2输出样例2: 1/61/22/3 #include<stdio.h> int gcd(int a,int b) //求最大公约数&#xff08;Greatest Common Divisor&…

代码随想录第二十七天(一刷C语言)|分发饼干摆动序列最大子数组和

创作目的&#xff1a;为了方便自己后续复习重点&#xff0c;以及养成写博客的习惯。 一、分发饼干 思路&#xff1a;参考carl文档 局部最优就是大饼干喂给胃口大的&#xff0c;充分利用饼干尺寸喂饱一个&#xff0c;全局最优就是喂饱尽可能多的小孩。尝试使用贪心策略&#x…