|
@@ -24,8 +24,7 @@
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label>150kpa</label>
|
|
<label>150kpa</label>
|
|
<label>80m³/h</label>
|
|
<label>80m³/h</label>
|
|
- <button @click="flyto(1)"
|
|
|
|
- style="background-color: rgb(40,170,230);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500;margin-top:-4rem ">正常</button>
|
|
|
|
|
|
+ <button @click="flyto(1)" class="bluebutton">正常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou3">
|
|
<div class="chushuikou3">
|
|
@@ -34,8 +33,7 @@
|
|
<label style="color:'#ecec66';">10A</label>
|
|
<label style="color:'#ecec66';">10A</label>
|
|
<label>100kpa</label>
|
|
<label>100kpa</label>
|
|
<label>10m³/h</label>
|
|
<label>10m³/h</label>
|
|
- <button @click="flyto(2)"
|
|
|
|
- style="background-color: rgb(238,80,80);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500; margin-top:-4rem">异常</button>
|
|
|
|
|
|
+ <button @click="flyto(2)" class="redbutton">异常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou4">
|
|
<div class="chushuikou4">
|
|
@@ -44,8 +42,7 @@
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label>150kpa</label>
|
|
<label>150kpa</label>
|
|
<label>80m³/h</label>
|
|
<label>80m³/h</label>
|
|
- <button @click="flyto(3)"
|
|
|
|
- style="background-color: rgb(40,170,230);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500; margin-top:-4rem">正常</button>
|
|
|
|
|
|
+ <button @click="flyto(3)" class="bluebutton">正常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou5">
|
|
<div class="chushuikou5">
|
|
@@ -54,8 +51,7 @@
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label>150kpa</label>
|
|
<label>150kpa</label>
|
|
<label>80m³/h</label>
|
|
<label>80m³/h</label>
|
|
- <button @click="flyto(4)"
|
|
|
|
- style="background-color: rgb(40,170,230);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500; margin-top:-4rem">正常</button>
|
|
|
|
|
|
+ <button @click="flyto(4)" class="bluebutton">正常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou4">
|
|
<div class="chushuikou4">
|
|
@@ -64,8 +60,7 @@
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label>150kpa</label>
|
|
<label>150kpa</label>
|
|
<label>80m³/h</label>
|
|
<label>80m³/h</label>
|
|
- <button @click="flyto(5)"
|
|
|
|
- style="background-color: rgb(40,170,230);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500; margin-top:-4rem">正常</button>
|
|
|
|
|
|
+ <button @click="flyto(5)" class="bluebutton">正常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou5">
|
|
<div class="chushuikou5">
|
|
@@ -74,8 +69,7 @@
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label>150kpa</label>
|
|
<label>150kpa</label>
|
|
<label>80m³/h</label>
|
|
<label>80m³/h</label>
|
|
- <button @click="flyto(6)"
|
|
|
|
- style="background-color: rgb(40,170,230);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500;margin-top:-4rem ">正常</button>
|
|
|
|
|
|
+ <button @click="flyto(6)" class="bluebutton">正常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou4">
|
|
<div class="chushuikou4">
|
|
@@ -84,8 +78,7 @@
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label style="color:'#ecec66';">200A</label>
|
|
<label>150kpa</label>
|
|
<label>150kpa</label>
|
|
<label>80m³/h</label>
|
|
<label>80m³/h</label>
|
|
- <button @click="flyto(7)"
|
|
|
|
- style="background-color: rgb(40,170,230);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500;margin-top:-4rem ">正常</button>
|
|
|
|
|
|
+ <button @click="flyto(7)" class="bluebutton">正常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="chushuikou5">
|
|
<div class="chushuikou5">
|
|
@@ -94,8 +87,7 @@
|
|
<label style="color:'#ecec66';">20A</label>
|
|
<label style="color:'#ecec66';">20A</label>
|
|
<label>10kpa</label>
|
|
<label>10kpa</label>
|
|
<label>10m³/h</label>
|
|
<label>10m³/h</label>
|
|
- <button @click="flyto(8)"
|
|
|
|
- style="background-color: rgb(238,80,80);width: 50rem;height: 20rem;color: #fff;font-size: 14rem;border: 0;font-weight:500;margin-top:-4rem ">异常</button>
|
|
|
|
|
|
+ <button @click="flyto(8)" class="redbutton">异常</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -105,72 +97,66 @@
|
|
<script>
|
|
<script>
|
|
let jt3d = undefined;
|
|
let jt3d = undefined;
|
|
import map_xzqh_zj from '@/assets/dataFile/map_xzqh_zj.json';
|
|
import map_xzqh_zj from '@/assets/dataFile/map_xzqh_zj.json';
|
|
|
|
+ import {
|
|
|
|
+ Store
|
|
|
|
+ } from '@/store/index'
|
|
|
|
+ let store = Store();
|
|
export default {
|
|
export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- // viewersName: '', //视角标签名称
|
|
|
|
- // ImgurlList: [], //截图地址列表
|
|
|
|
- entity: '',
|
|
|
|
|
|
+ entity1: '',
|
|
}
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
flyto(num) {
|
|
flyto(num) {
|
|
- return
|
|
|
|
- let terrainProvider = jt3d._viewer.terrainProvider;
|
|
|
|
- //异步函数
|
|
|
|
- let lon = 116.30
|
|
|
|
- let lat = 36.88
|
|
|
|
- let that = this
|
|
|
|
- if (that.entity) {
|
|
|
|
- jt3d._viewer.entities.remove(that.entity)
|
|
|
|
- }
|
|
|
|
- // if that.entity && jt3d._viewer.entities.remove(that.entity)
|
|
|
|
- // console.log('高度', updatedPositions)
|
|
|
|
- let height = 1000
|
|
|
|
|
|
+ store.isflyto = true
|
|
|
|
+ console.log(store.isflyto)
|
|
|
|
+ // let terrainProvider = jt3d._viewer.terrainProvider;
|
|
|
|
+ // //异步函数
|
|
|
|
+ // let lon = 116.30
|
|
|
|
+ // let lat = 36.88
|
|
|
|
+ // let that = this
|
|
|
|
+ // if (that.entity1) {
|
|
|
|
+ // jt3d._viewer.entities.remove(that.entity1)
|
|
|
|
+ // }
|
|
|
|
+ // // if that.entity && jt3d._viewer.entities.remove(that.entity)
|
|
|
|
+ // // console.log('高度', updatedPositions)
|
|
|
|
+ // let height = 1000
|
|
|
|
+
|
|
|
|
+ // that.entity1 = new Cesium.Entity({
|
|
|
|
+ // name: "add billboard",
|
|
|
|
+ // //位置
|
|
|
|
+ // position: Cesium.Cartesian3.fromDegrees(120.623, 36.9157, 100),
|
|
|
|
+ // //图片标签
|
|
|
|
+ // billboard: {
|
|
|
|
+ // image: 'jt3dSDK/imgs/point/point.png',
|
|
|
|
+ // horizontalOrigin: Cesium.HorizontalOrigin.CENTER, //水平
|
|
|
|
+ // verticalOrigin: Cesium.VerticalOrigin.BOTTOM, //垂直位置
|
|
|
|
+ // // scale: billboard.scale, //尺寸
|
|
|
|
+ // // pixelOffset: new Cesium.Cartesian2(0, billboard.pixelOffset),
|
|
|
|
+ // disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
|
|
+ // scale: 1,
|
|
|
|
+ // // scaleByDistance: new Cesium.NearFarScalar(1.5e2, 1, 2400,
|
|
|
|
+ // // 0
|
|
|
|
+ // // ) //按距离缩放,即距离大于180米时,图标不显示 Cesium.NearFarScalar(near, nearValue, far, farValue)相机范围的下界。相机范围下界的值。相机范围的上限。该值位于摄像机范围的上界。
|
|
|
|
+ // }
|
|
|
|
+ // });
|
|
|
|
+ // // var entity = jt3d._viewer.entities.add(that.entity1, {
|
|
|
|
+ // // // range: 1000
|
|
|
|
+ // // });
|
|
|
|
+ // // jt3d.LocateUtil.flyToEntity(that.entity)
|
|
|
|
+ // let flytopromise = jt3d._viewer.flyTo(that.entity1, {
|
|
|
|
+ // duration: 5.0,
|
|
|
|
+ // maximumHeight: 1500
|
|
|
|
+ // })
|
|
|
|
+ // flytopromise.then(res => {
|
|
|
|
+ // console.log('定位结束' + res)
|
|
|
|
+ // })
|
|
|
|
+ // jt3d._viewer.camera.flyTo({
|
|
|
|
+ // destination: Cesium.Cartesian3.fromDegrees(120.623, 36.9157, 1500)
|
|
|
|
+ // });
|
|
|
|
+
|
|
|
|
|
|
- that.entity1 = new Cesium.Entity({
|
|
|
|
- name: "add billboard",
|
|
|
|
- //位置
|
|
|
|
- position: Cesium.Cartesian3.fromDegrees(120.623, 36.9157, 100),
|
|
|
|
- //图片标签
|
|
|
|
- billboard: {
|
|
|
|
- image: 'jt3dSDK/imgs/point/point.png',
|
|
|
|
- horizontalOrigin: Cesium.HorizontalOrigin.CENTER, //水平
|
|
|
|
- verticalOrigin: Cesium.VerticalOrigin.BOTTOM, //垂直位置
|
|
|
|
- // scale: billboard.scale, //尺寸
|
|
|
|
- // pixelOffset: new Cesium.Cartesian2(0, billboard.pixelOffset),
|
|
|
|
- disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
|
|
- scale: 1,
|
|
|
|
- // scaleByDistance: new Cesium.NearFarScalar(1.5e2, 1, 2400,
|
|
|
|
- // 0
|
|
|
|
- // ) //按距离缩放,即距离大于180米时,图标不显示 Cesium.NearFarScalar(near, nearValue, far, farValue)相机范围的下界。相机范围下界的值。相机范围的上限。该值位于摄像机范围的上界。
|
|
|
|
- }
|
|
|
|
- // point:{
|
|
|
|
- // pixelSize:20,
|
|
|
|
- // color:Cesium.Color.RED,
|
|
|
|
- // }
|
|
|
|
- });
|
|
|
|
- var entity = jt3d._viewer.entities.add(that.entity1, {
|
|
|
|
- // range: 1000
|
|
|
|
- });
|
|
|
|
- jt3d.LocateUtil.flyToEntity(that.entity)
|
|
|
|
- setTimeout(res=>{
|
|
|
|
- console.log('定位')
|
|
|
|
- console.log('实体', entity)
|
|
|
|
- jt3d.LocateUtil.flyToEntity(that.entity)
|
|
|
|
- jt3d._viewer.flyTo(entity,{
|
|
|
|
- duration:5.0,
|
|
|
|
- maximumHeight:1500
|
|
|
|
- }).then(res=>{
|
|
|
|
- console.log('定位结束' + res)
|
|
|
|
- }).catch(err=>{
|
|
|
|
- console.log("err" + err);
|
|
|
|
- })
|
|
|
|
- // jt3d._viewer.camera.flyTo({
|
|
|
|
- // destination : Cesium.Cartesian3.fromDegrees(120.623, 36.9157, 1500)
|
|
|
|
- // });
|
|
|
|
- },2000)
|
|
|
|
-
|
|
|
|
// let lng = Number(114.22) + Number(num)
|
|
// let lng = Number(114.22) + Number(num)
|
|
// this.entity = new Cesium.Entity({
|
|
// this.entity = new Cesium.Entity({
|
|
// name: "add billboard",
|
|
// name: "add billboard",
|
|
@@ -188,7 +174,7 @@
|
|
// scaleByDistance: new Cesium.NearFarScalar(1.5e2, 1, 2400, 0) //按距离缩放,即距离大于180米时,图标不显示 Cesium.NearFarScalar(near, nearValue, far, farValue)相机范围的下界。相机范围下界的值。相机范围的上限。该值位于摄像机范围的上界。
|
|
// scaleByDistance: new Cesium.NearFarScalar(1.5e2, 1, 2400, 0) //按距离缩放,即距离大于180米时,图标不显示 Cesium.NearFarScalar(near, nearValue, far, farValue)相机范围的下界。相机范围下界的值。相机范围的上限。该值位于摄像机范围的上界。
|
|
// }
|
|
// }
|
|
// });
|
|
// });
|
|
-
|
|
|
|
|
|
+
|
|
// jt3d._viewer.entities.add(this.entity, {
|
|
// jt3d._viewer.entities.add(this.entity, {
|
|
// range: 1000
|
|
// range: 1000
|
|
// });
|
|
// });
|
|
@@ -208,6 +194,28 @@
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
|
|
+ .redbutton {
|
|
|
|
+ background-color: rgb(238, 80, 80);
|
|
|
|
+ width: 50rem;
|
|
|
|
+ height: 20rem;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-size: 14rem;
|
|
|
|
+ border: 0;
|
|
|
|
+ font-weight: 500;
|
|
|
|
+ margin-top: -4rem
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .bluebutton {
|
|
|
|
+ background-color: rgb(40, 170, 230);
|
|
|
|
+ width: 50rem;
|
|
|
|
+ height: 20rem;
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-size: 14rem;
|
|
|
|
+ border: 0;
|
|
|
|
+ font-weight: 500;
|
|
|
|
+ margin-top: -4rem
|
|
|
|
+ }
|
|
|
|
+
|
|
#main5 {
|
|
#main5 {
|
|
width: calc(100% - 20rem);
|
|
width: calc(100% - 20rem);
|
|
height: calc(100% - 20rem);
|
|
height: calc(100% - 20rem);
|