项目需求：标注一个或者两个点、显示信息窗体、自定义icon
<!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: %;
margin: 0px;
font-family: "微软雅黑"
}
.content{
padding-right: 5px;
color: #;
line-height: 23px;
font-size: 14px;
}</style>
<title>定位</title> </head>
<body>
<div id="container" tabindex=""></div>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.3&key=申请的key"></script>
<script type="text/javascript">
var pt1=${pt1};
var pt2=${pt2};
var location1 = "上海市盛夏路666号";
var location2 = "上海市南京西路";
//初始化地图对象，加载地图
var mapObj = new AMap.Map('container',{
resizeEnable: true,
});
//实例化marker pt为经纬度，infoTest为信息窗体显示文案，iconSrc为标注图标路径
function addMarker(pt,infoText,iconSrc){
marker=new AMap.Marker({
//标注图标
icon:new AMap.Icon({
imageSize:new AMap.Size(,),
size:new AMap.Size(,),
image:iconSrc
})
});
marker.setMap(mapObj);
marker.setPosition(pt);
//信息窗体内容
var infowindow = new AMap.InfoWindow({
content: '<div class="content">'+infoText+'</div>',
offset: new AMap.Pixel(, -)
});
//标注点击时显示信息窗体
marker.on('click',function(e){
infowindow.open(mapObj,e.target.getPosition());
});
infowindow.open(mapObj,marker.getPosition());
};
//地图工具条插件、地图比例尺插件
AMap.plugin(['AMap.ToolBar','AMap.Scale'],function(){
var toolBar = new AMap.ToolBar();
var scale = new AMap.Scale();
mapObj.addControl(toolBar);
mapObj.addControl(scale);
});
//添加点标记
if(pt1 != ''){
addMarker(pt1,location1,"/resources/img/endIcon.png");
if(pt2 != ''){
//设置地图到合适的视野级别
mapObj.setFitView();
}else{
//设置地图缩放比例
mapObj.setZoom();
//设置地图中心
mapObj.setCenter(pt1);
}
};
if(pt2 != ''){
addMarker(pt2,location2,"/resources/img/signInIcon.png");
if(pt1 != ''){
//设置地图到合适的视野级别
mapObj.setFitView();
}else{
//设置地图缩放比例
mapObj.setZoom();
//设置地图中心
mapObj.setCenter(pt2);
};
};
</script>
</body>
</html>