baidu 地图 鼠标移上显示标签 鼠标离开隐藏标签
为了解决 label太多,文字会重叠看不清 所以提出这种办法
核心代码

1,创建的时候 将label设置为隐藏
2,通过百度地图监听事件 , mouseover或onmouseover 触发显示
3,通过mouseover 或onmouseover 触发隐藏
// 创建文本标注对象
var label = new BMap.Label(" "+data.data[i][4]+" ", { offset: new BMap.Size(10, -25) });
label.setStyle({
color: "#fff",
border: "0",
padding: "0",
display: "none",
background: "rgba(66,117,202,0.9)",
fontSize: "12px",
height: "20px",
lineHeight: "20px",
fontFamily: "微软雅黑"
});
marker.setLabel(label); marker.addEventListener("mouseover",function(e){
var label = this.getLabel()
label.setStyle({display:"block"});
});
marker.addEventListener("mouseout",function(e){
var label = this.getLabel()
label.setStyle({display:"none"});
}); map.addOverlay(marker); //将标记添加到地图中
baidu 地图 鼠标移上显示标签 鼠标离开隐藏标签的更多相关文章
- winform中dataGridView隔行显示不同的背景色,鼠标移动上显示不同颜色,离开后变回原色
winform中dataGridView隔行显示不同的背景色,鼠标移动上显示不同颜色,离开后变回原色 先设置奇数行颜色,这个有个自带的属性AlternatingRowsDefaultCellStyle ...
- 鼠标移上显示的下拉菜单,和鼠标移上时显示的导航,html,JavaScript代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 实现点击后创建div,若对div2秒无操作则将div隐藏,鼠标移上div让它不隐藏,移出div超过两秒则div隐藏
$('.addLabel').on('click', function () { setTimeout(function(){ if(hoverflag==0){ $(".labelHide ...
- DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)
如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此 ...
- Vue 框架-02-事件:点击, 双击事件,鼠标移上事件
Vue 框架-02-事件:点击, 双击事件,鼠标移上事件 1.单击事件:v-on:click 源码 app2.js : //实例化 vue 对象 new Vue({ //注意代码格式 //el:ele ...
- 只要把鼠标移上Div方框,方框就自动顺时针旋转
这是一个CSS3特效,IE下看不到效果.一个Div方框,在CSS3代码的作用下,只要把鼠标移上Div方框,方框就自动顺时针旋转.代码量不大,甚至有些简单,作为一个基础的CSS3实例,我想还是比较不错的 ...
- iview+vue 表格任一项实现鼠标划上显示内容
在新版本的iview中,表格新增了tooltip功能: 但做项目时并不是新的iview版本,又不想升级,如何才能实现当内容过多鼠标划上显示内容?下边是我做项目时的改动: { // fixed: 'le ...
- chrome DevTools 里面 css样式里面 勾上 :hover 会将鼠标移上的效果一直保持,技巧:要在鼠标上的 div上 勾 :hover
chrome DevTools 里面 css样式里面 勾上 :hover 会将鼠标移上的效果一直保持,技巧:要在鼠标上的 div上 勾 :hover
- DIV css中cursor属性详解-鼠标移到图片变换鼠标形状 (转)
css中cursor属性详解-鼠标移到图片变换鼠标形状 语法: cursor : auto | all-scroll | col-resize| crosshair | default | han ...
随机推荐
- JS中绑定事件顺序(事件冒泡与事件捕获区别)
在JS中,绑定的事件默认的执行时间是在冒泡阶段执行,而非在捕获阶段(重要),这也是为什么当父类和子类都绑定了某个事件,会先调用子类绑定的事件,后调用父类的事件.直接看下面实例 <!Doctype ...
- js原生拖拽
style样式 <style type="text/css"> #box{ width: 100px; height: 100px; background: deepp ...
- php *-devel
源码编译安装个php,缺少好多-devel的库. why devel? devel包至少包括头文件和链接库.如果你的要安装的源码依赖某个库,那肯定需要这两样东西. 让apache支持php 在编译ph ...
- 关于maven包的引入net.sf.json的问题
最开始通过在pom.xml文件中加入 <dependency> <groupId>net.sf.json-lib</groupId> <artifactId& ...
- 注入类型(Injection Type)
a) setter(重要) <property name="userDAO"> <ref bean="u"/> </propert ...
- 域名和DNS服务器
概念性的东西: 域名: ①.百度:域名(Domain Name),是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称,用于在数据传输时标识计算机的电子方位(有时也指地理 ...
- HCNA-RIP定时器
1.拓扑图 2. 1.RIP有哪些定时器?三种:更新定时器.老化定时器.垃圾回收定时器 2.RIP的定时器有哪些作用?更新定时器(30s):运行RIP的路由器会以30s为周期,向邻居发送RIP路由.老 ...
- 再学UML-UML用例建模解析(二)
(1) 关联关系 关联关系是指执行者与用例之间的关系,又称为通信关系,如果某个执行者可以对某个用例进行操作,它们之间就具有关联关系,如下图所示,“经理”有一个功能为“查看库存报表”,因此可以在执行者“ ...
- python常用模块(二)
1.ConfigParser模块 用于生成和修改配置文档,在python3.x中变更为configparser 1 [DEFAULT] 2 ServerAliveInterval = 45 3 Com ...
- zt dup() 和 dup2()
dup() 和 dup2() 2011-10-07 11:06:31| 分类: Linux学习心得 |字号 订阅 dup和dup2都可用来复制一个现存的文件描述符,使两个文件描述符指向同一个fi ...