百度地图API 自定义标注图标
通过Icon类可实现自定义标注的图标,下面示例通过参数MarkerOptions的icon属性进行设置,
也可以使用marker.setIcon()方法。
<script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap"); // 创建Map实例
map.centerAndZoom(new BMap.Point(116.323066,39.989956), 16); // 初始化地图,设置中心点坐标和地图级别
map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
map.setCurrentCity("北京"); // 设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放 var points = [
[116.316967,39.990748],
[116.323938,39.989919],
[116.328896,39.988039],
[116.321135,39.987072],
[116.332453,39.989007],
[116.324045,39.987984],
[116.322285,39.988316],
[116.322608,39.986381]
];
// 向地图添加标注
for( var i = 0;i < points.length; i++){
var myIcon = new BMap.Icon("http://7xic1p.com1.z0.glb.clouddn.com/markers.png", new BMap.Size(23, 25), {
// 指定定位位置
offset: new BMap.Size(10, 25),
// 当需要从一幅较大的图片中截取某部分作为标注图标时,需要指定大图的偏移位置
imageOffset: new BMap.Size(0, 0 - i * 25) // 设置图片偏移
});
var point = new BMap.Point(points[i][0],points[i][1]);
// 创建标注对象并添加到地图
var marker = new BMap.Marker(point,{icon: myIcon});
map.addOverlay(marker);
}; </script>
所使用图片:
演示地址:点击
百度地图API 自定义标注图标的更多相关文章
- 网页嵌入百度地图和使用百度地图api自定义地图的详细步骤
在网页中插入百度地图 如果想在自己的网页上面加入百度地图的话,可以用百度地图的api.具体使用方法如下: 第一步:进入百度创建地图的网站http://api.map.baidu.com/lbsapi/ ...
- 百度地图API 添加自定义标注 多点标注
原文:百度地图API 添加自定义标注 多点标注 分四个文件 location.php map.css 图片 数据库 数据库配置自己改下 -------------------------------- ...
- 百度地图API自定义地图
http://api.map.baidu.com/lbsapi/creatmap/index.html http://developer.baidu.com/map/index.php?title=w ...
- HTM L百度地图API 自定义工具地图实例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 如何在网中使用百度地图API自定义个性化地图
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- 百度地图API 自定义坐标点及图片
var map = new BMap.Map("allmap");var point = new BMap.Point(105.955754,36.525109);map.cent ...
- 【百度地图API】北京周边7日游——图标按路线轨迹行动
原文:[百度地图API]北京周边7日游--图标按路线轨迹行动 任务描述: 春节就要来啦~酸奶小妹的妈妈要从遥远的重庆,来到北京过春节呢!酸奶小妹忙着给妈妈计划,北京周边的旅游线路.计划好路线后,就开始 ...
- 【百度地图API】如何在地图上添加标注?——另有:坐标拾取工具+打车费用接口介绍
原文:[百度地图API]如何在地图上添加标注?--另有:坐标拾取工具+打车费用接口介绍 摘要: 在这篇文章中,你将学会,如何利用百度地图API进行标注.如何使用API新增的打车费用接口. ------ ...
- 百度地图api窗口信息自定义
百度地图加载完后,完全可以用dom方法操作,比较常用的就是点击mark的弹窗,利用jQuery可以很快的创建弹窗,需要注意的就是地图都是异步加载,所以绑定时间要用 jQuery 事件 - delega ...
随机推荐
- 01-初识MySQL数据库
一.数据库概述 1.什么是数据 描述事物特征的符号记录称为数据,描述事物的符号既可以是数字,也可以是文字.图片,图像.声音.语言等,数据由多种表现形式,它们都可以经过数字化后存入计算机.如: name ...
- 自动化设计模式Page Object
https://blog.csdn.net/qq_37546891/article/details/79052054#t1
- 如何用 js 获取虚拟键盘高度?(适用所有平台)
原文地址:https://segmentfault.com/a/1190000010693229?utm_source=tag-newest
- docker报错Service 'pwn_deploy_chroot' failed to build: Get https://registry-1.docker.io/v2/library/ubuntu/manifests/16.04:net/http: request canceled
这几天碰到师傅让我帮忙做pwn题环境,结果遇到了坑 第一种方法是:https://blog.csdn.net/zhaoyayua/article/details/60141660 解决办法是执行 vi ...
- Python + Anaconda + vscode环境重装(2019.4.20)
目录 卸载程序 安装Ananconda 检查系统环境变量 更换国内镜像源 设置VS CODE 用户配置及工作环境配置 @(Python + Anaconda + vscode环境重装) 工程目录的使用 ...
- 结队第一次 plus
作业描述 作业所属课程:软件工程1916|W(福州大学) 作业要求:结对第一次-原型设计 结对学号:221600328 221600106 作业目标:尝试结对合作,使用NABCD模型,会分析用户需求, ...
- git commit时暂时忽略已提交的文件
当正在修改某文件A,此时需要commit,但是A没修改完暂时不能一起commit. 执行: git update-index --assume-unchanged A的路径 git暂时会忽略该文件的修 ...
- Android中Adapter类的使用 “Adapter”
Adapter用来把数据绑定到扩展了AdapterView类的视图组(例如:ListView或Gallery).Adapter负责创建代表所绑定父视图中的底层数据的子视图. 可以创建自己的Adapte ...
- [C++一本通-图论算法] 例4-4 最小花费
题目描述 在n个人中,某些人的银行账号之间可以互相转账.这些人之间转账的手续费各不相同.给定这些人之间转账时需要从转账金额里扣除百分之几的手续费,请问A最少需要多少钱使得转账后B收到100元. 输入输 ...
- Java Concurrency in Practice——读书笔记
Thread Safety线程安全 线程安全编码的核心,就是管理对状态(state)的访问,尤其是对(共享shared.可变mutable)状态的访问. shared:指可以被多个线程访问的变量 mu ...