百度地图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 ...
随机推荐
- 高可用Redis(十一):使用redis-trib.rb工具搭建集群
环境说明: 两台虚拟机,IP地址分别为:192.168.81.100和192.168.81.101 虚拟机系统为:CentOS 7.5 Redis为yum安装,版本为3.2 系统环境:关闭firewa ...
- 使用npm命令,而不用cnpm命令,也可以得到同样的体验
以前大家都知道使用cnpm命令来替代npm,可以大大提升下载各种包的速度.例如: npm install -g cnpm --registry=https://registry.npm.taobao. ...
- FTP设置
ftp设置 1.登录服务器 2.程序->关闭或启用windows服务 3.创建用户 4.在iis中增加ftp站点,设置ftpsite,ip和端口号,物理路径 5.设置ftp身份验证 6.访问ft ...
- 末学者笔记--shell编程上 2 玄
Shell编程-变量及表达运算 [内容简列] 1. shell变量简介 2. 定义变量 3. 使用变量 4. 修改变量的值 5. 单引号和双引号的区别 6. 将命令的结果赋值给变量 7. 删除变量 8 ...
- Zabbix (三)
一.zabbix支持的主要监控方式: zabbix主要Agent,Trapper,SNMP,JMX,IPMI这几种监控方式,本文章主要通过监控理论和实际操作测试等方式来简单介绍这几种方式的监控原理和优 ...
- python-初识python
一.计算机的初步认识 硬件:内存,主板,CPU,硬盘,显卡,显示器等 内存: 优点:存取速度快 缺点:断电后数据会全部丢失 硬盘: 优点:断电后数据也会永久保存 缺点:存取速度远远慢于内存 1.操作系 ...
- sql server使用sql语句上传Excel到数据库
USE pro GO SELECT * INTO temp_budget_price@201704170950 FROM OPENDATASOURCE('Microsoft.Jet.OLE ...
- 开源jar包bug导致的CPU消耗200%问题分析案例
mapdb是什么 mapdb是一个快速.易用的嵌入式java数据库,主要提供map和set形式的数据存储,使用起来就像是在操作java本身的map,set, mapdb可以提供内存级别和磁盘级别的缓存 ...
- Codeforces 581F Zublicanes and Mumocrates 树形dp
Zublicanes and Mumocrates dp[ i ][ j ][ k ] 表示 以 i 为根的子树, 占领 i 的 是 j 并且第一个人占了 i 子树的 k 个叶子节点的最小值. 然后随 ...
- 原生js触碰到底部触发函数;
/** function __morebook(){ console.log(123) } ScrollBottom(function(){__morebook();}); **/ //如果直接写一个 ...