百度地图api为标注设置与删除文字标签

因项目的需求需要用的百度地图,发现为标注Marker设置文字标签时,只有标签Label的设置与获取,而并没有移除功能,百度后也没有的到可行方法,然后研究一种变通点的方法也实现标签的设置与删除,和大家分享一下。

实现功能:当鼠标移动到标注上时显示文字标签,而离开标注时删除标签。

1、鼠标移上显示标签

var map = new BMap.Map("allmap");
var point = new BMap.Point(116.404, 35.915);//创建一个点
map.centerAndZoom(point, 15);
var marker = new BMap.Marker(point);  // 创建标注
map.addOverlay(marker);               // 将标注添加到地
marker.addEventListener("mouseover",function(e){
<span style="white-space:pre">	</span>marker.setLabel(new BMap.Label("这是一个标签!!!!!!!!!!!!!!",{offset:new BMap.Size(10,-20)}));//为标注设置一个标签
});
鼠标移上的效果

2、鼠标离开移除标签

通过设置标签的样式及内容隐藏标签,达到移除的效果。


                
  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
您可以使用百度地图API的JavaScript版本来标注Excel数据。下面是一个大致的步骤: 1. 将Excel数据保存为适当的格式,例如CSV或JSON。 2. 创建一个网页,并引入百度地图API的JavaScript库。 3. 在网页中使用JavaScript代码来读取和解析Excel数据。 4. 使用百度地图API功能,在地图上添加标注。 以下是一个简单的示例代码,用于将CSV文件中的数据标注百度地图上: ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>百度地图API标注Excel数据</title> <style type="text/css"> #map { width: 100%; height: 500px; } </style> </head> <body> <div id="map"></div> <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=您的百度地图API密钥"></script> <script type="text/javascript"> // 读取CSV文件 function readCSV(file) { var request = new XMLHttpRequest(); request.open("GET", file, false); request.send(null); var csvData = request.responseText; return csvData; } // 解析CSV数据 function parseCSV(csvData) { var lines = csvData.split("\n"); var markers = []; for (var i = 0; i < lines.length; i++) { var line = lines[i].trim(); if (line !== "") { var data = line.split(","); var marker = { lng: parseFloat(data), lat: parseFloat(data), title: data }; markers.push(marker); } } return markers; } // 创建地图并添加标注 function createMap(markers) { var map = new BMap.Map("map"); var point = new BMap.Point(markers.lng, markers.lat); map.centerAndZoom(point, 15); for (var i = 0; i < markers.length; i++) { var marker = new BMap.Marker(new BMap.Point(markers[i].lng, markers[i].lat)); map.addOverlay(marker); marker.setTitle(markers[i].title); } } // 读取和解析CSV数据,并创建地图 var csvData = readCSV("data.csv"); var markers = parseCSV(csvData); createMap(markers); </script> </body> </html> ``` 请确保将代码中的"您的百度地图API密钥"替换为您自己的百度地图API密钥。另外,您还需要将"data.csv"替换为您实际保存Excel数据的文件路径。 这只是一个简单的示例,具体的实现方式可能会根据您的数据格式和需求有所不同。您可以根据自己的情况进行调整和优化。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值