百度离线3.0的一些功能的实现

news/2024/4/19 4:52:59

案例:

设置覆盖物+标注提示文字:

<script>// 百度地图API功能var map = new BMap.Map("map",{ mapType: BMAP_HYBRID_MAP });   var point = new BMap.Point(120.55294, 41.665515); // 创建Map实例map.centerAndZoom(point, 18); // 初始化地图,设置中心点坐标和地图级别/*添加标注++++++开始*/// 创建标注var marker = new BMap.Marker(point);  map.addOverlay(marker);  // 将标注添加到地图中,配合覆盖物实现文字提示var label = new BMap.Label("我是文字标注哦",{offset:new BMap.Size(20,-20)});marker.setLabel(label);/*添加标注++++++结束*//*添加覆盖物++++++开始*/var circle = new BMap.Circle(new BMap.Point(120.55294, 41.665515),15,{fillColor: 'red', //设置圆形的填充颜色为红色fillOpacity: 0.5, //填充色透明度strokeColor:"blue", //设置圆形的边框颜色为蓝色strokeWeight:2, //设置圆形边框的宽度为 2 像素strokeOpacity:0.1 //设置圆形边框的透明度为 0.1(即 10%透明});//创建圆 map.addOverlay(circle); //给覆盖物添加事件circle.addEventListener("click",attribute);function attribute(){var p = circle.point;  //获取marker的位置window.alert("marker的位置是" + p.lng + "," + p.lat);    }/*添加覆盖物++++++结束*/map.setCurrentCity("朝阳");          // 设置地图显示的城市 此项是必须设置的map.enableScrollWheelZoom(true);
</script>

设置标注的跳动动画的效果和重新设置标注提示的内容,给标注添加点击事件:

<script>// 百度地图API功能var map = new BMap.Map("map",{ mapType: BMAP_HYBRID_MAP });   var point = new BMap.Point(120.55294, 41.665515); // 创建Map实例map.centerAndZoom(point, 18); // 初始化地图,设置中心点坐标和地图级别/*添加标注++++++开始*///自定义marker---Size为图片大小,anchor为偏移量// 创建标注var marker = new BMap.Marker(point);  map.addOverlay(marker);  // 将标注添加到地图中,配合覆盖物实现文字提示var label = new BMap.Label("我是文字标注哦",{offset:new BMap.Size(-18,-20)});marker.setLabel(label);marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画marker.addEventListener("click", function() {// 在这里添加点击事件的处理逻辑alert("你点击了标记!");
});function ssa(){label.setContent("新的文字标注内容");alert("sjdfk");// 清除动画效果
marker.setAnimation(null);}setTimeout(ssa,5000)/*添加标注++++++结束*//*添加覆盖物++++++开始*/var circle = new BMap.Circle(new BMap.Point(120.55294, 41.665515),15,{fillColor: 'green',strokeColor:"blue", fillOpacity: 0.3, strokeWeight:2, strokeOpacity:0.3});//创建圆 map.addOverlay(circle); //给覆盖物添加事件circle.addEventListener("click",attribute);function attribute(){var p = circle.point;  //获取marker的位置window.alert("marker的位置是" + p.lng + "," + p.lat);    }/*添加覆盖物++++++结束*/map.setCurrentCity("朝阳");          // 设置地图显示的城市 此项是必须设置的map.enableScrollWheelZoom(true);
</script> 

增加线

/* 增加折线============开始 */
var polyline = new BMap.Polyline([
new BMap.Point(120.552396, 41.66695),

], {strokeColor:"red", strokeWeight:2, strokeOpacity:0.5});   //创建折线
map.addOverlay(polyline);   //增加折线

https://dhexx.cn/news/show-5160640.html

相关文章

第二十章,多线程

创建线程 有两种方式&#xff0c;分别为继承Java.lang.Thread类与实现Java.lang.Runnable接口 继承Thread类 Thread常用的两个构造方法语法 public Thread&#xff08;&#xff09;&#xff1b; public Thread&#xff08;String threadName&#xff09;&#xff1b; 继承…

【蓝桥杯 LCA 差分】 砍树

题目分析&#xff1a; 这道题还是比较裸的一道书上差分的题目了 对于每一对标记点(x,y) 他们之间的路径就是 x − > L C A ( x , y ) − > y x->LCA(x,y)->y x−>LCA(x,y)−>y 这条路径上的每一条边都要经过。 那么对于一条边&#xff0c;什么时候砍掉这条…

qt实现一个安卓测试小工具

qt实现一个安卓测试小工具 最终效果&#xff1a;目录结构源码gui.py 主要是按钮&#xff0c;文本控制代码main.py 主要是逻辑代码gui.spec 是打包使用的adb.ui 最终效果&#xff1a; 目录结构 上面2个是打包的生成的不用管 源码 gui.py 主要是按钮&#xff0c;文本控制代码…

数据结构(超详细讲解!!)第二十五节 树与森林

1.树的存储结构 和线性表一样&#xff0c;树可以用顺序和链式两种存储结构。 树的顺序存储结构适合树中结点比较“满”的情况。根据树的非线性结构特点&#xff0c;常用链式存储方式来表示树。树常用的存储方法有&#xff1a;双亲表示法、孩子表示法和孩子兄弟表…

Python(八十九)函数的参数的内存分析

❤️ 专栏简介&#xff1a;本专栏记录了我个人从零开始学习Python编程的过程。在这个专栏中&#xff0c;我将分享我在学习Python的过程中的学习笔记、学习路线以及各个知识点。 ☀️ 专栏适用人群 &#xff1a;本专栏适用于希望学习Python编程的初学者和有一定编程基础的人。无…

ZKP15.2 Formal Methods in ZK (Part I)

ZKP学习笔记 ZK-Learning MOOC课程笔记 Lecture 15: Secure ZK Circuits via Formal Methods (Guest Lecturer: Yu Feng (UCSB & Veridise)) 15.2 Formal Methods in ZK (Part I) Circuits Workflow Source Code: Witness Generation and ConstraintsWitness Generatio…

kubenetes-kubelet组件

一、kubelet架构 每个节点都运行一个kubelet进程&#xff0c;默认监听10250端口&#xff0c;kubelet作用非常重要&#xff0c;是节点的守护神。 接收并执行 master发来的指令。管理Pod及Pod中的容器。每个kubelet进程会在API Server 上注册节点自身信息&#xff0c;定期向mast…

JavaScript 的 DOM 知识点有哪些?

文档对象模型&#xff08;Document Object Model&#xff0c;简称 DOM&#xff09;&#xff0c;是一种与平台和语言无关的模型&#xff0c;用来表示 HTML 或 XML 文档。文档对象模型中定义了文档的逻辑结构&#xff0c;以及程序访问和操作文档的方式。 当网页加载时&#xff0…

每日一练【移动零】

一、题目描述 283. 移动零 - 力扣&#xff08;LeetCode&#xff09; 给定一个数组 nums&#xff0c;编写一个函数将所有 0 移动到数组的末尾&#xff0c;同时保持非零元素的相对顺序。 请注意 &#xff0c;必须在不复制数组的情况下原地对数组进行操作。 二、题目解析 可以…

基于SSM的旅游管理系统设计与实现

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;采用JSP技术开发 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#x…