<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">??
<html xmlns="http://www.w3.org/1999/xhtml">??
<head>??
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />??
<title>加载地图示例</title>??
?
<script type="text/javascript" src="http://app.mapabc.com/apis?&t=ajaxmap&v=2.1.2&key=208579e378ea73eb791a6cc139f92ef9a3b5dc4d36ba973b05d9b79380f3765f4887c6cbefc3a1b2"></script>??
?
<script type="text/javascript">??
var mapObj;??
function mapInit() {??
??? var mapOptions = new MMapOptions();//构建地图辅助类??
??? mapOptions.zoom=13;//设置地图zoom级别??
??? mapOptions.center=new MLngLat(116.397428,39.90923);?? //设置地图中心点??
??? mapOptions.toolbar = DEFAULT;//工具条??
??? mapOptions.toolbarPos = new MPoint(15,15);? //工具条??
??? mapOptions.overviewMap = SHOW;//是否显示鹰眼??
?? mapOptions.scale = SHOW;//是否显示比例尺??
?? mapOptions.returnCoordType = COORD_TYPE_OFFSET;//返回数字坐标??
?? mapOptions.zoomBox = true;//鼠标滚轮缩放和双击放大时是否有红框动画效果。??
??? mapObj=new MMap("iCenter",mapOptions); //地图初始?
???
??? keywordSearch();
}??
function keywordSearch(){??
??? var keywords = "家乐福";??
??? var city = "苏州";??
??? var MSearch = new MPoiSearch();??
??? var opt = new MPoiSearchOptions();??
??? opt.recordsPerPage = 10;//每页返回数据量，默认为10??
??? opt.pageNum = 1;//当前页数。??
??? opt.dataType = "";//数据类别，该处为分词查询，只需要相关行业关键字即可??
??? opt.dataSources = DS_BASE_ENPOI;//数据源，基础+企业地标数据库（默认）??
??? MSearch.setCallbackFunction(keywordSearch_CallBack);??
?? MSearch.poiSearchByKeywords(keywords,city,opt);??
}
function keywordSearch_CallBack(data){??
??? var resultStr="";??
??? if(data.error_message != null){??
??????? resultStr="查询异常！"+data.error_message;??
??? }else{??
??? switch(data.message){??
??????? case 'ok':??
??????????? var marker = new Array();??
??????????? if(data.poilist.length==0){??
??????????????? resultStr = "未查找到任何结果!<br />建议：<br />1.请确保所有字词拼写正确。<br />2.尝试不同的关键字。<br />3.尝试更宽泛的关键字。";??
??????????? }else{??
??????????????? resultCount=data.poilist.length;??
??????????????? for (var i = 0; i < data.poilist.length; i++) {??
??????????????????? resultStr += "<div id='divid"+(i+1)+"' onmouseover='openMarkerTipById1("+(i+1)+",this)' onmouseout='onmouseout_MarkerStyle("+(i+1)+",this)' style=\"font-size: 13px;cursor:pointer;padding:2px 0 10px 5px;\">"+(i+1)+"、"+data.poilist[i].name+"<br \/>";??
??????????????????? resultStr += TipContents(data.poilist[i].type,data.poilist[i].address,data.poilist[i].tel);??
??????????????????? resultStr += "<br />城市："+data.poilist[i].citycode + "<br \/></div>";??
??????????????????? var markerOption = new MMarkerOptions();??
??????????????????? markerOption.imageUrl ="http://code.mapabc.com/images/lan_1.png";??
?
??????????????????? var tipOption = new MTipOptions();??
??????????????????? tipOption.title=(i+1) + ". "+ data.poilist[i].name;??
??????????????????? var tipC = "<br />"+TipContents(data.poilist[i].type,data.poilist[i].address,data.poilist[i].tel);??
??????????????????? tipOption.content=tipC;//tip内容??
??????????????????? tipOption.borderStyle.thickness=2;??
??????????????????? tipOption.borderStyle.color= 0x005cb5;??
??????????????????? tipOption.borderStyle.alpha=1;??
??????????????????? tipOption.titleFontStyle.name="Arial";??
??????????????????? tipOption.titleFontStyle.size=12;??
??????????????????? tipOption.titleFontStyle.color= 0xffffff;??
??????????????????? tipOption.titleFontStyle.bold=true;??
??????????????????? tipOption.contentFontStyle.name="Arial";??
??????????????????? tipOption.contentFontStyle.size=13;??
??????????????????? tipOption.contentFontStyle.color= 0x000000 ;??
??????????????????? tipOption.contentFontStyle.bold=false;??
??????????????????? tipOption.fillStyle.color= 0xFFFFFF; //填充色??
??????????????????? tipOption.fillStyle.alpha=1;??
??????????????????? tipOption.titleFillStyle.color=0x005cb5;??
??????????????????? tipOption.titleFillStyle.alpha=1;??
?
??????????????????? markerOption.tipOption = tipOption;??
??????????????????? markerOption.canShowTip=true;??
??????????????????? var mar = new MMarker(new MLngLat(data.poilist[i].x,data.poilist[i].y),markerOption);??
??????????????????? mar.id=(i+1);??
??????????????????? marker.push(mar);??
??????????????? }??
??????????????? mapObj.addOverlays(marker,true);??
??????????????? mapObj.addEventListener(mapObj,TIP_OPEN,openTip);??
??????????? }??
??????? break;??
??????? case 'error':??
??????????? resultStr= "<div class=\"default\"><div class=\"default_title\">网络忙！请重新尝试！</div><div class=\"d_link\"><div class=\"d_right\"></div><div class=\"suggest\"><strong>建议：</strong><br />如果您刷新页后仍无法显示结果，请过几分钟后再次尝试或者与我们的服务人员联系。<br />Email：service@mapabc.com <br />电话：400 810 0080</div></div></span>错误信息："+data.message+"</div>";??
??????? break;??
??????? default:??
??????????? resultStr= "<div class=\"default\"><div class=\"default_title\">对不起！网络繁忙！请稍后重新尝试！</div><div class=\"d_link\"><div class=\"d_right\"></div><div class=\"suggest\"><strong>建议：</strong><br />如果您刷新页后仍无法显示结果，请过几分钟后再次尝试或者与我们的服务人员联系。<br />Email：service@mapabc.com <br />电话：400 810 0080</div></div></span>错误信息："+data.message+"</div>";??
??????? }??
??? }??
??? document.getElementById("result").innerHTML = resultStr;??
}?
function TipContents(type,address,tel){??
?? if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {??
?????? type = "暂无";??
?? }??
?? if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {??
?????? address = "暂无";??
??? }??
??? if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {??
??????? tel = "暂无";??
??? }??
??? var str ="地址：" + address + "<br>电话：" + tel + " <br>类型："+type;??
??? return str;??
}??
function openMarkerTipById1(pointid,thiss){? //根据id打开搜索结果点tip??
??? thiss.style.background='#CFD6E8';??
??? mapObj.openOverlayTip(pointid);??
}??
function onmouseout_MarkerStyle(pointid,thiss) {//鼠标移开后点样式恢复??
?? thiss.style.background="";??
}??
function openTip(param){??
??? var n = "divid"+(param.overlayId);??
??? for (var i = 1; i <= resultCount; ++i){??
??????? var id="divid"+i;??
??????? document.getElementById(id).style.background='';??
??????? document.getElementById(id).onmouseout = function(){this.style.backgroundColor='';};??
??? }??
??? document.getElementById(n).style.background='#CFD6E8';??
??? document.getElementById(n).onmouseout = function(){this.style.backgroundColor='#CFD6E8';};??
}
</script>??
</head>??
<body onload="mapInit();">??
<div style="width:500px; height:500px;">??
?<div id="iCenter" style="width:500px; height:500px;"></div>??
</div>
?<div id="result" style="width:500px; height:500px;"></div>??
</body>??
</html>