Collection
Collection
apicloudmap.html
****************************************************************************************
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
<title>APP</title>
<link rel="stylesheet" type="text/css" href="../css/api.css" />
<style>
</style>
</head>
<body>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
var bMap;
function openToilet(){
// setTimeout(function(){
api.openWin({
name: 'win_toilet',
url: './win_toilet.html',
opaque: true,
animation: {
type: 'fade'
}
});
// },500);
}
//1:坐便式，2:蹲坑式
var toilet1 = [], toilet2 = [];
//id存起来
var annoId1 = [], annoId2 = [], lastId = null;
function addAnnotation(annoArr, type){
for(var i=0, len=annoArr.length; i<len; i++){
var curAnno = annoArr[i];
if(curAnno.title.indexOf('公共厕所') > -1 || curAnno.title.indexOf('公厕') > -1){
toilet2.push(curAnno);
annoId2.push(curAnno.id);
}else{
toilet1.push(curAnno);
annoId1.push(curAnno.id);
}
}
updateAnnotation(type);
}
//更新标注
function updateAnnotation(type){
if (lastId != null) {
bMap.removeAnnotations({
idArray: lastId
});
}
if(type == '1'){
bMap.addAnnotations({
annoArray: toilet1,
pinImg: 'widget://image/toilet1.png'
},function(ret,err){
if(ret){
// alert("addAnnotations OK " + JSON.stringify(ret));
openToilet();
}
});
lastId = annoId1;
}else if(type == '2'){
bMap.addAnnotations({
annoArray: toilet2,
pinImg: 'widget://image/toilet2.png'
},function(ret,err){
if(ret){
// alert("addAnnotations OK " + JSON.stringify(ret));
openToilet();
}
});
lastId = annoId2;
}
}
function searchNearBy(lon, lat, type){
//找厕所
bMap.searchNearBy({
key:'厕所',
lon: lon,
lat: lat,
radius: 1000
},function(ret,err){
if (ret.status){
var resArr = ret.resultArray;
var annoArr = [];
for(var i=0; i<resArr.length; i++){
var item = resArr[i];
annoArr.push({
id: i,
lon: item.lon,
lat: item.lat,
title: item.name,
subTitle: item.add,
// showBubble:false
});
}
addAnnotation(annoArr, type);
} else{
api.alert({title:'厕所去哪了', msg:err.msg});
}
});
}
function init(type){
bMap = api.require('baiduMap');
//打开地图
bMap.open({
x: 0,
y: api.pageParam.headerH,
w: api.frameWidth,
h: api.frameHeight
},function(ret,err){
if(ret){
bMap.showUserLocation({
isShow:true,
trackingMode:'none'
});
//定位
bMap.startLocation({
accuracy: '100m',
filter:1,
autoStop: true
},function(ret, err){
if(ret){
// alert("startLocation OK " + JSON.stringify(ret));
var lat = ret.lat;
var lon = ret.lon;
var t = ret.timestamp;
setTimeout(function(){
bMap.setZoomLevel({
level: 16
});
},300);
//定位中心
bMap.setCenter({
lon: lon,
lat: lat
});
searchNearBy(lon, lat, type);
}else{
alert("startLocation error " + JSON.stringify(err));
}
});
}else{
alert("open error " + JSON.stringify(err));
}
});
}
apiready = function(){
init(2);
};
</script>
</html>
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
