要求能定位到国外 及 查看了文档 百度支持东南亚大部分地区 满足需求 从而使用百度地图
当前选中：{{mapPointName}}
确认
geoc= null;
exportdefault{
name:"addHospital",
data() {return{
dialogMap:false,
mapName:"",
mapPointName:"",
loading:true,
mapGetshow:true,
dialogName:""};
},
created() {this.mapBuild()},
methods: {//搜索地图
mapNameChange() {
let that= this,
point,
marker= null;
let local= newBMap.LocalSearch(map, {
renderOptions: { map: map },
onSearchComplete: res=>{if (local.getResults() !=undefined) {
map.clearOverlays();//清除地图上所有覆盖物
if (local.getResults().getPoi(0)) {
point= local.getResults().getPoi(0).point; //获取第一个智能搜索的结果
map.centerAndZoom(point, 10);
marker= new BMap.Marker(point); //创建标注
map.addOverlay(marker); //将标注添加到地图中
marker.enableDragging(); //可拖拽
geoc.getLocation(point, function(rs) {var addComp =rs.addressComponents;
console.log(addComp);
that.mapPointName=addComp.province+
", " +addComp.city+
", " +addComp.district+
", " +addComp.street+
", " +addComp.streetNumber;
});
}else{
alert("未匹配到地点!可拖动地图上的红色图标到精确位置");
}
}else{
alert("未找到搜索结果");
}
}
});
local.search(this.mapName);
},//地图显示
mapBuild() {
let that= this;this.dialogMap = !this.dialogMap;
setTimeout(function() {if(that.mapGetshow) {
map= new BMap.Map("container");
geoc= newBMap.Geocoder();
let point= new BMap.Point(116.3964, 39.9093);
map.centerAndZoom(point,10);
map.enableScrollWheelZoom();var geolocation = newBMap.Geolocation();//定位
geolocation.getCurrentPosition(
r=>{
console.log(r);var mk = newBMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
geoc.getLocation(r.point,function(rs) {var addComp =rs.addressComponents;
console.log(addComp);
that.mapPointName=addComp.province+addComp.city+addComp.district+addComp.street+addComp.streetNumber;
that.loading= false;
that.mapGetshow= false;
});
},
{ enableHighAccuracy:true}
);//鼠标点击
map.addEventListener("click", function(e) {
console.log(e);var pt =e.point;var marker = new BMap.Marker(pt); //创建标注
map.clearOverlays();
map.addOverlay(marker);
geoc.getLocation(pt,function(rs) {var addComp =rs.addressComponents;
console.log(addComp);
that.mapPointName=addComp.province+addComp.city+addComp.district+addComp.street+addComp.streetNumber;
});
});
}
},1000);
}
}
};
.addHospital {
width:100%;
height:100%;
.map {
padding: 10px;
.input-with-select {
}
.map-btn {
padding: 10px 20px;
margin: auto;
text-align: right;
button {
padding: 12px 30px;
}
}
}
}
