vue 百度地图点击marker修改marker图片,其他marker图片不变。

在这里插入图片描述
解决思路,就是直接替换对应marker的图片。获取marker对象判断点击的marker替换成新图片,上一个被点击的就替换成老图片。


          marker.name = 'tag';
          marker.id = i; //一定要设置id,我这里是设置的循环key值,要唯一性。
          map.addOverlay(marker);

          let pointAIcon2= new BMapGL.Icon(require("../xxxxx.png"), new BMapGL.Size(36, 52));
          let pointAIcon1= new BMapGL.Icon(require("../xxxxx.png"), new BMapGL.Size(17, 17));

          let clickFunction = function(v1,v2) {

            return function(event) {
              var allOverlay = map.getOverlays();
              //获取所有marker
              allOverlay.map((item,key) => {
                //oldId是上一个点击的marker id
                if(item.id === that.oldId){
                  //setIcon 是替换marker图片
                  allOverlay[key].setIcon(pointAIcon1);
                }
                //当前点击的marker
                if (item.id === event.target.id) {
                  allOverlay[key].setIcon(pointAIcon2);
                }
              })
                  //延迟保存oldId
              setTimeout(() => {
                  that.oldId=event.target.id
              }, 500);
            };
          }(position.longitude,position.latitude);
          marker.addEventListener("click", clickFunction);

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

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

相关文章

SSRF(服务器端请求伪造)的学习以及相关例题(上)

目录 一、SSRF的介绍 二、漏洞产生的原因 三、利用SSRF可以实现的效果(攻击方式) 四、SSRF的利用 五、SSRF中的函数 file_get_content() 、fsockopen() 、curl_exec() 1.file_get_content(): 2.fsockopen(): 3.curl_exec()&#xff1…

【鸿蒙开发】第二十四章 IPC与RPC进程间通讯服务

1 IPC与RPC通信概述 IPC(Inter-Process Communication)与RPC(Remote Procedure Call)用于实现跨进程通信,不同的是前者使用Binder驱动,用于设备内的跨进程通信,后者使用软总线驱动,…

算法设计与分析(超详解!) 第三节 贪婪算法

1.贪心算法基础 1.贪心算法的基本思想 贪心算法是从问题的某一个初始解出发,向给定的目标推进。但它与普通递推求解过程不同的是,其推动的每一步不是依据某一固定的递推式,而是做一个当时看似最佳的贪心选择,不断地将问题实例归…

【选择结构程序设计-谭浩强适配】(适合专升本、考研)

无偿分享学习资料,需要的小伙伴评论区或私信dd。。。 无偿分享学习资料,需要的小伙伴评论区或私信dd。。。 无偿分享学习资料,需要的小伙伴评论区或私信dd。。。 完整资料如下:纯干货、纯干货、纯干货!!…

uni-app跨端兼容

1.样式兼容 小程序端不支持*选择器,可以使用(view,text) 页面视口差异(tabar页、普通页) H5端默认开始scoped 例如骨架屏样式出现问题,需要将之前的样式拷贝到骨架屏中 提示:H5端是单页面应用,scoped隔离…

【吊打面试官系列】Java高并发篇 - 如何创建守护线程?

大家好,我是锋哥。今天分享关于 【如何创建守护线程?】面试题,希望对大家有帮助; 如何创建守护线程? 使用 Thread 类的 setDaemon(true)方法可以将线程设置为守护线程,需要注意的是,需要在调用 …

家政服务新体验——家政小程序开发,让生活更轻松!

一、引言 随着现代生活节奏的加快,家政服务已经成为越来越多家庭不可或缺的一部分。然而,传统家政服务方式往往存在预约不便、服务质量参差不齐等问题。为了解决这些问题,我们精心打造了一款家政小程序,为您带来全新的家政服务体…

Codeforces Round 843 (Div. 2) B. Gardener and the Array (构造)

原题地址 The gardener Kazimir Kazimirovich has an array of n n n integers c 1 , c 2 , … , c n c_1, c_2, \dots, c_n c1​,c2​,…,cn​. He wants to check if there are two different subsequences a a a and b b b of the original array, for which f ( a ) …

学习笔记:Adaptive Platform(AP)适配到RTOS

一、背景 1、AP版本 Adaptive Platform AUTOSAR R20-11版本标准支持C14。CM模块支持DDS、SOME/IP协议 2、RTOS RTOS-A核,当前完全支持POSIX PSE51、POSIX PSE52接口,POSIX PSE53部分支持,POSIX PSE54基本不支持。详细接口参考&#xff1a…

《三》菜单栏_工具栏_状态栏动作与实现

上期我们创建了辣么多的动作,那么这次我们要是开始实现这些动作,撸起袖子来吧: //菜单动作(ACtion)QAction *newAct;//新建QAction *openAct;//打开QAction *saveAct;//保存QAction *saveAsAct;//另存为QAction *prin…

学习java

在实验室看见这本书,无聊看了下,写出了第一个java代码 成功下载了eclipse并且汉化。 写了自己的第一个java程序: package ttttt;public class ttttt {public static void main(String[] args) {System.out.println("hello world")…

DS高阶:B树系列

一、常见的搜索结构 1、顺序查找 时间复杂度:O(N) 2、二分查找 时间复杂度:O(logN) 要求:(1)有序 (2)支持下标的随机访问 3、二叉搜索树(BS树) 时间复杂…

免费的国内版 GPT 推荐,5个国产ai工具

提起AI,大家第一个想到的就是GPT。 虽然它确实很厉害,但奈何于我们水土不服,使用门槛有些高。 不过随着GPT的爆火,现在AI智能工具已经遍布到各行各业了,随着时间的推移,国内的AI工具也已经“百花盛放”了…

哈希重要思想——位图详解

一,概念 所谓位图,就是用每一位来存放某种状态,适用于海量数据,数据无重复的场景。通常是用来判断某个数据存不存在的。 为了方便理解我们引入一道面试题, 给40亿个不重复的无符号整数,没排过序。给一个无…

UniAD大模型开路,智能车驶入AGI时代

作者 |老缅 编辑 |德新 在刚刚结束不久的北京车展上,除一众明星车型亮相,供应链企业也开始大秀肌肉,其中尤其以端到端大模型为代表,焕新一代的智驾技术栈掀起了新一轮热潮。 作为首个提出感知决策一体化自动驾驶通用模型的公司&…

C++学习笔记3

A. 求出那个数 题目描述 喵喵是一个爱睡懒觉的姑娘,所以每天早上喵喵的妈妈都花费很大的力气才能把喵喵叫起来去上学。 在放学的路上,喵喵看到有一家店在打折卖闹钟,她就准备买个闹钟回家叫自己早晨起床,以便不让妈妈这么的辛苦…

创新点!CNN与LSTM结合,实现更准预测、更快效率、更高性能!

推荐一个能发表高质量论文的好方向:LSTM结合CNN。 LSTM擅长捕捉序列数据中的长期依赖关系,而CNN则擅长提取图像数据的局部特征。通过结合两者的优势,我们可以让模型同时考虑到数据的时序信息和空间信息,减少参数降低过拟合风险&a…

STM32_HAL_RTC_解决恢复电源时再一次初始化

1问题 板子再次恢复电源时直接初始化了时间 2解决思路 在初始化函数(MX_RTC_Init();)中增加判断,判断是否是二次初始化 将值放入备份存储其中 3问题图 4解决后的源码 /* RTC init function */ void MX_RTC_Init(void) {/* USER CODE BE…

C++青少年简明教程:C++数据类型

C青少年简明教程:C数据类型 数据类型定义了变量可以存储哪些类型的数据,以及对这些数据可以进行哪些操作。C提供了丰富的数据类型供开发者使用。 下面是 C 中常见的数据类型: ★整型(int):整数类型的数据…

零一万物发布千亿参数模型Yi-Large,李开复呼吁关注TC-PMF,拒绝Ofo式烧钱打法

5月13日,在零一万物成立一周年之际,零一万物 CEO 李开复博士携带千亿参数 Yi-Large 闭源模型正式亮相,正式进军全球 SOTA 顶级大模型之首,在斯坦福最新的 AlpacaEval 2.0 达到全球大模型 Win Rate 第一。除此之外,零一…