//初始化地图对象,加载地图 var map = new amap.map("mapcontainer",{ resizeenable: true, mapstyle: 'amap://styles/normal', //二维地图显示视口 view: new amap.view2d({ //地图中心点 center:new amap.lnglat(116.846085,37.299916), //地图显示的缩放级别 zoom:13 }) }); map.setlang('cn'); //地图中添加地图操作toolbar插件 map.plugin(["amap.toolbar"], function(){ var toolbar = new amap.toolbar(); map.addcontrol(toolbar); }); //地图初始化时,在地图上添加一个marker标记,鼠标点击marker可弹出自定义的信息窗体 addmarker(); //添加marker标记 function addmarker(){ map.clearmap(); var marker = new amap.marker({ map: map, //位置 position: new amap.lnglat(116.846085,37.299916), //复杂图标 icon: "http://webapi.amap.com/images/0.png" }); //鼠标点击marker弹出自定义的信息窗体 amap.event.addlistener(marker,'click',function(){ infowindow.open(map,marker.getposition()); }); settimeout(function(){ infowindow.open(map, marker.getposition()); },1000); } //实例化信息窗体 var infowindow = new amap.infowindow({ iscustom:true, //使用自定义窗体 content:createinfowindow('山东鲁晶化工科技有限公司',"山东省德州市临邑化工产业园
电话:+86-534-5359678"), offset:new amap.pixel(16, -45)//-113, -140 }); //构建自定义信息窗体 function createinfowindow(title,content){ var info = document.createelement("div"); info.classname = "info"; // 定义顶部标题 var top = document.createelement("div"); var titled = document.createelement("div"); var closex = document.createelement("img"); top.classname = "info-top"; titled.innerhtml = title; closex.src = "http://webapi.amap.com/images/close2.gif"; closex.onclick = closeinfowindow; top.appendchild(titled); top.appendchild(closex); info.appendchild(top); // 定义中部内容 var middle = document.createelement("div"); middle.classname = "info-middle"; middle.style.backgroundcolor='white'; middle.innerhtml = content; info.appendchild(middle); // 定义底部内容 var bottom = document.createelement("div"); bottom.classname = "info-bottom"; bottom.style.position = 'relative'; bottom.style.top = '0px'; bottom.style.margin = '0 auto'; var sharp = document.createelement("img"); sharp.src = "http://webapi.amap.com/images/sharp.png"; bottom.appendchild(sharp); info.appendchild(bottom); return info; } //关闭信息窗体 function closeinfowindow(){ map.clearinfowindow(); }