87,901
社区成员
发帖
与我相关
我的任务
分享
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<style type="text/css">
body,html,#container{
height: 100%;
margin: 0px;
font: 12px Helvetica, 'Hiragino Sans GB', 'Microsoft Yahei', '微软雅黑', Arial;
}
.title{
margin: 0px;
color: white;
font-size: 14px;
background-color: rgba(0,155,255,0.8);
line-height: 22px;
padding: 0px 0 0 6px;
font-weight: lighter;
letter-spacing: 1px;
}
.content{
padding: 4px;
color: #666;
line-height: 18px;
}
.amap-info-content{
padding: 0 0 2px 0px;
}
</style>
<title>自定义marker</title>
</head>
<body>
<div id="container" tabindex="0"></div>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=eaa2d3c0f7797919e4545ef2555e822c"></script>
<script type="text/javascript">
var map = new AMap.Map('container',{
resizeEnable: true,
zoom: 16,
center: [113.673192,34.688124]
});
var marker = new AMap.Marker({
map:map,
icon:"as/01.ico",
//点标记在地图上显示的位置
size: new AMap.Size(128,128), //图标大小
imageSize: new AMap.Size(25,25),
position: [113.673192,34.688124],
offset : new AMap.Pixel(-12,-12)
});
//为Marker指定目标显示地图。当参数值取null时,地图上移除当前Marker:setMap(null)
marker.setMap(map);
//设置覆盖物形状为圆
var circle = new AMap.Circle({
//设置圆心位置
center: [113.673192,34.688124],
//设置圆的半径
redius: 100,
//设置圆形填充透明度
fillOpacity:0.1,
//圆形填充颜色
fillColor:'#09f',
//设置线条颜色
strokeColor:'#09f',
//轮廓线宽度
strokeWeight:1
})
//将圆形扩状物加载到地图上
circle.setMap(map);
//根据地图上添加的覆盖物分布情况,自动缩放地图到合适的视野级别
map.setFitView()
var info = new AMap.InfoWindow({
//要显示的内容
content: '<div class="title">王帅鹏</div><div class="content">'+
'莫等闲,白了少年头,空悲切<br/>',
//相当于基点的偏移量
offset:new AMap.Pixel(0,-28),
//信息窗体尺寸
size:new AMap.Size(200,0)
})
//在地图的指定位置打开信息窗体
info.open(map,marker.getPosition())
</script>
<script type="text/javascript" src="http://webapi.amap.com/demos/js/liteToolbar.js"></script>
</body>
</html>