import * as DT from 'dt-sdk' import { viewer } from '@/components/dt-scene' export default class UavTarget { planLines = new DT.Cesium.AssociativeArray() uavEntity = null _options = {} loaderPicture = {} positions = [] startAltitude = 0 constructor(viewer, options) { this.viewer = viewer this._options = options this.jobId = options.jobId this.uavId = options.uavId this.jobName = options.jobName this.startAltitude = options.startAltitude this.addPlanLine(options.airlineList) this.addUav(options) this.addUavLoader(options.payloadList) } addUav(info) { let that = this let position = DT.Cesium.Cartesian3.fromDegrees(info.startLon, info.startLat, info.startHeight) if (info.trailList && info.trailList.length > 0) { info.trailList.forEach(route => { this.positions.push(DT.Cesium.Cartesian3.fromDegrees(route.lon, route.lat, route.height)) }) } else { this.positions.push(position.clone()) this.positions.push(position.clone()) } let currentPosition = this.positions[this.positions.length - 1].clone() let id = `${this.jobId}~${this.uavId}-uav` this.uavEntity = this.viewer.entities.add({ id, position: currentPosition, // label: { // text: info.uavName, // font: '14px sans-serif', // fillColor: DT.Cesium.Color.WHITE, // horizontalOrigin: DT.Cesium.HorizontalOrigin.LEFT, // verticalOrigin: DT.Cesium.VerticalOrigin.CENTER, // disableDepthTestDistance: 10000, // pixelOffset: new DT.Cesium.Cartesian2(10, 0), // showBackground: true, // scaleByDistance: new DT.Cesium.NearFarScalar(0, 1, 1, 0.8), // distanceDisplayCondition: new DT.Cesium.DistanceDisplayCondition(0, 20000), // backgroundColor: DT.Cesium.Color.fromCssColorString('rgba(0,0,0,0.7)'), // style: DT.Cesium.LabelStyle.FILL_AND_OUTLINE, // }, // model: { // uri: process.env.BASE_URL + 'model/uav.gltf', // // scale: 1, // minimumPixelSize: 32, // maximumScale: 128, // }, polyline: { positions: new DT.Cesium.CallbackProperty(function () { return that.positions }, false), width: 2, zIndex: 6, material: DT.Cesium.Color.CYAN, depthFailMaterial: DT.Cesium.Color.CYAN, arcType: DT.Cesium.ArcType.NONE } }) } updateCurrentPosition(position) { this.uavEntity.position = position.clone() this.positions.push(position.clone()) } addUavLoader(data) { let loaderPicture = {} data.forEach(loader => { loaderPicture[loader.payloadId] = [] let key = 'imageList' if (loader.imageHighList && loader.imageHighList.length > 0) { key = 'imageHighList' } if (loader[key] && loader[key].length > 0) { console.log('这是哈222', loader.imageList) loader[key].forEach((image, imageIndex) => { let obj = { picture: null, fileId: image.fileId, markArr: [] } // let cby_bg_data=[ // image.left1Lon, image.left1Lat, // image.left2Lon, image.left2Lat, // image.right2Lon, image.right2Lat, // image.right1Lon, image.right1Lat, // ] // obj.picture = this.viewer.entities.add({ // id: `${this.jobId}~${this.uavId}~${loader.payloadId}~${image.fileId}-picture`, // name: '背景', // polygon: { // // hierarchy: DT.Cesium.Cartesian3.fromDegreesArrayHeights(cby_bg_data), // hierarchy: DT.Cesium.Cartesian3.fromDegreesArray(cby_bg_data), // perPositionHeight: true, // material: new DT.Cesium.ImageMaterialProperty({ // image: window.config.imagePath + image.relativePath, // // image: process.env.BASE_URL + 'static/img/ttt.tif', // // image: process.env.BASE_URL + 'static/img/pic.png', // }),//new Cesium.Color(0.29, 0.85, 0.89, 0.5), //Cesium.Color.PALETURQUOISE.withAlpha(0.5), // outline: true, // outlineColor: DT.Cesium.Color.WHITE, // outlineWidth: 2, //很多电脑当宽度>1时,没用 // } // }) let minLon = Math.min(image.left1Lon, image.left2Lon, image.right1Lon, image.right2Lon) let maxLon = Math.max(image.left1Lon, image.left2Lon, image.right1Lon, image.right2Lon) let minLat = Math.min(image.left1Lat, image.left2Lat, image.right1Lat, image.right2Lat) let maxLat = Math.max(image.left1Lat, image.left2Lat, image.right1Lat, image.right2Lat) if (maxLat - minLat > 0 && maxLon - minLon > 0) { let rectangle = DT.Cesium.Rectangle.fromDegrees(minLon, minLat, maxLon, maxLat) let layer = new DT.Cesium.SingleTileImageryProvider({ url: window.config.imagePath + image.relativePath, rectangle }) let addLayer = this.viewer.cesiumViewer.imageryLayers.addImageryProvider(layer) // 设置分屏显示 addLayer.splitDirection = DT.Cesium.ImagerySplitDirection.LEFT obj.picture = addLayer if (image.itemList) { image.itemList.forEach( (mark, markIndex) => { let markId = `${this.jobId}~${this.uavId}~${loader.payloadId}~${image.fileId}~${mark.id}-mark${imageIndex}${markIndex}` let markPosition = DT.Cesium.Cartesian3.fromDegrees(mark.left1Lon, mark.left1Lat, 1) let markArr = [ mark.left1Lon, mark.left1Lat, 1, mark.left2Lon, mark.left2Lat, 1, mark.right2Lon, mark.right2Lat, 1, mark.right1Lon, mark.right1Lat, 1, mark.left1Lon, mark.left1Lat, 1, ] let markLine = this.viewer.entities.add({ id: markId, show: true, position: markPosition, label: { text: window.detectType[mark.type], font: '16px sans-serif', fillColor: DT.Cesium.Color.RED, horizontalOrigin: DT.Cesium.HorizontalOrigin.LEFT, verticalOrigin: DT.Cesium.VerticalOrigin.BOTTOM, disableDepthTestDistance: 10000, showBackground: false, backgroundColor: DT.Cesium.Color.BLACK, style: DT.Cesium.LabelStyle.FILL_AND_OUTLINE, }, polyline: { positions: DT.Cesium.Cartesian3.fromDegreesArrayHeights(markArr), // positions: DT.Cesium.Cartesian3.fromDegreesArray(markArr), width: 1, material: DT.Cesium.Color.RED, depthFailMaterial: DT.Cesium.Color.RED, zIndex: 3, } }) obj.markArr.push(markLine) }) } loaderPicture[loader.payloadId].push(obj) } }) } }) this.loaderPicture = loaderPicture } appendLoaderPicture(image) { // this.removePicture() // this.removePictureItem(image.payloadId, image.airlineId) if (!this.loaderPicture) { this.loaderPicture = {} } if (!this.loaderPicture[image.payloadId]) { this.loaderPicture[image.payloadId] = [] } let obj = { picture: null, fileId: image.fileId, airlineId: image.airlineId, markArr: [] } let length = this.loaderPicture[image.payloadId].length // obj.picture = this.viewer.entities.add({ // id: `${this.jobId}~${this.uavId}~${image.payloadId}~${image.fileId}-picture`, // name: '背景', // polygon: { // // hierarchy: DT.Cesium.Cartesian3.fromDegreesArrayHeights(cby_bg_data), // hierarchy: DT.Cesium.Cartesian3.fromDegreesArray(cby_bg_data), // perPositionHeight: true, // material: new DT.Cesium.ImageMaterialProperty({ // image: window.config.imagePath + image.relativePath, // // image: process.env.BASE_URL + 'static/img/ttt.tif', // // image: process.env.BASE_URL + 'static/img/pic.png', // }),//new Cesium.Color(0.29, 0.85, 0.89, 0.5), //Cesium.Color.PALETURQUOISE.withAlpha(0.5), // outline: true, // outlineColor: DT.Cesium.Color.WHITE, // outlineWidth: 2, //很多电脑当宽度>1时,没用 // } // }) let minLon = Math.min(image.left1Lon, image.left2Lon, image.right1Lon, image.right2Lon) let maxLon = Math.max(image.left1Lon, image.left2Lon, image.right1Lon, image.right2Lon) let minLat = Math.min(image.left1Lat, image.left2Lat, image.right1Lat, image.right2Lat) let maxLat = Math.max(image.left1Lat, image.left2Lat, image.right1Lat, image.right2Lat) if (maxLat - minLat > 0 && maxLon - minLon > 0) { let rectangle = DT.Cesium.Rectangle.fromDegrees(minLon, minLat, maxLon, maxLat) let layer = new DT.Cesium.SingleTileImageryProvider({ url: window.config.imagePath + image.relativePath, rectangle }) // console.log('添加的图片', obj.picture) if (image.itemList) { image.itemList.forEach( (mark, markIndex) => { let markId = `${this.jobId}~${this.uavId}~${image.payloadId}~${image.fileId}~${mark.id}-mark${length}${markIndex}` let markPosition = DT.Cesium.Cartesian3.fromDegrees(mark.left1Lon, mark.left1Lat, 1) let markArr = [ mark.left1Lon, mark.left1Lat, 1, mark.left2Lon, mark.left2Lat, 1, mark.right2Lon, mark.right2Lat, 1, mark.right1Lon, mark.right1Lat, 1, mark.left1Lon, mark.left1Lat, 1, ] let markLine = this.viewer.entities.add({ id: markId, show: true, position: markPosition, label: { text: window.detectType[mark.type], font: '16px sans-serif', fillColor: DT.Cesium.Color.RED, horizontalOrigin: DT.Cesium.HorizontalOrigin.LEFT, verticalOrigin: DT.Cesium.VerticalOrigin.BOTTOM, disableDepthTestDistance: 10000, showBackground: false, backgroundColor: DT.Cesium.Color.BLACK, style: DT.Cesium.LabelStyle.FILL_AND_OUTLINE, scaleByDistance: new DT.Cesium.NearFarScalar(0, 1, 1, 0.8), distanceDisplayCondition: new DT.Cesium.DistanceDisplayCondition(0, 10000), }, polyline: { positions: DT.Cesium.Cartesian3.fromDegreesArrayHeights(markArr), // positions: DT.Cesium.Cartesian3.fromDegreesArray(markArr), width: 1, material: DT.Cesium.Color.RED, depthFailMaterial: DT.Cesium.Color.RED, zIndex: 3, } }) obj.markArr.push(markLine) }) } console.log('删除旧的') layer.readyPromise.then(res => { console.log('回调执行') let addLayer = this.viewer.cesiumViewer.imageryLayers.addImageryProvider(layer) // 设置分屏显示 addLayer.splitDirection = DT.Cesium.ImagerySplitDirection.LEFT obj.picture = addLayer setTimeout(() => { this.removePictureItem(image.payloadId, image.airlineId) this.loaderPicture[image.payloadId].push(obj) }, 500) }) // this.removePictureItem(image.payloadId, image.airlineId) // this.loaderPicture[image.payloadId].push(obj) console.log('push新的') } } toggleAllLoaderVisible(visible) { for (let key in this.loaderPicture) { this.loaderPicture[key].forEach(item => { item.picture.show = visible item.markArr.forEach(item => { item.show = visible }) }) } } toggleLoaderPictureVisible(payloadId,fileId) { console.log('切换显隐', payloadId, fileId) if (this.loaderPicture[payloadId]) { let find = this.loaderPicture[payloadId].find(item => item.fileId + '' === fileId + '') console.log('找到图片了吗', find) if (find) { let status = !find.picture.show console.log('显示状态', status) find.picture.show = status find.markArr.forEach(mark => { mark.show = status }) } } } toggleLoaderPictureActive(payloadId,fileId, active, visible = true) { if (this.loaderPicture[payloadId]) { let find = this.loaderPicture[payloadId].find(item => item.fileId + '' === fileId + '') if (find) { if (active) { find.picture.polygon.outlineColor = DT.Cesium.Color.RED find.picture.show = true find.markArr.forEach(mark => { mark.show = true }) } else { find.picture.polygon.outlineColor = DT.Cesium.Color.WHITE find.picture.show = visible find.markArr.forEach(mark => { mark.show = visible }) } } } } addPlanLine(data) { if (data.length > 0) { data.forEach((item, index) => { let height = Math.max(item.endHeight - 1, 1) item.positions = [item.startLon, item.startLat, item.startHeight + this.startAltitude, item.endLon, item.endLat, item.endHeight + this.startAltitude] let positions = DT.Cesium.Cartesian3.fromDegreesArrayHeights(item.positions) let id = `${this.jobId}~${this.uavId}~${item.id}-planLine-${index}` let line = this.viewer.entities.add({ id, position: positions[0], label: { text: `规划航线${index + 1}起点`, disableDepthTestDistance: 10000, font: '14px sans-serif', fillColor: DT.Cesium.Color.RED, horizontalOrigin: DT.Cesium.HorizontalOrigin.LEFT, pixelOffset: new DT.Cesium.Cartesian2(10, -15), showBackground: true, scaleByDistance: new DT.Cesium.NearFarScalar(0, 1, 1, 0.8), distanceDisplayCondition: new DT.Cesium.DistanceDisplayCondition(0, 10000), backgroundColor: DT.Cesium.Color.fromCssColorString('rgba(255,255,255,0.6)') }, polyline: { show: true, positions, width: 2, zIndex: 0, material: DT.Cesium.Color.RED, depthFailMaterial: DT.Cesium.Color.RED, arcType: DT.Cesium.ArcType.NONE } }) this.planLines.set(id, line) }) } } removePicture() { for (let key in this.loaderPicture) { this.loaderPicture[key].forEach((item, index) => { if (item.picture) { // this.viewer.entities.remove(item.picture) this.viewer.cesiumViewer.imageryLayers.remove(item.picture) } item.markArr.forEach(mark => { this.viewer.entities.remove(mark) }) }) } this.loaderPicture = {} } removePictureItem(payloadId, airlineId) { if (this.loaderPicture && this.loaderPicture[payloadId]) { let findIndex = -1 this.loaderPicture[payloadId].forEach((item, index) => { if (item.airlineId === airlineId) { if (item.picture) { this.viewer.cesiumViewer.imageryLayers.remove(item.picture) item.markArr.forEach(mark => { this.viewer.entities.remove(mark) }) } findIndex = index } }) if (findIndex > -1) { this.loaderPicture[payloadId].splice(findIndex, 1) } } } removeAll() { if (this.uavEntity) { this.viewer.entities.remove(this.uavEntity) this.uavEntity = null } for (let key in this.loaderPicture) { this.loaderPicture[key].forEach((item, index) => { if (item.picture) { // this.viewer.entities.remove(item.picture) this.viewer.cesiumViewer.imageryLayers.remove(item.picture) } item.markArr.forEach(mark => { this.viewer.entities.remove(mark) }) }) } this.loaderPicture = null this.planLines.values.forEach(item => { this.viewer.entities.remove(item) }) this.planLines.removeAll() } destroy() { this.removeAll() } }