|
@@ -4,30 +4,16 @@
|
|
|
value="searchValue"
|
|
|
:search-option="searchOption"
|
|
|
:on-search-result="onSearchResult"></el-amap-search-box> -->
|
|
|
- <el-amap :zoom="zoom"
|
|
|
- ref='map'
|
|
|
- vid="amapDemo"
|
|
|
- :amap-manager="amapManager"
|
|
|
- :center="center"
|
|
|
- :events="markerEvents"
|
|
|
- class="amap-demo">
|
|
|
+ <el-amap :zoom="zoom" ref='map' vid="amapDemo" :amap-manager="amapManager" :center="center" :events="markerEvents"
|
|
|
+ class="amap-demo">
|
|
|
<!-- :plugin="plugin" -->
|
|
|
- <el-amap-marker v-for="(marker, index) in markers"
|
|
|
- :key="index"
|
|
|
- :position="marker.location"
|
|
|
- :title="marker.title"></el-amap-marker>
|
|
|
- <el-amap-text v-for="(marker,index) in markers"
|
|
|
- :key="index+'xxx'"
|
|
|
- :text="marker.title"
|
|
|
- :position="marker.location"
|
|
|
- :offset="[40,-10]"></el-amap-text>
|
|
|
- <el-amap-polyline :path="path"
|
|
|
- strokeColor='#4196fc'></el-amap-polyline>
|
|
|
- <el-amap-text v-for="(text,index) in texts"
|
|
|
- :key="index+'ooo'"
|
|
|
- :text="text.text"
|
|
|
- :position="text.position"
|
|
|
- :offset="[-50,0]"></el-amap-text>
|
|
|
+ <el-amap-marker v-for="(marker, index) in markers" :key="index" :position="marker.location"
|
|
|
+ :title="marker.title"></el-amap-marker>
|
|
|
+ <el-amap-text v-for="(marker, index) in markers" :key="index + 'xxx'" :text="marker.title" :position="marker.location"
|
|
|
+ :offset="[40, -10]"></el-amap-text>
|
|
|
+ <el-amap-polyline :path="path" strokeColor='#4196fc'></el-amap-polyline>
|
|
|
+ <el-amap-text v-for="(text, index) in texts" :key="index + 'ooo'" :text="text.text" :position="text.position"
|
|
|
+ :offset="[-50, 0]"></el-amap-text>
|
|
|
</el-amap>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -57,14 +43,14 @@ import VueAMap from 'vue-amap'
|
|
|
}());
|
|
|
// Vue.use(VueAMap)
|
|
|
VueAMap.initAMapApiLoader({
|
|
|
- key: 'b1e6ac2eb28902ce91a490edf194e000',
|
|
|
+ key: 'fa90e24ad5e923f446635d068cacf794',
|
|
|
plugin: ['Autocomplete', 'PlaceSearch', 'Scale', 'OverView', 'ToolBar', 'MapType', 'PolyEditor', 'AMap.CircleEditor'],
|
|
|
v: '1.4.4',
|
|
|
})
|
|
|
let amapManager = new VueAMap.AMapManager();
|
|
|
export default {
|
|
|
props: ['activeRow'],
|
|
|
- data () {
|
|
|
+ data() {
|
|
|
return {
|
|
|
zoom: 20,
|
|
|
amapManager,
|
|
@@ -84,25 +70,25 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
- activeRow (val) {
|
|
|
+ activeRow(val) {
|
|
|
if (val) {
|
|
|
console.log(val)
|
|
|
this.init()
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- mounted () {
|
|
|
+ mounted() {
|
|
|
this.init()
|
|
|
},
|
|
|
|
|
|
- activated () {
|
|
|
+ activated() {
|
|
|
// this.init()
|
|
|
},
|
|
|
methods: {
|
|
|
// 地点搜索
|
|
|
// searchOption () { },
|
|
|
// 重置
|
|
|
- init () {
|
|
|
+ init() {
|
|
|
if (this.activeRow.schoolLongitudeLatitude) {
|
|
|
let add = {
|
|
|
title: '教学点',
|
|
@@ -138,8 +124,8 @@ export default {
|
|
|
this.getDistance(this.signInLongitudeLatitude, this.schoolLongitudeLatitude)
|
|
|
this.getDistance(this.signOutLongitudeLatitude, this.schoolLongitudeLatitude)
|
|
|
},
|
|
|
- onSearchResult () { },
|
|
|
- getDistance (sigin, school) {
|
|
|
+ onSearchResult() { },
|
|
|
+ getDistance(sigin, school) {
|
|
|
|
|
|
if (sigin && sigin.length > 0 && school && school.length > 0) {
|
|
|
let o = amapManager.getMap();
|
|
@@ -171,6 +157,7 @@ export default {
|
|
|
.title {
|
|
|
margin-bottom: 20px;
|
|
|
}
|
|
|
+
|
|
|
.amap-demo {
|
|
|
height: 500px;
|
|
|
}
|