<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>
<title>Map Example</title>
<script type="text/javascript" src="js/common.js"></script>
<script src="js/app.js" charset="UTF-8"></script>
<script src="js/mui.min.js" charset="UTF-8"></script>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
var em=null,map=null;
// H5 plus事件处理
function plusReady(){
// 确保DOM解析完成
if(!em||!window.plus||map){return};
map = new plus.maps.Map("map");
//进入地图加载地图上面的门站点位
userLocation();
}
if(window.plus){
plusReady();
}else{
document.addEventListener("plusready",plusReady,false);
}
// DOMContentloaded事件处理
document.addEventListener("DOMContentLoaded",function(){
em=document.getElementById("map");
plusReady();
},false);
//获取个人位置
function userLocation(){
map.showUserLocation( true );
map.getUserLocation(function(state,pos){
if(0==state){
map.setCenter(pos);
loadaddress();
}
});
}
function listplay(){
}
/ mui.openWindow({
url:'main.html',
id:'main',
styles:{
top:newpage-top-position,//新页面顶部位置
bottom:newage-bottom-position,//新页面底部位置
width:newpage-width,//新页面宽度,默认为100%
height:newpage-height,//新页面高度,默认为100
},
extras:{
name:'Jzbh' //扩展参数
},
createNew:false,//是否重复创建同样id的webview,默认为false:不重复创建,直接显示
show:{
autoShow:true,//页面loaded事件发生后自动显示,默认为true
aniShow:animationType,//页面显示动画,默认为”slide-in-right“;
duration:animationTime//页面动画持续时间,Android平台默认100毫秒,iOS平台默认200毫秒;
},
waiting:{
autoShow:true,//自动显示等待框,默认为true
title:'正在加载...',//等待对话框上显示的提示内容
options:{
width:waiting-dialog-widht,//等待框背景区域宽度,默认根据内容自动计算合适宽度
height:waiting-dialog-height,//等待框背景区域高度,默认根据内容自动计算合适高度
}
}
})
/
//门站点位
function listdianwei(data){
var addressList = data.address;
var size = addressList.length;
for(var i=0;i<size;i++){
var lastAddress = addressList[i];
var jd=lastAddress.Ddjd;
var wd=lastAddress.Ddwd;
var nr=lastAddress.Jzbh+":"+lastAddress.Jzdz;
var marker=new plus.maps.Marker(new plus.maps.Point(jd,wd));
marker.setIcon("img/06.png");
marker.setLabel(lastAddress.Jzmc);
var bubble = new plus.maps.Bubble(nr);
marker.setBubble(bubble);
map.addOverlay(marker);
}
}
</script>
<link rel="stylesheet" href="css/common.css" type="text/css" charset="utf-8"/>
<style type="text/css">
map {
width: 100%;
position: fixed;
top: 45px;
bottom: 0px;
line-height: 200px;
text-align: center;
background: #FFFFFF;
}
.ipos {
background: no-repeat center center url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAsCAYAAAAn4+taAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwNC8wMS8xNExYUU4AAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAACTklEQVRoge2YO2gUURSGv7PjEkULO4UoFooIFgtzprAPWMiWKewSTadgYWEhBjHCloGUQtYHaGEjGAQtUmgnZO9YpsqC2NgYIwjRInMscoPrYkzhGTIs8zdnzoP578ewM/eumBmjoMZ+L8BLNUjVVINUTTVI1VSDVE0jA3KgjJuGEE6LyI2iKC6JyBkzWxORF8ADVV0rw1O891ohhCngPnDyL+1PZjabZdkTV1OcQUIIV4CHMf0JvAK+A0eANjAWe1dV9ZGbMY6/kTzPzwHzMV0VkZaqTgLTqjopIi1gNfbnQwhnvbzBEcTMbgFHgXURaRdFsRFCWAa+hhCWi6LYEJE2sB7nbnp5g+9b62KMIU3Tvoh0gQm2Fz0hIt00TftAADCztqO3K8h4jJsAZnZ+sDmQ/wAQkXEc5QnyJcZjACLybLApIk/j5YmheRd5gryLMev1elOqesfMrpvZczO7pqqzvV5vGmgNzbvIDUREXsbLRES6IYTbzWZzMcuyy0mSPA4h3BWRxR3PgXkff6/vSJ7nx83sPXBqoLwJFEACHByofxSRC2mafnYxx/GJxEW9GSofAg7zJwTAa08I8N80doG9HrHx++vvJlcQVV0xs6V/zZjZkqquePpCOdv4OWBrl96WiNwrwdMfJMuyHFjYpb2gqh+8PaG8g9Uc0B+q9WO9FJUCoqrfgBm2X73EOBPrpai0o66qvgU6Me3EvDSVctTdUZIknaIoxhqNRmfv6f+T+1F3vzQy/6LUIFVTDVI11SBVUw1SNdUgVdPIgPwCtt+2JPQRVicAAAAASUVORK5CYII=);
background-size: 50px 44px;
}
.ys{
background: no-repeat center center url(img/04.png) ;
background-size: 30px 24px;
}
</style>
</head>
<body>
<header id="header">
<div class="nvbt ipos" onclick="userLocation();"></div>
<div class="nvtt">检测地图</div>
<div class="nvbt ys" onclick="listplay();" ></div>
</header>
<div id="map" >地图加载中...</div>
</body>
<script type="text/javascript" src="js/immersed.js" ></script>
</html>
0 个回复