<template>
|
<div class="box">
|
<div class="Menu">
|
<button @click="showChangeViewer1(-0.001)">-0.01</button> <input type="text" v-model="lon"> <button
|
@click="showChangeViewer1(0.001)">+0.001</button>
|
<button @click="showChangeViewer2(-0.001)">-0.01</button> <input type="text" v-model="lat"><button
|
@click="showChangeViewer2(0.001)">+0.001</button>
|
<button @click="showChangeViewer6(-1)">-1</button><input type="text" v-model="height"><button
|
@click="showChangeViewer6(1)">+1</button>
|
<button @click="showChangeViewer3(-1)">-0.01</button><input type="text" v-model="heading"><button
|
@click="showChangeViewer3(1)">+0.001</button>
|
<button @click="showChangeViewer4(-1)">-0.01</button> <input type="text" v-model="pitch"><button
|
@click="showChangeViewer4(1)">+0.001</button>
|
<button @click="showChangeViewer5(-1)">-0.01</button> <input type="text" v-model="roll"><button
|
@click="showChangeViewer5(1)">+0.001</button>
|
<button style="width: 100px; height:100px" @click="showChangeViewer">go</button>
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
|
export default {
|
|
components: {},
|
data() {
|
return {
|
lon: 120.480221,
|
lat: 41.587616,
|
height: 1100,
|
heading:0,
|
pitch: -45,
|
roll:0,
|
}
|
},
|
methods: {
|
//调试专用
|
showChangeViewer6(res) {
|
this.height += res
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
showChangeViewer1(res) {
|
this.lon += res
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
showChangeViewer2(res) {
|
this.lat += res
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
showChangeViewer3(res) {
|
this.heading += res
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
showChangeViewer4(res) {
|
this.pitch += res
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
showChangeViewer5(res) {
|
this.roll += res
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
showChangeViewer(res) {
|
|
Viewer.camera.setView({ //跳转视角
|
destination: new Cesium.Cartesian3.fromDegrees(
|
this.lon,
|
this.lat,
|
this.height
|
),
|
orientation: {
|
heading: Cesium.Math.toRadians(this.heading),
|
pitch: Cesium.Math.toRadians(this.pitch),
|
roll: this.roll
|
}
|
|
})
|
},
|
}
|
}
|
</script>
|
|
<style lang="less" scoped="scoped">
|
.box {
|
width: 100%;
|
height: 100%;
|
|
|
.Menu {
|
width: 100%;
|
height: 100%;
|
border: 1px solid skyblue;
|
position: absolute;
|
font-size: 60px;
|
font-weight: 600;
|
|
button {
|
width: 200px;
|
height: 100px;
|
}
|
|
input {
|
width: 300px;
|
height: 100px;
|
|
}
|
}
|
|
|
}
|
</style>
|