You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
80 lines
1.8 KiB
80 lines
1.8 KiB
<template> |
|
<map id="map" :longitude="map.longitude" :latitude="map.latitude" :markers="mapConfig" scale="12" show-location |
|
@regionchange="test" style="width: 100%; height: 100%;"></map> |
|
</template> |
|
<script> |
|
import { |
|
getFishIndex, |
|
getFishPlaceInfo |
|
} from '@/api/fish' |
|
|
|
export default { |
|
|
|
name: "Index", |
|
components: {}, |
|
props: {}, |
|
data: function() { |
|
return { |
|
mapConfig: [], |
|
map: { |
|
latitude: 30.579150542191858, |
|
longitude: 114.31590683471099 |
|
}, |
|
}; |
|
}, |
|
onShow: function() { |
|
|
|
this._mapContext = uni.createMapContext("map", this); |
|
this._mapContext.moveToLocation() |
|
|
|
let that = this; |
|
|
|
// uni.getLocation({ |
|
// success(localtionRs) { |
|
// that.refresh(localtionRs); |
|
// }, |
|
// }) |
|
}, |
|
methods: { |
|
test(res) { |
|
let that = this; |
|
if (res.type == "end") { |
|
this._mapContext.getCenterLocation({ |
|
success(res){ |
|
that.refresh(res) |
|
} |
|
}) |
|
} |
|
}, |
|
refresh(location){ |
|
let that = this; |
|
getFishIndex(location).then(res => { |
|
// console.log(res.data) |
|
if (res.data) { |
|
res.data.forEach(e => { |
|
// 需要判断不存在对应标点才继续新增,另外太近标点需要做marker聚合 |
|
// 性能:可以考虑把之前增加的删掉(如果页面上标点太多) |
|
that.mapConfig.push({ |
|
alpha: .8, |
|
height: 30, |
|
width: 30, |
|
id: e.id, |
|
name: e.placeName, |
|
latitude: Number(e.latitude), |
|
longitude: Number(e.longitude), |
|
iconPath: e.mode == 0 ? "/static/public_fish.png" : |
|
"/static/business_fish.png" |
|
}) |
|
}) |
|
} |
|
}) |
|
}, |
|
} |
|
}; |
|
</script> |
|
<style lang="less"> |
|
page { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
</style> |