From ae038d50b068a02c4fe53725095dc952bf75b797 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Wed, 15 Dec 2021 17:36:21 +0800
Subject: [PATCH] 冲突
---
src/components/campusNav/index.vue | 117 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++--
1 files changed, 112 insertions(+), 5 deletions(-)
diff --git a/src/components/campusNav/index.vue b/src/components/campusNav/index.vue
index 1a14fe6..1008df4 100644
--- a/src/components/campusNav/index.vue
+++ b/src/components/campusNav/index.vue
@@ -20,12 +20,12 @@
<div class="container">
<div class="tab">
<ul>
- <li @click="tabClick"
+ <li @click="tabClick('步行')"
:class="{on:tabOneFlag}">
<i></i>
步行
</li>
- <li @click="tabClick"
+ <li @click="tabClick('驾车')"
:class="{on:tabTwoFlag}">
<i></i>
驾车
@@ -50,7 +50,8 @@
</div>
</div>
<div>
- <el-button type="danger">导航</el-button>
+ <el-button @click="startNavigation"
+ type="danger">导航</el-button>
</div>
</div>
</div>
@@ -58,13 +59,18 @@
</template>
<script>
+import { mapGetters } from 'vuex'
+import axios from 'axios'
export default {
name: 'campusNav',
data () {
return {
moveFlag: false,
tabOneFlag: true,
- tabTwoFlag: false
+ tabTwoFlag: false,
+ DC: null,
+ navigationWay: '步行',
+ routeLayer: null
}
},
props: {
@@ -74,6 +80,18 @@
getToName: {
type: String
}
+ },
+ computed: {
+ ...mapGetters([
+ 'viewer',
+ // 起点
+ 'startingPoint',
+ // 终点
+ 'terminus'
+ ])
+ },
+ created () {
+ this.DC = global.DC
},
methods: {
move (e) {
@@ -125,9 +143,98 @@
closeModel () {
this.$parent.closeCampusNav()
},
- tabClick () {
+ tabClick (param) {
+ this.navigationWay = param
this.tabOneFlag = !this.tabOneFlag
this.tabTwoFlag = !this.tabTwoFlag
+ },
+ startNavigation () {
+ if (this.routeLayer == null) {
+ this.routeLayer = new this.DC.VectorLayer('navigation')
+ this.viewer.addLayer(this.routeLayer)
+ } else {
+ this.routeLayer.clear()
+ }
+ if (this.startingPoint == null) {
+ this.$message('请输入起点!!!')
+ }
+ if (this.terminus == null) {
+ this.$message('请输入终点!!!')
+ }
+
+ // var start = this.DC.Transform.transformWGS84ToCartesian()
+ const startEntity = new this.DC.Billboard(new this.DC.Position(Number(this.startingPoint[0]), Number(this.startingPoint[1]), Number(this.startingPoint[2])), '/img/navicon/start.png')
+ this.routeLayer.addOverlay(startEntity)
+ // var end = this.DC.Transform.transformWGS84ToCartesian()
+ const endEntity = new this.DC.Billboard(new this.DC.Position(Number(this.terminus[0]), Number(this.terminus[1]), Number(this.terminus[2])), '/img/navicon/end.png')
+ this.routeLayer.addOverlay(endEntity)
+
+ var routes = ''
+
+ if (this.navigationWay == '步行') {
+ axios.get('https://restapi.amap.com/v3/direction/walking', {
+ params: {
+ origin: `${Number(this.startingPoint[0]).toFixed(6)},${Number(this.startingPoint[1]).toFixed(6)}`,
+ destination: `${Number(this.terminus[0]).toFixed(6)},${Number(this.terminus[1]).toFixed(6)}`,
+ key: '4b3e1db3211054ce5b466407cbb9d221',
+ output: 'json'
+ }
+ }).then(res => {
+ res.data.route.paths[0].steps.forEach(item => {
+ item.polyline += ';'
+ routes += item.polyline
+ })
+
+ routes = routes.substr(0, routes.length - 1)
+
+ const polyline = new this.DC.Polyline(routes)
+ polyline.setStyle({
+ width: 3,
+ material: new this.DC.PolylineTrailMaterialProperty({
+ color: this.DC.Color.RED,
+ speed: 10
+ }),
+ clampToGround: true
+ })
+ this.routeLayer.addOverlay(polyline)
+ this.viewer.flyTo(this.routeLayer)
+ })
+ } else {
+ axios.get('https://restapi.amap.com/v3/direction/driving', {
+ params: {
+ origin: `${Number(this.startingPoint[0]).toFixed(6)},${Number(this.startingPoint[1]).toFixed(6)}`,
+ destination: `${Number(this.terminus[0]).toFixed(6)},${Number(this.terminus[1]).toFixed(6)}`,
+ key: '4b3e1db3211054ce5b466407cbb9d221',
+ strategy: 2,
+ extensions: 'all',
+ output: 'json'
+ }
+ }).then(res => {
+ res.data.route.paths[0].steps.forEach(item => {
+ item.polyline += ';'
+ routes += item.polyline
+ })
+
+ routes = routes.substr(0, routes.length - 1)
+
+ const polyline = new this.DC.Polyline(routes)
+ polyline.setStyle({
+ width: 3,
+ material: new this.DC.PolylineTrailMaterialProperty({
+ color: this.DC.Color.RED,
+ speed: 10
+ }),
+ clampToGround: true
+ })
+ this.routeLayer.addOverlay(polyline)
+ this.viewer.flyTo(this.routeLayer)
+ })
+ }
+ },
+ clearLayer () {
+ if (this.routeLayer != null) {
+ this.routeLayer.clear()
+ }
}
}
}
--
Gitblit v1.9.3