|
@@ -5,7 +5,7 @@
|
|
<div class="map-tit" v-show="mapshow">
|
|
<div class="map-tit" v-show="mapshow">
|
|
<div class="top-tit">
|
|
<div class="top-tit">
|
|
<i class="iconfont sj-icon-jkzx"></i>
|
|
<i class="iconfont sj-icon-jkzx"></i>
|
|
- <span><img src="../assets/images/close.svg" /></span>
|
|
|
|
|
|
+ <span><img src="../assets/images/close.svg" @click="mapshow=false"/></span>
|
|
</div>
|
|
</div>
|
|
<div class="map-txt" v-html="bindPopupHtml">
|
|
<div class="map-txt" v-html="bindPopupHtml">
|
|
</div>
|
|
</div>
|
|
@@ -87,49 +87,49 @@ export default {
|
|
this.connectBoxEntityTwo = null
|
|
this.connectBoxEntityTwo = null
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- /**
|
|
|
|
- * 地图落点-覆盖范围
|
|
|
|
- */
|
|
|
|
- setMarkersRadius(makerList) {
|
|
|
|
- let that = this
|
|
|
|
- that.handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas)
|
|
|
|
- clearInterval(that.aac)
|
|
|
|
- for (let i in makerList) {
|
|
|
|
- let longitude = makerList[i].lng;
|
|
|
|
- let latitude = makerList[i].lat;
|
|
|
|
- let marker = that.viewer.entities.add({
|
|
|
|
- name:"",
|
|
|
|
- position: Cesium.Cartesian3.fromDegrees(longitude, latitude),
|
|
|
|
- billboard: {
|
|
|
|
- image: iconList[makerList[i].icon],
|
|
|
|
- width: 48,
|
|
|
|
- height: 48,
|
|
|
|
- heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
|
|
- disableDepthTestDistance:Number.POSITIVE_INFINITY
|
|
|
|
- },
|
|
|
|
- description: makerList[i].bindPopupHtml,
|
|
|
|
- click: makerList[i].click,
|
|
|
|
- parameter: makerList[i].parameter
|
|
|
|
- })
|
|
|
|
- that.markerboxEntityRadius.push(marker)
|
|
|
|
- //绘制摄像头的圈(覆盖范围)
|
|
|
|
- that.viewer.entities.add({
|
|
|
|
- position: Cesium.Cartesian3.fromDegrees(makerList[i].lng,makerList[i].lat,2),
|
|
|
|
- ellipse: {
|
|
|
|
- semiMinorAxis: makerList[i].radius,
|
|
|
|
- semiMajorAxis: makerList[i].radius,
|
|
|
|
- height: 0.0,
|
|
|
|
- material: Cesium.Color.DODGERBLUE.withAlpha(0.4),
|
|
|
|
- outline: true,
|
|
|
|
- outlineColor: Cesium.Color.DEEPSKYBLUE.withAlpha(1),
|
|
|
|
- outlineWidth: 1,
|
|
|
|
- },
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- that.viewer.scene.globe.depthTestAgainstTerrain = false
|
|
|
|
- that.createLeftClickDescription()
|
|
|
|
- that.createRightClickDescription()
|
|
|
|
- },
|
|
|
|
|
|
+ /**
|
|
|
|
+ * 地图落点-覆盖范围
|
|
|
|
+ */
|
|
|
|
+ setMarkersRadius(makerList) {
|
|
|
|
+ let that = this
|
|
|
|
+ that.handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas)
|
|
|
|
+ for (let i in makerList) {
|
|
|
|
+ let longitude = makerList[i].lng;
|
|
|
|
+ let latitude = makerList[i].lat;
|
|
|
|
+ let marker = that.viewer.entities.add({
|
|
|
|
+ name: "",
|
|
|
|
+ position: Cesium.Cartesian3.fromDegrees(longitude, latitude),
|
|
|
|
+ billboard: {
|
|
|
|
+ image: iconList[makerList[i].icon],
|
|
|
|
+ width: 48,
|
|
|
|
+ height: 48,
|
|
|
|
+ heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
|
|
+ disableDepthTestDistance: Number.POSITIVE_INFINITY
|
|
|
|
+ },
|
|
|
|
+ description: makerList[i].bindPopupHtml,
|
|
|
|
+ click: makerList[i].click,
|
|
|
|
+ parameter: makerList[i].parameter
|
|
|
|
+ })
|
|
|
|
+ that.markerboxEntityRadius.push(marker)
|
|
|
|
+ //绘制摄像头的圈(覆盖范围)
|
|
|
|
+ let markerRadius = that.viewer.entities.add({
|
|
|
|
+ position: Cesium.Cartesian3.fromDegrees(makerList[i].lng, makerList[i].lat, 2),
|
|
|
|
+ ellipse: {
|
|
|
|
+ semiMinorAxis: makerList[i].radius,
|
|
|
|
+ semiMajorAxis: makerList[i].radius,
|
|
|
|
+ height: 0.0,
|
|
|
|
+ material: Cesium.Color.DODGERBLUE.withAlpha(0.4),
|
|
|
|
+ outline: true,
|
|
|
|
+ outlineColor: Cesium.Color.DEEPSKYBLUE.withAlpha(1),
|
|
|
|
+ outlineWidth: 1,
|
|
|
|
+ },
|
|
|
|
+ });
|
|
|
|
+ that.markerboxEntityRadius.push(markerRadius)
|
|
|
|
+ }
|
|
|
|
+ that.viewer.scene.globe.depthTestAgainstTerrain = false
|
|
|
|
+ that.createLeftClickDescription()
|
|
|
|
+ that.createRightClickDescription()
|
|
|
|
+ },
|
|
/**
|
|
/**
|
|
* 地图画线(贴地)
|
|
* 地图画线(贴地)
|
|
*/
|
|
*/
|
|
@@ -384,57 +384,7 @@ export default {
|
|
}
|
|
}
|
|
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
|
|
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
|
|
},
|
|
},
|
|
- /**
|
|
|
|
- * 地图落点(传感器)
|
|
|
|
- */
|
|
|
|
- setMarkers_cgq(makerList){
|
|
|
|
- let that = this;
|
|
|
|
- that.handler = new Cesium.ScreenSpaceEventHandler(this.scene.canvas);
|
|
|
|
-
|
|
|
|
- for (let i in makerList) {
|
|
|
|
- let longitude = makerList[i].lng;
|
|
|
|
- let latitude = makerList[i].lat;
|
|
|
|
- that.viewer.entities.add({
|
|
|
|
- name:"",
|
|
|
|
- position: Cesium.Cartesian3.fromDegrees(longitude, latitude),
|
|
|
|
- billboard: {
|
|
|
|
- image: iconList[makerList[i].icon],
|
|
|
|
- width: 48,
|
|
|
|
- height: 48,
|
|
|
|
- heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
|
|
- disableDepthTestDistance:Number.POSITIVE_INFINITY
|
|
|
|
- },
|
|
|
|
- description: makerList[i].bindPopupHtml,
|
|
|
|
- click: makerList[i].click,
|
|
|
|
- parameter: makerList[i].parameter,
|
|
|
|
- });
|
|
|
|
- }
|
|
|
|
- that.viewer.scene.globe.depthTestAgainstTerrain=false;
|
|
|
|
- that.createLeftClickDescription_cgq();
|
|
|
|
- },
|
|
|
|
- /**
|
|
|
|
- *鼠标左击事件是原来的气泡(传感器)
|
|
|
|
- */
|
|
|
|
- createLeftClickDescription_cgq() {
|
|
|
|
- let that = this;
|
|
|
|
- clearInterval(that.aac);
|
|
|
|
- that.handler.setInputAction(function (movement) {
|
|
|
|
- that.aac = setInterval(function (){
|
|
|
|
- let color = "green";
|
|
|
|
- let value = Math.random();
|
|
|
|
- let up = "▲";
|
|
|
|
- let down = "▼";
|
|
|
|
- if(value>0.5){
|
|
|
|
- color = "red";
|
|
|
|
- value = value +""+ up;
|
|
|
|
- }else{
|
|
|
|
- value = value +""+ down;
|
|
|
|
- }
|
|
|
|
- let html = "<span style='color:"+color+"'>当前传感器数值:"+value+"</span>";
|
|
|
|
- window.parent.frames[0].document.querySelector(".cesium-infoBox-description").innerHTML = html;
|
|
|
|
- },1000);
|
|
|
|
- }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
|
|
|
- },
|
|
|
|
|
|
+
|
|
/**
|
|
/**
|
|
* 落点定位
|
|
* 落点定位
|
|
*/
|
|
*/
|