|
@@ -1,7 +1,16 @@
|
|
|
<template>
|
|
|
<view>
|
|
|
- <map style="width: 100%; height: 100vh;" :latitude="latitude" :longitude="longitude" :markers="covers"></map>
|
|
|
+ <map
|
|
|
+ id="pagemap"
|
|
|
+ style="width: 100%; height: 100vh;"
|
|
|
+ :show-location="true"
|
|
|
+ :latitude="latitude"
|
|
|
+ :longitude="longitude"
|
|
|
+ @markertap="markertap"
|
|
|
+ :markers="covers"></map>
|
|
|
<!-- <u-empty src="/static/img/empty.png" icon-size="335" text="正在建设中" color="#878787" mode="search"></u-empty> -->
|
|
|
+
|
|
|
+ <u-toast ref="uToast" />
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
@@ -9,24 +18,79 @@
|
|
|
export default{
|
|
|
data(){
|
|
|
return{
|
|
|
- latitude: 26.605849,
|
|
|
- longitude: 106.728733,
|
|
|
+ page_map:'',
|
|
|
+ id: 0, //使用 marker点击事件 需要填写id
|
|
|
+ latitude: 26.64969,
|
|
|
+ longitude: 106.636453,
|
|
|
covers: [{
|
|
|
- latitude: 26.604745,
|
|
|
- longitude: 106.724332,
|
|
|
- iconPath: 'https://www.baidu.com/img/flexible/logo/pc/result.png'
|
|
|
- }, {
|
|
|
- latitude: 39.90,
|
|
|
- longitude: 116.39,
|
|
|
- // iconPath: '../../../static/location.png'
|
|
|
- }]
|
|
|
+ latitude: 26.597864,
|
|
|
+ longitude: 106.72947,
|
|
|
+ iconPath: 'https://www.baidu.com/img/flexible/logo/pc/result.png'
|
|
|
+ }],
|
|
|
|
|
|
}
|
|
|
},
|
|
|
onLoad(){
|
|
|
+ this.page_map = uni.createMapContext("pagemap",this);
|
|
|
+ // console.log('page_map',this.page_map);
|
|
|
+ this.getNearRoadsl();
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.getLocation();
|
|
|
|
|
|
},
|
|
|
methods:{
|
|
|
+ getLocation(){
|
|
|
+ let that = this;
|
|
|
+ // console.log("请求定位")
|
|
|
+ uni.getLocation({
|
|
|
+ type:"gcj02",
|
|
|
+ success : function (res) {
|
|
|
+ // console.log("定位返回信息:", res);
|
|
|
+ that.latitude = res.latitude;
|
|
|
+ that.longitude = res.longitude;
|
|
|
+ // console.log('that.latitude',that.latitude)
|
|
|
+ // console.log(res.longitude + "," + res.latitude )
|
|
|
+ },
|
|
|
+ fail: function(res){
|
|
|
+ console.log("请求错误:", res)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async getNearRoadsl(){
|
|
|
+ await this.getLocation();
|
|
|
+ this.$u.api.nearRoadsl({latitude:this.latitude,longitude:this.longitude})
|
|
|
+ .then(res=>{
|
|
|
+ // this.$refs.uToast.show({
|
|
|
+ // title: res.msg,
|
|
|
+ // type: 'success',
|
|
|
+ // });
|
|
|
+ // this.covers = res.data;
|
|
|
+ // console.log('this.covers',this.covers)
|
|
|
+ res.data.forEach(item=>{
|
|
|
+ if(item.latitude&&item.longitude){
|
|
|
+ let marker = {
|
|
|
+ latitude: item.latitude,
|
|
|
+ longitude:item.longitude,
|
|
|
+ // id:'0',
|
|
|
+ iconPath: 'https://www.baidu.com/img/flexible/logo/pc/result.png'
|
|
|
+ }
|
|
|
+ this.covers.push(marker);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // this.covers =
|
|
|
+ // console.log('getNearRoadsl',res)
|
|
|
+ }).catch(err=>{
|
|
|
+ this.$refs.uToast.show({
|
|
|
+ title: err.msg,
|
|
|
+ type: 'error',
|
|
|
+ });
|
|
|
+ console.log('getNearRoadsl ',err)
|
|
|
+ });
|
|
|
+ },
|
|
|
+ markertap(e){
|
|
|
+ console.log('markertap',e)
|
|
|
+ }
|
|
|
|
|
|
}
|
|
|
}
|