为了解决 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 地图 鼠标移上显示标签 鼠标离开隐藏标签的更多相关文章

  1. winform中dataGridView隔行显示不同的背景色,鼠标移动上显示不同颜色,离开后变回原色

    winform中dataGridView隔行显示不同的背景色,鼠标移动上显示不同颜色,离开后变回原色 先设置奇数行颜色,这个有个自带的属性AlternatingRowsDefaultCellStyle ...

  2. 鼠标移上显示的下拉菜单,和鼠标移上时显示的导航,html,JavaScript代码

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 实现点击后创建div,若对div2秒无操作则将div隐藏,鼠标移上div让它不隐藏,移出div超过两秒则div隐藏

    $('.addLabel').on('click', function () { setTimeout(function(){ if(hoverflag==0){ $(".labelHide ...

  4. DIV内容超出长度显示省略号,鼠标移上自动显示全部内容(EasyUI DataGrid)

    如果想把DIV中超出的文本显示成省略号,而不是换行全部显示,有2个办法. 注:本文主要是以EasyUI的DataGrid为案例的,如果是其他场景只要底层是用DIV显示文本的应该都能使用. 首先可以给此 ...

  5. Vue 框架-02-事件:点击, 双击事件,鼠标移上事件

    Vue 框架-02-事件:点击, 双击事件,鼠标移上事件 1.单击事件:v-on:click 源码 app2.js : //实例化 vue 对象 new Vue({ //注意代码格式 //el:ele ...

  6. 只要把鼠标移上Div方框,方框就自动顺时针旋转

    这是一个CSS3特效,IE下看不到效果.一个Div方框,在CSS3代码的作用下,只要把鼠标移上Div方框,方框就自动顺时针旋转.代码量不大,甚至有些简单,作为一个基础的CSS3实例,我想还是比较不错的 ...

  7. iview+vue 表格任一项实现鼠标划上显示内容

    在新版本的iview中,表格新增了tooltip功能: 但做项目时并不是新的iview版本,又不想升级,如何才能实现当内容过多鼠标划上显示内容?下边是我做项目时的改动: { // fixed: 'le ...

  8. chrome DevTools 里面 css样式里面 勾上 :hover 会将鼠标移上的效果一直保持,技巧:要在鼠标上的 div上 勾 :hover

    chrome DevTools 里面 css样式里面 勾上 :hover 会将鼠标移上的效果一直保持,技巧:要在鼠标上的 div上 勾 :hover

  9. DIV css中cursor属性详解-鼠标移到图片变换鼠标形状 (转)

    css中cursor属性详解-鼠标移到图片变换鼠标形状   语法: cursor : auto | all-scroll | col-resize| crosshair | default | han ...

随机推荐

  1. ACM-线段树

    http://blog.csdn.net/libin56842/article/details/8530197 基础可以看上面这篇文章 风格: maxn是题目给的最大区间,而节点数要开4倍,确切的说… ...

  2. 2.storm的安装

    1.前提是linux系统已经安装了上一篇讲的Zookeeper和jdk[1.7及以上版本]还有python[centos已经自带,2.6及以上版本] 2.解压storm压缩包 sudo tar -zx ...

  3. javascript的对象创建模式---命名空间模式

    javascript中对象的概念是很普遍的,对象是是对象,数组是对象,函数也是对象,字符串其实也是对象.常见的对象创建方法有对象字面量.构造函数创建.我们先来看看对象的创建还有哪些更高级的模式. 一. ...

  4. css3 转换 过渡 及动画

    转换transform: 通过 CSS3 转换,我们能够对元素进行移动.缩放.转动.拉长或拉伸.您可以使用 2D 或 3D 转换来转换您的元素 2D转换属性: transform 向元素应用 2D 或 ...

  5. 创建简单的node服务器

    昨天咱们说了封装ajax,今天咱们说一下 自己创建一个建议的node服务器: 话不多说直接上代码: var http = require('http') //对URL 解析为对象//1.导入模块 UR ...

  6. AE常用代码(标注要素、AE中画带箭头的线、如何获得投影坐标、参考坐标、投影方式、FeatureCount注意事项)

    手上的电脑已经用了将近三年了,想入手一台Surface Pro,所以计划着把电脑上的资料整理下,部分资料打算发到博客上来,资料有同事.也有自己的.也有来自网络的,来源途径太多,也没法详细注明,请见谅! ...

  7. GUID 格式化

    1.Guid.NewGuid().ToString("N") 结果为: 38bddf48f43c48588e0d78761eaa1ce6 2.Guid.NewGuid().ToSt ...

  8. Java—集合框架Map

    Map接口 Map提供了一种映射关系,其中的元素是以键值对(key-value)的形式存储的,key和value可以是任意类型的对象,能够实现根据key快速查找value. Map中的键值对以Entr ...

  9. web端 调试 手机混合应用中的h5部分(chrome浏览器的devtool使用)

    Learning Hybird App Test–Appium Java(Leyden) 浏览器的远程调试工具,使得我们可以通过PC上开启的控制台,调试手机浏览器中正在运行的代码.运行于 Androi ...

  10. Vue2自定义指令改变DOM值后未刷新data中绑定属性的值

    标签(空格分隔): Vue 自定义指令用于过滤输入框,只允许输入数字: Vue.directive('numberOnly', { bind: function (el, binding) { el. ...