返回首页
当前位置: 主页 > 编程语言 > PHP教程 >

php+js MAPABC 地图调用的简单例子

时间:2015-06-10 23:49来源:电脑教程学习网 www.etwiki.cn 编辑:admin

<?php
//经度_纬度_标题_地址_电话_类型_标题的链接地址
$data = array(
"116.304137_39.983821_title1_addurl1_tel1_type1_http://www.baidu.com",
"116.316345_39.977596_title2_addurl2_tel2_type2_http://www.sina.com",
"116.343048_40.000118_title3_addurl3_tel3_type3_http://www.163.com",
//"116.3096839_39.9843957_title4_addurl4_tel4_type4"
);
$data_str = implode('||',$data); //组合为sting
?>
<!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=

flashmap&v=2.4&key=b0a7db0b3a30f944a21c3682064dc70ef5b738b062f64

79a5eca39725798b1ee300bd8d5de3a4ae3|29e8ed1f7f6a97d8e99

fc568cea6a7dc0ccd920856e07c0718b9885faf7551a18141699c81f526d7"></script>

<script type="text/javascript">
var mapObj=null;
function mapInit(data) {
var mapoption = new MMapOptions();
mapoption.toolbar = MConstants.ROUND; //设置地图初始化工具条,ROUND:新版圆工具条
mapoption.toolbarPos=new MPoint(20,20); //设置工具条在地图上的显示位置
mapoption.overviewMap = MConstants.SHOW; //设置鹰眼地图的状态,SHOW:显示,HIDE:隐藏(默认)
mapoption.scale = MConstants.SHOW; //设置地图初始化比例尺状态,SHOW:显示(默认),HIDE:隐藏。
mapoption.zoom = 13;//要加载的地图的缩放级别
mapoption.center = new MLngLat(116.397428,39.90923);//要加载的地图的中心点经纬度坐标
mapoption.language = MConstants.MAP_CN;//设置地图类型,MAP_CN:中文地图(默认),MAP_EN:英文地图
mapoption.fullScreenButton = MConstants.SHOW;//设置是否显示全屏按钮,SHOW:显示(默认),HIDE:隐藏
mapoption.centerCross = MConstants.SHOW;//设置是否在地图上显示中心十字,SHOW:显示(默认),HIDE:隐藏
mapoption.requestNum=100;//设置地图切片请求并发数。默认100。
mapObj = new MMap("map", mapoption); //地图初始化

//自动加载点-start
var resultCount=10;
keywordSearch_CallBack(data);
//-end

}
/*
function keywordSearch(){
var keywords = document.getElementById("keyword").value;
var city = document.getElementById("city").value;
var MSearch = new MPoiSearch();
var opt = new MPoiSearchOptions();
opt.recordsPerPage = 10;//每页返回数据量,默认为10
opt.pageNum = 1;//当前页数。
opt.dataType = "";//数据类别,该处为分词查询,只需要相关行业关键字即可
opt.dataSources = MConstants.DS_BASE_ENPOI;//数据源,基础+企业地标数据库(默认)
MSearch.setCallbackFunction(keywordSearch_CallBack);
MSearch.poiSearchByKeywords(keywords,city,opt);
}
var resultCount=10;
*/
function keywordSearch_CallBack(data){
var resultStr="";
/*
var data = new Array(
"116.304137_39.983821_title1_addurl1_tel1_type1",
"116.316345_39.977596_title2_addurl2_tel2_type2",
"116.343048_40.000118_title3_addurl3_tel3_type3",
"116.3096839_39.9843957_title4_addurl4_tel4_type4"
);
*/
data = data.split('||'); //拆分传参值成为数组
if(data.length<0){
resultStr="未查找到任何结果!<br/>建议:<br/>1.请确保所有字词拼写正确。<br/>2.尝试不同的关键字。<br/>3.尝试更宽泛的关键字。";
}else{
var marker = new Array();
resultCount=data.length;
for (var i = 0; i < data.length; i++) {
data_str = data[i];
data_arr = data_str.split('_');
resultStr += "<div id='divid"+(i)+"' onmouseover='openMarkerTipById1("+(i)+",this)'

onmouseout='onmouseout_MarkerStyle("+(i+1)+",this)' style=\"font-size: 13px;

cursor:pointer;padding:2px 0 10px 5px;\">"+(i+1)+"、"+data_arr[2]+"<br \/>";

resultStr += TipContents(data_arr[5],data_arr[3],data_arr[4]);
resultStr += "<br \/></div>";
//resultStr += "<br />城市:"+data.poilist[i].citycode + "<br \/></div>";

var markerOption = new MMarkerOptions();
markerOption.imageUrl ="http://code.mapabc.com/images/lan_1.png";
markerOption.picAgent = false;

var tipOption = new MTipOptions();
tipOption.title="<a href='"+data_arr[6]+"'>"+(i+1) + ". "+ data_arr[2]+"<\/a>";
var tipC = "<br />"+TipContents(data_arr[5],data_arr[3],data_arr[4]);
tipOption.content=tipC;//tip内容
tipOption.hasShadow=true;
tipOption.titleFontStyle.name="Arial";
tipOption.titleFontStyle.size=12;
tipOption.titleFontStyle.color= 0x005cb5;
tipOption.titleFontStyle.bold=true;
tipOption.contentFontStyle.name="Arial";
tipOption.contentFontStyle.size=13;
tipOption.contentFontStyle.color= 0x000000 ;
tipOption.contentFontStyle.bold=false;

markerOption.tipOption = tipOption;
markerOption.canShowTip=true;
markerOption.hasShadow=true;
var mar = new MMarker(new MLngLat(data_arr[0],data_arr[1]),markerOption);
mar.id=(i);
marker.push(mar);
}
mapObj.addOverlays(marker,true);
mapObj.addEventListener(mapObj,MConstants.TIP_OPEN,openTip);
}
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 = 0; 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("<?php echo $data_str?>");'>
<table width="989" border="0" cellpadding="0" cellspacing="0" bgcolor="#DDDDDD">

<tr height="100%">
<td rowspan="2"><div id="map" style="height:600px; width:750px"></div></td>
<!--
<td style="width:247px;border-left:1px solid #666;">
<div style="padding:5px 0px 0px 5px;font-size:12px;height:94px;">关键字搜索
<br />城 市:<input type="text" id="city" name="city" value="010" />
<br />关键字:<input type="text" id="keyword" name="keyword" value="中关村"/><br /><input type="button" value="查询" onclick="keywordSearch()" style="margin-left:100px"/>
</div>
</td>
-->
</tr>

<tr>
<td style="width:247px;border-left:1px solid #666;border-top:1px solid #666;">
<div id="result" name="result" style="height:600px;overflow:auto;width:247px;"></div>
</td>
</tr>
</table>
</body>
</html>
 

------分隔线----------------------------
标签(Tag):php php实例教程 php5 php源代码 php基础教程 php技巧 php6 php教程
------分隔线----------------------------
推荐内容
猜你感兴趣