diff --git a/src/Global/Contour/index.js b/src/Global/Contour/index.js index 66bbd61..4bb7c89 100644 --- a/src/Global/Contour/index.js +++ b/src/Global/Contour/index.js @@ -15,7 +15,7 @@ let activeHeightElm = null; let tools let _sdk let secondaryLinesCount = 19 -let show = false +let show = true let equalHeightDistance = 10 let activeColor = '#ffd000' let indexContourShow = true @@ -86,20 +86,21 @@ async function dialog(sdk) { tools = new Tools(sdk) } - _DialogObject = await new Dialog(sdk, {}, { - title: "全局等高线", left: '180px', - top: '100px', - closeCallBack: () => { - _DialogObject = null - } - }); + // _DialogObject = await new Dialog(sdk, {}, { + // title: "全局等高线", left: '180px', + // top: '100px', + // closeCallBack: () => { + // _DialogObject = null + // } + // }); - _DialogObject._element.body.className = - _DialogObject._element.body.className + ' contour' - let contentElm = document.createElement('div') - contentElm.innerHTML = html(this) + // _DialogObject._element.body.className = + // _DialogObject._element.body.className + ' contour' + // let contentElm = document.createElement('div') + // contentElm.innerHTML = html(this) - _DialogObject.contentAppChild(contentElm) + // _DialogObject.contentAppChild(contentElm) + let contentElm = document.getElementsByClassName('contour')[0] sdk.viewer.scene.postRender.removeEventListener(accordingToCameraHeight) sdk.viewer.scene.postRender.addEventListener(accordingToCameraHeight) @@ -107,6 +108,21 @@ async function dialog(sdk) { // 显示 let showBtn = contentElm.getElementsByClassName('show')[0] showBtn.checked = show + if (showBtn.checked) { + let height = sdk.viewer.camera.positionCartographic.height + if (height > 16360) { + let cartographic = sdk.viewer.camera.positionCartographic + let options = { + position: { + lng: Cesium.Math.toDegrees(cartographic.longitude), + lat: Cesium.Math.toDegrees(cartographic.latitude), + alt: 16360, + }, + } + flyTo(sdk, options, 0.5) + } + showContour(sdk) + } showBtn.addEventListener('change', (e) => { if (e.target.checked) { show = true @@ -473,7 +489,7 @@ czm_material czm_getMaterial(czm_materialInput materialInput) // 主等高线计算 float distanceToMainContour = mod(materialInput.height, spacing); - + // 抗锯齿计算 #if (__VERSION__ == 300 || defined(GL_OES_standard_derivatives)) float dxc = abs(dFdx(materialInput.height)); @@ -493,11 +509,11 @@ czm_material czm_getMaterial(czm_materialInput materialInput) // 计算当前高度所属的等高线高度 float mainContourHeight = floor(materialInput.height / spacing) * spacing; float secondaryContourHeight = floor(materialInput.height / spacing * (secondaryLinesCount + 1.0)) * spacing / (secondaryLinesCount + 1.0); - + // 计算次线在两条主等高线之间的相对位置 float relativeHeight = materialInput.height - mainContourHeight; float normalizedPosition = relativeHeight / spacing; - + // 计算次线索引（从主等高线开始计数） float lineIndex = floor(normalizedPosition * (secondaryLinesCount + 1.0)); @@ -506,7 +522,7 @@ czm_material czm_getMaterial(czm_materialInput materialInput) float secondaryLinesWidth = supplementaryContourWidth; secondarySpacing = spacing / (secondaryLinesCount + 1.0); float distanceToSecondaryContour = mod(materialInput.height, secondarySpacing); - + // 确保次线不会与主线重叠 float minDistanceToMain = min(distanceToMainContour, spacing - distanceToMainContour); bool notCloseToMain = minDistanceToMain > dFMain * 2.0; // 2倍线宽缓冲 @@ -532,7 +548,7 @@ czm_material czm_getMaterial(czm_materialInput materialInput) - + #if (__VERSION__ == 300 || defined(GL_OES_standard_derivatives)) dFSecondary = max(dxc, dyc) * czm_pixelRatio * secondaryLinesWidth; #else diff --git a/src/Global/FlyRoam/index.js b/src/Global/FlyRoam/index.js index c1a1819..aea3f00 100644 --- a/src/Global/FlyRoam/index.js +++ b/src/Global/FlyRoam/index.js @@ -5,7 +5,7 @@ import Dialog from '../../BaseDialog'; import { html } from "./_element"; import Tools from "../../Tools"; -import { closeRotateAround, closeViewFollow} from '../../Global/global' +import { closeRotateAround, closeViewFollow } from '../../Global/global' let _DialogObject = null let clickHandler let repeat = 0 @@ -13,32 +13,33 @@ let currentRepeat = 0 const open = async (sdk, options = {}, _Dialog = {}) => { - let name = options.name || '漫游路径' + let name = options.name || '飞线漫游' options.points || (options.points = []) - if(options.repeat) { + if (options.repeat) { repeat = Number(options.repeat) } let viewer = sdk.viewer let tools = new Tools(sdk) let active = 0 - if (_DialogObject && _DialogObject.close) { - _DialogObject.close() - _DialogObject = null - } + // if (_DialogObject && _DialogObject.close) { + // _DialogObject.close() + // _DialogObject = null + // } - _DialogObject = await new Dialog(viewer._container, { - title: '飞行漫游', left: '180px', top: '100px', - closeCallBack: () => { - cease({ viewer }) - }, - }) - await _DialogObject.init() - let contentElm = document.createElement('div'); - contentElm.className = 'fly-roam' - contentElm.innerHTML = html() - _DialogObject.contentAppChild(contentElm) + // _DialogObject = await new Dialog(viewer._container, { + // title: '飞行漫游', left: '180px', top: '100px', + // closeCallBack: () => { + // cease({ viewer }) + // }, + // }) + // await _DialogObject.init() + // let contentElm = document.createElement('div'); + // contentElm.className = 'fly-roam' + // contentElm.innerHTML = html() + // _DialogObject.contentAppChild(contentElm) + let contentElm = document.getElementsByClassName('fly-roam')[0] let all_elm = contentElm.getElementsByTagName("*") // EventBinding(all_elm) @@ -84,15 +85,15 @@ const open = async (sdk, options = {}, _Dialog = {}) => { points.map((item) => { newPoints.push(item) }) - _Dialog.clickSavePath && _Dialog.clickSavePath( - { - name: name, - points: newPoints, - repeat: repeat+'' - } - ) + // _Dialog.clickSavePath && _Dialog.clickSavePath( + // { + // name: name, + // points: newPoints, + // repeat: repeat + '' + // } + // ) }) - _DialogObject.footAppChild(addListBtn) + // _DialogObject.footAppChild(addListBtn) let endBtn = contentElm.getElementsByClassName('cease')[0] endBtn.addEventListener('click', () => { @@ -135,7 +136,7 @@ const open = async (sdk, options = {}, _Dialog = {}) => { pitch: viewer.camera.pitch, roll: viewer.camera.roll } - tools.message({text: '操作成功'}) + tools.message({ text: '操作成功' }) }) let totalTimeElm = contentElm.querySelector("input[name='totalTime']") @@ -248,7 +249,7 @@ const open = async (sdk, options = {}, _Dialog = {}) => { for (let m = 0; m < trList.length; m++) { if (trList[m] === e_delete.parentNode.parentNode) { points.splice(m, 1) - points[points.length-1] && (points[points.length-1].duration = 0) + points[points.length - 1] && (points[points.length - 1].duration = 0) tableBody.removeChild(tr) if (active > m + 1) { active-- @@ -307,10 +308,20 @@ const open = async (sdk, options = {}, _Dialog = {}) => { } const close = () => { - if (_DialogObject && _DialogObject.close) { - _DialogObject.close() - _DialogObject = null + // if (_DialogObject && _DialogObject.close) { + // _DialogObject.close() + // _DialogObject = null + // } + let contentElm = document.getElementsByClassName('fly-roam')[0] + + let tableBody = contentElm.getElementsByClassName('table-body')[0]; + let trList = tableBody.getElementsByClassName('tr') + for (let i = trList.length - 1; i >= 0; i--) { + tableBody.removeChild(trList[i]) } + + repeat = 0 + currentRepeat = 0 } const executeFlyTo = (sdk, points = [], index = 0, noStart) => { @@ -387,4 +398,4 @@ const cease = (sdk) => { } } -export { open, close, flyTo, setRepeat, cease } \ No newline at end of file +export { open, close, flyTo, setRepeat, cease } diff --git a/src/Obj/Analysis/CircleViewShed/index.js b/src/Obj/Analysis/CircleViewShed/index.js index 461b29c..65d72a4 100644 --- a/src/Obj/Analysis/CircleViewShed/index.js +++ b/src/Obj/Analysis/CircleViewShed/index.js @@ -35,12 +35,12 @@ class CircleViewShed extends Tools { this.Dialog = _Dialog this._EventBinding = new EventBinding() this.html = null - let tools = new Tools(sdk) + this.tools = new Tools(sdk) YJ.Analysis.AnalysesResults.push(this) // CircleViewShed.edit(this) let terrainAvailability = this.viewer.terrainProvider.availability; if (!terrainAvailability) { - tools.message({ type: 'warning', text: '未加载地形数据！' }) + this.tools.message({ type: 'warning', text: '未加载地形数据！' }) // window.ELEMENT && window.ELEMENT.Message({ // message: '未加载地形数据！', // type: 'warning', @@ -48,6 +48,9 @@ class CircleViewShed extends Tools { // }); return } + // CircleViewShed.create(this) + } + draw() { CircleViewShed.create(this) } @@ -69,6 +72,20 @@ class CircleViewShed extends Tools { item.value = viewPointHeight }) } + get viewPointHeights() { + return this.viewPointHeight + } + + set viewPointHeights(v) { + let viewPointHeight = Math.floor(Number(v) * 10) / 10 + if (isNaN(viewPointHeight)) { + viewPointHeight = 1.8 + } + if (viewPointHeight < 0) { + viewPointHeight = 0 + } + this.viewPointHeight = viewPointHeight + } get precision() { return this.options.precision @@ -87,8 +104,25 @@ class CircleViewShed extends Tools { item.value = precision }) } + get precisions() { + return this.precision + } + + set precisions(val) { + this.precision = val + } static create(that) { + let terrainAvailability = that.viewer.terrainProvider.availability; + if (!terrainAvailability) { + that.tools.message({ type: 'warning', text: '未加载地形数据！' }) + // window.ELEMENT && window.ELEMENT.Message({ + // message: '未加载地形数据！', + // type: 'warning', + // duration: 1500 + // }); + return + } let count = 0 if (!YJ.Measure.GetMeasureStatus()) { if (that._DialogObject && that._DialogObject.close) { diff --git a/src/Obj/Analysis/Contour/index.js b/src/Obj/Analysis/Contour/index.js index 56f8dff..8cd3397 100644 --- a/src/Obj/Analysis/Contour/index.js +++ b/src/Obj/Analysis/Contour/index.js @@ -4,19 +4,15 @@ import Tools from '../../../Tools'; class ContourAnalysis { /** * @constructor 等高线分析 - * @param sdk + * @param sdk * **/ constructor(sdk, options = {}) { this.viewer = sdk.viewer + this.tools = new Tools(sdk) let terrainAvailability = this.viewer.terrainProvider.availability; if (!terrainAvailability) { this.error = '未加载地形数据！' - window.ELEMENT && window.ELEMENT.Message({ - message: '未加载地形数据！', - type: 'warning', - duration: 1500 - }); - console.warn(this.error) + this.tools.message({ type: 'warning', text: this.error }) return } this.positions = options.positions @@ -153,7 +149,7 @@ class ContourAnalysis { // }, // })) // element.label = new Cesium.LabelGraphics({ - + // }) let cur_index = that.getObjectIndex( breaks, @@ -178,7 +174,7 @@ class ContourAnalysis { } let line = turf.lineString(array); let distance = turf.length(line, { units: "kilometers" }); - let along = turf.along(line, distance/2, { units: "kilometers" }); + let along = turf.along(line, distance / 2, { units: "kilometers" }); return Cesium.Cartesian3.fromDegrees(along.geometry.coordinates[0], along.geometry.coordinates[1], 0); } } @@ -210,4 +206,4 @@ class ContourAnalysis { this.countorLineList = []; } } -export default ContourAnalysis; \ No newline at end of file +export default ContourAnalysis; diff --git a/src/Obj/Analysis/CutFill/index.js b/src/Obj/Analysis/CutFill/index.js index 64a0659..e5d9a12 100644 --- a/src/Obj/Analysis/CutFill/index.js +++ b/src/Obj/Analysis/CutFill/index.js @@ -1,12 +1,13 @@ import Dialog from '../../../BaseDialog'; import { html } from "./_element"; +import Tools from "../../../Tools"; // import CreatePolygon from "./CreatePolygon"; import DrawPolygon from "../../../Draw/drawPolygon" class CutFillAnalysis { /** * @constructor 填挖方分析 - * @param sdk + * @param sdk * **/ constructor(sdk, options = {}, _Dialog = {}) { this.sdk = sdk; @@ -26,21 +27,20 @@ class CutFillAnalysis { noArea: "", } this.entities = [] + this.tools = new Tools(this.sdk) this.Draw = new DrawPolygon(this.sdk) YJ.Analysis.AnalysesResults.push(this) - CutFillAnalysis.EditBox(this) + // CutFillAnalysis.EditBox(this) } create() { this.clean() this.Draw.start((a, positions) => { - if(!positions || positions.length<3) { + if (!positions || positions.length < 3) { let _error = '最少需要三个坐标！' - console.warn(_error) - window.ELEMENT && window.ELEMENT.Message({ - message: _error, + this.tools.message({ + text: _error, type: 'warning', - duration: 1500 }); return } @@ -52,6 +52,7 @@ class CutFillAnalysis { this.createPolygonGeo(this.positions); this.result = this.VolumeAnalysis(); this.viewer.scene.screenSpaceCameraController.enableCollisionDetection = false; //允许相机进入地下 + this.clickCallBack() }) // const $this = this; // if (!this.cp) { @@ -336,6 +337,65 @@ class CutFillAnalysis { }); } + get heights() { + return this.height + } + set heights(val) { + this.height = val + } + get precisions() { + return this.precision + } + set precisions(val) { + this.precision = val + } + get allArea() { + return Number(this.result.allArea.toFixed(4)) + } + set allArea(val) { + this.result.allArea = val + } + get fillArea() { + return Number(this.result.fillArea.toFixed(4)) + } + set fillArea(val) { + this.result.fillArea = val + } + get fillVolume() { + return Number(this.result.fillVolume.toFixed(4)) + } + set fillVolume(val) { + this.result.fillVolume = val + } + get cutArea() { + return Number(this.result.cutArea.toFixed(4)) + } + set cutArea(val) { + this.result.cutArea = val + } + get cutVolume() { + return Number(this.result.cutVolume.toFixed(4)) + } + set cutVolume(val) { + this.result.cutVolume = val + } + get noArea() { + return Number(this.result.noArea.toFixed(4)) + } + set noArea(val) { + this.result.noArea = val + } + get onEnd() { + return this.clickCallBack + } + set onEnd(val) { + if (val && typeof val !== 'function') { + console.error('val:', val, '不是一个function') + } else { + this.clickCallBack = val + } + } + clean() { this.Draw && this.Draw.end() for (let i = 0; i < this.entities.length; i++) { @@ -351,4 +411,4 @@ class CutFillAnalysis { } } } -export default CutFillAnalysis; \ No newline at end of file +export default CutFillAnalysis; diff --git a/src/Obj/Analysis/Profile/index.js b/src/Obj/Analysis/Profile/index.js index acc7f1f..a734383 100644 --- a/src/Obj/Analysis/Profile/index.js +++ b/src/Obj/Analysis/Profile/index.js @@ -172,26 +172,29 @@ class Profile extends Draw { return positions_Inter } formatter(xy, tipData) { - const pointOption = { - show: true, - pixelSize: 10, - color: Cesium.Color.GREEN, - outlineColor: Cesium.Color.SKYBLUE, - outlineWidth: 3, - disableDepthTestDistance: Number.POSITIVE_INFINITY - } - if (!this.tipEntity) { - this.tipEntity = this.sdk.viewer.entities.add({ - position: Cesium.Cartesian3.fromDegrees(xy[0], xy[1], Number(tipData[1])), - point: pointOption - }) - } else { - this.tipEntity.position = Cesium.Cartesian3.fromDegrees( - xy[0], - xy[1], - Number(tipData[1]) - ) + if (this.polyline) { + const pointOption = { + show: true, + pixelSize: 10, + color: Cesium.Color.GREEN, + outlineColor: Cesium.Color.SKYBLUE, + outlineWidth: 3, + disableDepthTestDistance: Number.POSITIVE_INFINITY + } + if (!this.tipEntity) { + this.tipEntity = this.sdk.viewer.entities.add({ + position: Cesium.Cartesian3.fromDegrees(xy[0], xy[1], Number(tipData[1])), + point: pointOption + }) + } else { + this.tipEntity.position = Cesium.Cartesian3.fromDegrees( + xy[0], + xy[1], + Number(tipData[1]) + ) + } } + } static async edit(that, points) { diff --git a/src/Obj/Analysis/SlopeAspect/index.js b/src/Obj/Analysis/SlopeAspect/index.js index ccd70ac..a630904 100644 --- a/src/Obj/Analysis/SlopeAspect/index.js +++ b/src/Obj/Analysis/SlopeAspect/index.js @@ -5,25 +5,23 @@ import MouseEvent from '../../../Event/index' class SlopeAspect extends Tools { /** * @constructor 坡度坡向分析 - * @param sdk + * @param sdk * **/ constructor(sdk) { super(sdk) this.viewer = sdk.viewer; - let terrainAvailability = this.viewer.terrainProvider.availability; - if (!terrainAvailability) { - this.error = '未加载地形数据！' - window.ELEMENT && window.ELEMENT.Message({ - message: '未加载地形数据！', - type: 'warning', - duration: 1500 - }); - return - } + this.event this.result = []; //存储创建的坡度分析结果，primitive集合 this.handler = undefined; this.toolTip = ""; + this.tools = new Tools(sdk) + let terrainAvailability = this.viewer.terrainProvider.availability; + if (!terrainAvailability) { + this.error = '未加载地形数据！' + this.tools.message({ type: 'warning', text: this.error }) + return + } YJ.Analysis.AnalysesResults.push(this) this.Draw = new DrawPolygon(this.sdk) // this.createNew4Distance() @@ -39,11 +37,7 @@ class SlopeAspect extends Tools { const viewer = this.viewer; this.Draw.start((e, positions) => { if (!positions || positions.length <= 2) { - window.ELEMENT && window.ELEMENT.Message({ - message: '至少拥有三个坐标位置！', - type: 'warning', - duration: 1500 - }); + this.tools.message({ type: 'warning', text: '至少拥有三个坐标位置！' }) return } let boundary = []; @@ -73,7 +67,7 @@ class SlopeAspect extends Tools { let num = n this.Draw.start((e, positions) => { if (!positions || positions.length <= 2) { - console.warn('至少拥有三个坐标位置！') + this.tools.message({ type: 'warning', text: '至少拥有三个坐标位置！' }) return } let boundary = []; @@ -204,8 +198,8 @@ class SlopeAspect extends Tools { let _this = this // 点位过多，分为三份计算 let num = (Math.floor(boxResults.length / 3) + '') - num = Number(num.substring(0, num.length - 1))*10 - let i=0 + num = Number(num.substring(0, num.length - 1)) * 10 + let i = 0 let points = boxResults.slice(i * num, (i + 1) * num) if (points.length > 0) { sampleTerrainMostDetailed(points) @@ -239,7 +233,7 @@ class SlopeAspect extends Tools { _this.calculateSlope(ellipseResults); }); } - + } createPolygonInsrance(points, color, curSlope) { @@ -514,4 +508,4 @@ class SlopeAspect extends Tools { this.sdk.viewer.scene.preRender.removeEventListener(this._watchEvent, this) } } -export default SlopeAspect; \ No newline at end of file +export default SlopeAspect; diff --git a/src/Obj/Analysis/Submerge/index.js b/src/Obj/Analysis/Submerge/index.js index 770098d..e0a066a 100644 --- a/src/Obj/Analysis/Submerge/index.js +++ b/src/Obj/Analysis/Submerge/index.js @@ -36,13 +36,13 @@ class Submerge extends Tools { that.Draw.start((a, positions) => { if (!positions || positions.length < 3) { let _error = '至少需要三个坐标！' - this.tools.message({ - message: _error, + that.tools.message({ + text: _error, type: 'warning', }); return } - Submerge.destroy() + that.destroy() if (!positions || positions.length == 0) { that.positions = [] that._positions = [] @@ -62,6 +62,18 @@ class Submerge extends Tools { } fromDegreesArray.push(positions[i].lng, positions[i].lat) } + + that.options.maxWaterLevel = positions[0].alt + for (let i = 0; i < positions.length; i++) { + if (that.options.minWaterLevel < positions[i].alt) { + that.options.maxWaterLevel = positions[i].alt + + + } + } + + + // for (let i = 0; i < positions.length; i++) { // fromDegreesArray.push(positions[i].lng, positions[i].lat, that.options.minWaterLevel) // } @@ -84,11 +96,16 @@ class Submerge extends Tools { TWEEN.remove(that.TweenAnimate) that.TweenAnimate = null } - let contentElm = that._DialogObject._element.body - let pauseBtn = contentElm.getElementsByClassName('pause')[0]; - let startBtn = contentElm.getElementsByClassName('start')[0]; - startBtn.style.display = 'flex' - pauseBtn.style.display = 'none' + + that.waterLevel = that.options.maxWaterLevel - that.options.minWaterLevel + that.options.waterVolume = Number((that.waterLevel * that.area).toFixed(4)) + + that.clickCallBack(that.area, that._positions) + // let contentElm = that._DialogObject._element.body + // let pauseBtn = contentElm.getElementsByClassName('pause')[0]; + // let startBtn = contentElm.getElementsByClassName('start')[0]; + // startBtn.style.display = 'flex' + // pauseBtn.style.display = 'none' // that.move() // Submerge.EditBox(that) }) @@ -105,7 +122,7 @@ class Submerge extends Tools { that._DialogObject = await new Dialog(that.sdk.viewer._container, { title: '淹没分析', left: '180px', top: '100px', closeCallBack: () => { - Submerge.destroy() + that.destroy() that.Dialog.closeCallBack && that.Dialog.closeCallBack() }, }) @@ -316,6 +333,22 @@ class Submerge extends Tools { }) } + get onEnd() { + return this.clickCallBack + } + set onEnd(val) { + if (val && typeof val !== 'function') { + console.error('val:', val, '不是一个function') + } else { + this.clickCallBack = val + } + } + get waterLevels() { + return this.waterLevel + } + set waterLevels(val) { + this.waterLevel = val + } get waterVolume() { return this.options.waterVolume } @@ -327,6 +360,7 @@ class Submerge extends Tools { } set minWaterLevel(val) { this.options.minWaterLevel = val + this.currentWaterLaver = this.options.minWaterLevel } get maxWaterLevel() { return this.options.maxWaterLevel @@ -340,10 +374,10 @@ class Submerge extends Tools { set risingSpeed(val) { this.options.risingSpeed = val } - get area() { + get areas() { return this.area } - set area(val) { + set areas(val) { this.area = val } @@ -357,11 +391,11 @@ class Submerge extends Tools { this.TweenAnimate = new TWEEN.Tween({ waterLevel: this.options.minWaterLevel }).to({ waterLevel: this.options.maxWaterLevel }, totalTime).delay(this.delay).easing(TWEEN.Easing.Linear.None).onUpdate(async (r, a) => { this.currentWaterLaver = r.waterLevel }).start() - let contentElm = this._DialogObject._element.body - let pauseBtn = contentElm.getElementsByClassName('pause')[0]; - let startBtn = contentElm.getElementsByClassName('start')[0]; - startBtn.style.display = 'none' - pauseBtn.style.display = 'flex' + // let contentElm = this._DialogObject._element.body + // let pauseBtn = contentElm.getElementsByClassName('pause')[0]; + // let startBtn = contentElm.getElementsByClassName('start')[0]; + // startBtn.style.display = 'none' + // pauseBtn.style.display = 'flex' } restart() { @@ -420,11 +454,11 @@ class Submerge extends Tools { }) } - static destroy() { + destroy() { if (this.TweenAnimate) { TWEEN.remove(this.TweenAnimate) } - this.Draw.end() + this.Draw && this.Draw.end() this.sdk.viewer.entities.remove(this.entity) this.entity = null } diff --git a/src/Obj/Analysis/TerrainExcavation/index.js b/src/Obj/Analysis/TerrainExcavation/index.js index 66ade8f..af25ddf 100644 --- a/src/Obj/Analysis/TerrainExcavation/index.js +++ b/src/Obj/Analysis/TerrainExcavation/index.js @@ -26,6 +26,7 @@ class TerrainExcavation extends Tools { this.wallMaterial = Cesium.Material.fromType('Color', { color: Cesium.Color.fromAlpha(Cesium.Color.fromCssColorString('#976b4e')) }) + this.tools = new Tools(this.sdk) let imageBottom = new Image(); let wallBottom = new Image(); imageBottom.src = this.bottomImg; @@ -71,7 +72,7 @@ class TerrainExcavation extends Tools { } } - this.init(); + // this.init(); } get show() { return this.options.show @@ -153,19 +154,11 @@ class TerrainExcavation extends Tools { startCreate() { this.Draw.start((e, positions) => { if (!positions || positions.length <= 2) { - window.ELEMENT && window.ELEMENT.Message({ - message: '至少拥有三个坐标位置！', - type: 'warning', - duration: 1500 - }); + this.tools.message({ type: 'warning', text: '至少拥有三个坐标位置！' }) return } - if(!this.isConvex(positions)) { - window.ELEMENT && window.ELEMENT.Message({ - message: '不支持凹多边形', - type: 'warning', - duration: 1500 - }); + if (!this.isConvex(positions)) { + this.tools.message({ type: 'warning', text: '至少拥有三个坐标位置！' }) console.log('不支持凹多边形') return } diff --git a/src/Obj/Analysis/ViewShed/index.js b/src/Obj/Analysis/ViewShed/index.js index 573c00c..112aaf2 100644 --- a/src/Obj/Analysis/ViewShed/index.js +++ b/src/Obj/Analysis/ViewShed/index.js @@ -26,748 +26,781 @@ import { html } from "./_element"; */ class ViewShedStage extends Tools { - constructor(sdk, options = {}, _Dialog = {}) { - super(sdk, options) + constructor(sdk, options = {}, _Dialog = {}) { + super(sdk, options) - // if (Object.hasOwn(options.viewPosition, 'lng') && Object.hasOwn(options.viewPosition, 'lat') && Object.hasOwn(options.viewPosition, 'alt')) { - // this.error = '请提供观测点位置！' - // window.ELEMENT && window.ELEMENT.Message({ - // message: '请提供观测点位置！', - // type: 'warning', - // duration: 1500 - // }); - // return - // } + // if (Object.hasOwn(options.viewPosition, 'lng') && Object.hasOwn(options.viewPosition, 'lat') && Object.hasOwn(options.viewPosition, 'alt')) { + // this.error = '请提供观测点位置！' + // window.ELEMENT && window.ELEMENT.Message({ + // message: '请提供观测点位置！', + // type: 'warning', + // duration: 1500 + // }); + // return + // } - this.viewer = sdk.viewer; - this.options = {} - this.options.viewPosition = options.viewPosition; - this.options.viewPositionEnd = options.viewPositionEnd; - this.options.horizontalViewAngle = (options.horizontalViewAngle || options.horizontalViewAngle === 0) ? options.horizontalViewAngle : 90.0; - this.options.verticalViewAngle = (options.verticalViewAngle || options.verticalViewAngle === 0) ? options.verticalViewAngle : 60.0; - this.options.visibleAreaColor = options.visibleAreaColor || '#008000'; - this.options.invisibleAreaColor = options.invisibleAreaColor || '#FF0000'; - this._elms = {}; - this.viewPointHeight = options.viewPointHeight - // this.enabled = (typeof options.enabled === "boolean") ? options.enabled : true; - // this.softShadows = (typeof options.softShadows === "boolean") ? options.softShadows : true; - // this.size = options.size || 10240; // 2048 - this.ids = [] - this.Dialog = _Dialog - this._EventBinding = new EventBinding() - this.html = null - YJ.Analysis.AnalysesResults.push(this) - ViewShedStage.edit(this) - // ViewShedStage.edit(this) - // this.update(); + this.viewer = sdk.viewer; + this.options = {} + this.options.viewPosition = options.viewPosition; + this.options.viewPositionEnd = options.viewPositionEnd; + this.options.horizontalViewAngle = (options.horizontalViewAngle || options.horizontalViewAngle === 0) ? options.horizontalViewAngle : 90.0; + this.options.verticalViewAngle = (options.verticalViewAngle || options.verticalViewAngle === 0) ? options.verticalViewAngle : 60.0; + this.options.visibleAreaColor = options.visibleAreaColor || '#008000'; + this.options.invisibleAreaColor = options.invisibleAreaColor || '#FF0000'; + this._elms = {}; + this.viewPointHeight = options.viewPointHeight + // this.enabled = (typeof options.enabled === "boolean") ? options.enabled : true; + // this.softShadows = (typeof options.softShadows === "boolean") ? options.softShadows : true; + // this.size = options.size || 10240; // 2048 + this.ids = [] + this.Dialog = _Dialog + this.tools = new Tools(this.sdk) + this._EventBinding = new EventBinding() + this.html = null + YJ.Analysis.AnalysesResults.push(this) + // ViewShedStage.edit(this) + // ViewShedStage.edit(this) + // this.update(); + } + + get viewPointHeight() { + return this.options.viewPointHeight + } + + set viewPointHeight(v) { + let viewPointHeight = Math.floor(Number(v) * 10) / 10 + if (isNaN(viewPointHeight)) { + viewPointHeight = 1.8 } - - get viewPointHeight() { - return this.options.viewPointHeight + if (viewPointHeight < 0) { + viewPointHeight = 0 } + this.options.viewPointHeight = viewPointHeight + this._elms.viewPointHeight && this._elms.viewPointHeight.forEach((item) => { + item.value = viewPointHeight + }) + } - set viewPointHeight(v) { - let viewPointHeight = Math.floor(Number(v) * 10) / 10 - if (isNaN(viewPointHeight)) { - viewPointHeight = 1.8 - } - if (viewPointHeight < 0) { - viewPointHeight = 0 - } - this.options.viewPointHeight = viewPointHeight - this._elms.viewPointHeight && this._elms.viewPointHeight.forEach((item) => { - item.value = viewPointHeight - }) + get viewPosition() { + return this.options.viewPosition + } + + set viewPosition(v) { + this.options.viewPosition = v + this.ids[0] && (this.viewer.entities.getById(this.ids[0]).position = new Cesium.Cartesian3.fromDegrees(v.lng, v.lat, v.alt)) + this.update() + // let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt) + } + + get viewPositionEnd() { + return this.options.viewPositionEnd + } + + set viewPositionEnd(v) { + this.options.viewPositionEnd = v + this.ids[1] && (this.viewer.entities.getById(this.ids[1]).position = new Cesium.Cartesian3.fromDegrees(v.lng, v.lat, v.alt)) + this.update() + // let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) + // this.viewDistance = this.viewPositionEnd ? Cesium.Cartesian3.distance(this.viewPosition, this.viewPositionEnd) : (options.viewDistance || 100.0); + } + + get horizontalViewAngle() { + return this.options.horizontalViewAngle + } + + set horizontalViewAngle(v) { + this.options.horizontalViewAngle = v + if (this._DialogObject && this._DialogObject._element && this._DialogObject._element.content) { + let contentElm = this._DialogObject._element.content + let e_horizontalViewAngle = contentElm.querySelector("input[name='horizontalViewAngle']") + e_horizontalViewAngle.value = v + let rangeNodeActive = contentElm.getElementsByClassName('range-node-active')[0] + let rangeNodeActiveText = rangeNodeActive.getElementsByClassName('range-node-active-text')[0] + rangeNodeActiveText.innerHTML = v + '°'; + let rangeProcess = contentElm.getElementsByClassName('range-process')[0] + rangeProcess.style.width = v / 180 * 100 + '%' } + this.update() + } - get viewPosition() { - return this.options.viewPosition + get horizontalViewAngles() { + return this.horizontalViewAngle + } + + set horizontalViewAngles(v) { + this.horizontalViewAngle = v + // this.update() + } + + get visibleAreaColor() { + return this.options.visibleAreaColor + } + + set visibleAreaColor(v) { + this.options.visibleAreaColor = v + this.update() + } + + get invisibleAreaColor() { + return this.options.invisibleAreaColor + } + + set invisibleAreaColor(v) { + this.options.invisibleAreaColor = v + this.update() + } + + get verticalViewAngle() { + return this.options.verticalViewAngle + } + + set verticalViewAngle(v) { + this.options.verticalViewAngle = v + this.update() + } + + get viewDistance() { + if (this.options.viewPosition) { + let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight) + let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) + let distance = Cesium.Cartesian3.distance(viewPosition3, viewPositionEnd3) + return distance } + } - set viewPosition(v) { - this.options.viewPosition = v - this.ids[0] && (this.viewer.entities.getById(this.ids[0]).position = new Cesium.Cartesian3.fromDegrees(v.lng, v.lat, v.alt)) - this.update() - // let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt) - } + get viewHeading() { + let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight) + let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) + let heading = getHeading(viewPosition3, viewPositionEnd3) + return heading + } - get viewPositionEnd() { - return this.options.viewPositionEnd - } + get viewPitch() { + let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight) + let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) + let pitch = getPitch(viewPosition3, viewPositionEnd3) + return pitch + } - set viewPositionEnd(v) { - this.options.viewPositionEnd = v - this.ids[1] && (this.viewer.entities.getById(this.ids[1]).position = new Cesium.Cartesian3.fromDegrees(v.lng, v.lat, v.alt)) - this.update() - // let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) - // this.viewDistance = this.viewPositionEnd ? Cesium.Cartesian3.distance(this.viewPosition, this.viewPositionEnd) : (options.viewDistance || 100.0); - } - - get horizontalViewAngle() { - return this.options.horizontalViewAngle - } - - set horizontalViewAngle(v) { - this.options.horizontalViewAngle = v - if (this._DialogObject && this._DialogObject._element && this._DialogObject._element.content) { - let contentElm = this._DialogObject._element.content - let e_horizontalViewAngle = contentElm.querySelector("input[name='horizontalViewAngle']") - e_horizontalViewAngle.value = v - let rangeNodeActive = contentElm.getElementsByClassName('range-node-active')[0] - let rangeNodeActiveText = rangeNodeActive.getElementsByClassName('range-node-active-text')[0] - rangeNodeActiveText.innerHTML = v + '°'; - let rangeProcess = contentElm.getElementsByClassName('range-process')[0] - rangeProcess.style.width = v / 180 * 100 + '%' - } - this.update() - } - - get visibleAreaColor() { - return this.options.visibleAreaColor - } - - set visibleAreaColor(v) { - this.options.visibleAreaColor = v - this.update() - } - - get invisibleAreaColor() { - return this.options.invisibleAreaColor - } - - set invisibleAreaColor(v) { - this.options.invisibleAreaColor = v - this.update() - } - - get verticalViewAngle() { - return this.options.verticalViewAngle - } - - set verticalViewAngle(v) { - this.options.verticalViewAngle = v - this.update() - } - - get viewDistance() { - let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight) - let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) - let distance = Cesium.Cartesian3.distance(viewPosition3, viewPositionEnd3) - return distance - } - - get viewHeading() { - let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight) - let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) - let heading = getHeading(viewPosition3, viewPositionEnd3) - return heading - } - - get viewPitch() { - let viewPosition3 = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight) - let viewPositionEnd3 = Cesium.Cartesian3.fromDegrees(this.options.viewPositionEnd.lng, this.options.viewPositionEnd.lat, this.options.viewPositionEnd.alt) - let pitch = getPitch(viewPosition3, viewPositionEnd3) - return pitch - } - - static create(that) { - that.destroy() - let count = 0; - if (!YJ.Measure.GetMeasureStatus()) { - that.event = new Event(that.sdk) - that.tip = new MouseTip('左键选择观测点位置，右键取消', that.sdk) - YJ.Measure.SetMeasureStatus(true) - that.event.mouse_left((movement, cartesian) => { - if (!that.viewPosition) { - that.options.viewPosition = that.cartesian3Towgs84(cartesian, that.viewer) - that.ids.push(ViewShedStage.create_point(that, cartesian)) - that.tip.set_text("左键选择最远观测点位置，右键取消") - } - count++ - if (count === 2) { - that.options.viewPositionEnd = that.cartesian3Towgs84(cartesian, that.viewer) - that.ids.push(ViewShedStage.create_point(that, cartesian)) - end() - that.update() - } - }) - that.event.mouse_move((movement, cartesian) => { - that.tip.setPosition(cartesian, movement.endPosition.x, movement.endPosition.y) - }) - that.event.mouse_right((movement, cartesian) => { - that.ids.forEach(id => { - that.viewer.entities.removeById(id) - }) - that.ids = [] - end() - }) - that.event.gesture_pinck_start((movement, cartesian) => { - let startTime = new Date() - that.event.gesture_pinck_end(() => { - let endTime = new Date() - if (endTime - startTime >= 500) { - that.ids.forEach(id => { - that.viewer.entities.removeById(id) - }) - that.ids = [] - end() - } - }) - }) - } - else { - console.log('上一次测量未结束') - } - - function end() { - that.ids.forEach(id => { - let entity = that.viewer.entities.getById(id) - entity.show = false - }) - YJ.Measure.SetMeasureStatus(false) - that.tip.destroy() - that.event.destroy() - that.tip = null - that.event = null - } - } - - static create_point(that, cartesian) { - let id = that.randomString() - let p = that.cartesian3Towgs84(cartesian, that.viewer) - let params = { - id: id, - position: Cesium.Cartesian3.fromDegrees(p.lng, p.lat, p.alt), - billboard: { - image: that.getSourceRootPath() + '/img/point.png', - verticalOrigin: Cesium.VerticalOrigin.BOTTOM, - disableDepthTestDistance: Number.POSITIVE_INFINITY, - color: Cesium.Color.WHITE.withAlpha(0.99) - } - } - that.viewer.entities.add( - new Cesium.Entity(params) - ) - return id - } - - - add() { - this.createLightCamera(); - this.createShadowMap(); - this.createPostStage(); - // this.drawFrustumOutline(); - this.drawSketch(); - ViewShedStage.getcanvas(this) - } - - update() { - this.clear(); - this.add(); - } - - static async edit(that) { - if (that._DialogObject && that._DialogObject.close) { - that._DialogObject.close() - that._DialogObject = null - } - that._DialogObject = await new Dialog(that.sdk.viewer._container, { - title: '可视域分析', left: '180px', top: '100px', - closeCallBack: () => { - that.Dialog.closeCallBack && that.Dialog.closeCallBack() - YJ.Measure.SetMeasureStatus(false) - that.editevent && that.editevent.destroy() - that.ControllerObject && that.ControllerObject.destroy() - that.ids.forEach(id => { - that.viewer.entities.removeById(id) - }) - }, - }) - await that._DialogObject.init() - that._DialogObject._element.body.className = that._DialogObject._element.body.className + ' view-shed' - let contentElm = document.createElement('div'); - contentElm.innerHTML = html() - that._DialogObject.contentAppChild(contentElm) - let resetBtn = that._DialogObject._element.body.getElementsByClassName('edit')[0]; - resetBtn.addEventListener('click', () => { - that.nodeEdit() - }) - let drawElm = document.createElement('button') - drawElm.innerHTML = '绘制' - drawElm.addEventListener('click', () => { - ViewShedStage.create(that) - }) - that._DialogObject.footAppChild(drawElm) - that.html = contentElm - let all_elm = contentElm.getElementsByTagName("*") - that._EventBinding.on(that, all_elm) - that._elms = that._EventBinding.element - // //经度值 - // let e_lng = contentElm.querySelector("span[name='lng']") - // e_lng.innerHTML = Number(that.options.viewPosition.lng.toFixed(8)) - - // //纬度值 - // let e_lat = contentElm.querySelector("span[name='lat']") - // e_lat.innerHTML = Number(that.options.viewPosition.lat.toFixed(8)) - - // //高度值 - // let e_alt = contentElm.querySelector("span[name='alt']") - // e_alt.innerHTML = Number(that.options.viewPosition.alt.toFixed(8)) - - // //偏航角 - // let e_viewHeading = contentElm.querySelector("span[name='viewHeading']") - // e_viewHeading.innerHTML = Number(that.viewHeading.toFixed(8)) - - // //俯仰角 - // let e_viewPitch = contentElm.querySelector("span[name='viewPitch']") - // e_viewPitch.innerHTML = Number(that.viewPitch.toFixed(8)) - - //视域夹角 - let e_horizontalViewAngle = contentElm.querySelector("input[name='horizontalViewAngle']") - e_horizontalViewAngle.value = that.options.horizontalViewAngle - let rangeNodeActive = contentElm.getElementsByClassName('range-node-active')[0] - let rangeNodeActiveText = rangeNodeActive.getElementsByClassName('range-node-active-text')[0] - let rangeProcess = contentElm.getElementsByClassName('range-process')[0] - let percentage = that.horizontalViewAngle / 180 * 100 - rangeNodeActive.style.left = percentage + '%'; - rangeProcess.style.width = percentage + '%' - rangeNodeActiveText.innerHTML = that.horizontalViewAngle + '°'; - let timeout - e_horizontalViewAngle.addEventListener('input', () => { - let percentage = e_horizontalViewAngle.value / 180 * 100 - rangeNodeActive.style.left = percentage + '%'; - rangeProcess.style.width = percentage + '%'; - rangeNodeActiveText.innerHTML = e_horizontalViewAngle.value + '°'; - }) - e_horizontalViewAngle.addEventListener('change', () => { - clearTimeout(timeout) - timeout = setTimeout(() => { - that.horizontalViewAngle = e_horizontalViewAngle.value; - }, 300); - }); - } - - static getcanvas(that) { + static create(that) { + that.destroy() + let count = 0; + if (!YJ.Measure.GetMeasureStatus()) { + that.event = new Event(that.sdk) + that.tip = new MouseTip('左键选择观测点位置，右键取消', that.sdk) + YJ.Measure.SetMeasureStatus(true) + that.event.mouse_left((movement, cartesian) => { if (!that.viewPosition) { - return + that.options.viewPosition = that.cartesian3Towgs84(cartesian, that.viewer) + that.ids.push(ViewShedStage.create_point(that, cartesian)) + that.tip.set_text("左键选择最远观测点位置，右键取消") } - if (that.viewBillboardPrimitive) { - that.viewer.scene.primitives.remove(that.viewBillboardPrimitive) - that.viewBillboardPrimitive = null + count++ + if (count === 2) { + that.options.viewPositionEnd = that.cartesian3Towgs84(cartesian, that.viewer) + that.ids.push(ViewShedStage.create_point(that, cartesian)) + that.end() + that.update() } - const canvas = document.createElement('canvas'); - const ctx = canvas.getContext('2d') - canvas.width = 220 - canvas.height = 180 - canvas.style.background = "#000000" - let img = new Image(); - const data = [ - { - images: that.getSourceRootPath() + '/img/bubble/lng.png', - text: '经度：' + parseFloat(that.viewPosition.lng.toFixed(10)) + '°' - }, - { - images: that.getSourceRootPath() + '/img/bubble/lat.png', - text: '纬度：' + parseFloat(that.viewPosition.lat.toFixed(10)) + '°' - }, - { - images: that.getSourceRootPath() + '/img/bubble/h.png', - text: '高度：' + Number(((parseFloat(that.viewPosition.alt.toFixed(2)) + Number(that.viewPointHeight))).toFixed(2)) + ' m' - }, - { - images: that.getSourceRootPath() + '/img/bubble/heading.png', - text: '偏航角：' + parseFloat(that.viewHeading.toFixed(10)) + '°' - }, - { - images: that.getSourceRootPath() + '/img/bubble/pitch.png', - text: '俯仰角：' + parseFloat(that.viewPitch.toFixed(10)) + '°' - } - ] - img.src = that.getSourceRootPath() + '/img/bubble/bubble.png'; - let imagesLoaded = 0 - img.onload = () => { - ctx.drawImage(img, 0, 0, canvas.width, canvas.height); - data.forEach((item, index) => { - const img = new Image(); - img.src = item.images; - img.onload = () => { - ctx.drawImage(img, 12, 12 + (index * 26)); - ctx.fillStyle = "#fff"; - ctx.font = "12px Arial"; - ctx.fillText(item.text, 44, 28 + (index * 26)); - imagesLoaded++; - if (imagesLoaded === data.length) { - that.viewBillboardPrimitive = that.viewer.scene.primitives.add(new Cesium.BillboardCollection()) - that.viewBillboardPrimitive.add({ - position: Cesium.Cartesian3.fromDegrees(that.viewPosition.lng, that.viewPosition.lat, that.viewPosition.alt + that.viewPointHeight), - image: canvas, - width: 200, - height: 180, - verticalOrigin: Cesium.VerticalOrigin.BOTTOM, - disableDepthTestDistance: Number.POSITIVE_INFINITY, - }) - } - }; + }) + that.event.mouse_move((movement, cartesian) => { + that.tip.setPosition(cartesian, movement.endPosition.x, movement.endPosition.y) + }) + that.event.mouse_right((movement, cartesian) => { + that.ids.forEach(id => { + that.viewer.entities.removeById(id) + }) + that.ids = [] + that.end() + }) + that.event.gesture_pinck_start((movement, cartesian) => { + let startTime = new Date() + that.event.gesture_pinck_end(() => { + let endTime = new Date() + if (endTime - startTime >= 500) { + that.ids.forEach(id => { + that.viewer.entities.removeById(id) }) - }; + that.ids = [] + that.end() + } + }) + }) + } + else { + this.tools.message({ + text: '上一次测量未结束', + type: 'warning', + }); } - clear() { + + } + end() { + this.ids.forEach(id => { + let entity = this.viewer.entities.getById(id) + entity && (entity.show = false) + }) + YJ.Measure.SetMeasureStatus(false) + this.tip && this.tip.destroy() + this.event && this.event.destroy() + this.tip = null + this.event = null + } + draw() { + ViewShedStage.create(this) + } + + static create_point(that, cartesian) { + let id = that.randomString() + let p = that.cartesian3Towgs84(cartesian, that.viewer) + let params = { + id: id, + position: Cesium.Cartesian3.fromDegrees(p.lng, p.lat, p.alt), + billboard: { + image: that.getSourceRootPath() + '/img/point.png', + verticalOrigin: Cesium.VerticalOrigin.BOTTOM, + disableDepthTestDistance: Number.POSITIVE_INFINITY, + color: Cesium.Color.WHITE.withAlpha(0.99) + } + } + that.viewer.entities.add( + new Cesium.Entity(params) + ) + return id + } + + add() { + if (this.options.viewPositionEnd) { + this.createLightCamera(); + this.createShadowMap(); + this.createPostStage(); + // this.drawFrustumOutline(); + this.drawSketch(); + ViewShedStage.getcanvas(this) + } + } + + update() { + this.clear(); + this.add(); + } + + static async edit(that) { + if (that._DialogObject && that._DialogObject.close) { + that._DialogObject.close() + that._DialogObject = null + } + that._DialogObject = await new Dialog(that.sdk.viewer._container, { + title: '可视域分析', left: '180px', top: '100px', + closeCallBack: () => { + that.Dialog.closeCallBack && that.Dialog.closeCallBack() YJ.Measure.SetMeasureStatus(false) - this.tip && this.tip.destroy() - this.event && this.event.destroy() - this.tip = null - this.event = null - if (this.sketch) { - this.viewer.entities.removeById(this.sketch.id); - this.sketch = null; - } - if (this.frustumOutline) { - // this.frustumOutline.destroy(); - this.viewer.entities.removeById(this.frustumOutline.id); - this.frustumOutline = null; - } - if (this.postStage) { - this.viewer.scene.postProcessStages.remove(this.postStage); - this.postStage = null; - } + that.editevent && that.editevent.destroy() + that.ControllerObject && that.ControllerObject.destroy() + that.ids.forEach(id => { + that.viewer.entities.removeById(id) + }) + }, + }) + await that._DialogObject.init() + that._DialogObject._element.body.className = that._DialogObject._element.body.className + ' view-shed' + let contentElm = document.createElement('div'); + contentElm.innerHTML = html() + that._DialogObject.contentAppChild(contentElm) + let resetBtn = that._DialogObject._element.body.getElementsByClassName('edit')[0]; + resetBtn.addEventListener('click', () => { + that.nodeEdit() + }) + let drawElm = document.createElement('button') + drawElm.innerHTML = '绘制' + drawElm.addEventListener('click', () => { + ViewShedStage.create(that) + }) + that._DialogObject.footAppChild(drawElm) + that.html = contentElm + let all_elm = contentElm.getElementsByTagName("*") + that._EventBinding.on(that, all_elm) + that._elms = that._EventBinding.element + // //经度值 + // let e_lng = contentElm.querySelector("span[name='lng']") + // e_lng.innerHTML = Number(that.options.viewPosition.lng.toFixed(8)) + // //纬度值 + // let e_lat = contentElm.querySelector("span[name='lat']") + // e_lat.innerHTML = Number(that.options.viewPosition.lat.toFixed(8)) + + // //高度值 + // let e_alt = contentElm.querySelector("span[name='alt']") + // e_alt.innerHTML = Number(that.options.viewPosition.alt.toFixed(8)) + + // //偏航角 + // let e_viewHeading = contentElm.querySelector("span[name='viewHeading']") + // e_viewHeading.innerHTML = Number(that.viewHeading.toFixed(8)) + + // //俯仰角 + // let e_viewPitch = contentElm.querySelector("span[name='viewPitch']") + // e_viewPitch.innerHTML = Number(that.viewPitch.toFixed(8)) + + //视域夹角 + let e_horizontalViewAngle = contentElm.querySelector("input[name='horizontalViewAngle']") + e_horizontalViewAngle.value = that.options.horizontalViewAngle + let rangeNodeActive = contentElm.getElementsByClassName('range-node-active')[0] + let rangeNodeActiveText = rangeNodeActive.getElementsByClassName('range-node-active-text')[0] + let rangeProcess = contentElm.getElementsByClassName('range-process')[0] + let percentage = that.horizontalViewAngle / 180 * 100 + rangeNodeActive.style.left = percentage + '%'; + rangeProcess.style.width = percentage + '%' + rangeNodeActiveText.innerHTML = that.horizontalViewAngle + '°'; + let timeout + e_horizontalViewAngle.addEventListener('input', () => { + let percentage = e_horizontalViewAngle.value / 180 * 100 + rangeNodeActive.style.left = percentage + '%'; + rangeProcess.style.width = percentage + '%'; + rangeNodeActiveText.innerHTML = e_horizontalViewAngle.value + '°'; + }) + e_horizontalViewAngle.addEventListener('change', () => { + clearTimeout(timeout) + timeout = setTimeout(() => { + that.horizontalViewAngle = e_horizontalViewAngle.value; + }, 300); + }); + } + + static getcanvas(that) { + if (!that.viewPosition) { + return + } + if (that.viewBillboardPrimitive) { + that.viewer.scene.primitives.remove(that.viewBillboardPrimitive) + that.viewBillboardPrimitive = null + } + const canvas = document.createElement('canvas'); + const ctx = canvas.getContext('2d') + canvas.width = 220 + canvas.height = 180 + canvas.style.background = "#000000" + let img = new Image(); + const data = [ + { + images: that.getSourceRootPath() + '/img/bubble/lng.png', + text: '经度：' + parseFloat(that.viewPosition.lng.toFixed(10)) + '°' + }, + { + images: that.getSourceRootPath() + '/img/bubble/lat.png', + text: '纬度：' + parseFloat(that.viewPosition.lat.toFixed(10)) + '°' + }, + { + images: that.getSourceRootPath() + '/img/bubble/h.png', + text: '高度：' + Number(((parseFloat(that.viewPosition.alt.toFixed(2)) + Number(that.viewPointHeight))).toFixed(2)) + ' m' + }, + { + images: that.getSourceRootPath() + '/img/bubble/heading.png', + text: '偏航角：' + parseFloat(that.viewHeading.toFixed(10)) + '°' + }, + { + images: that.getSourceRootPath() + '/img/bubble/pitch.png', + text: '俯仰角：' + parseFloat(that.viewPitch.toFixed(10)) + '°' + } + ] + img.src = that.getSourceRootPath() + '/img/bubble/bubble.png'; + let imagesLoaded = 0 + img.onload = () => { + ctx.drawImage(img, 0, 0, canvas.width, canvas.height); + data.forEach((item, index) => { + const img = new Image(); + img.src = item.images; + img.onload = () => { + ctx.drawImage(img, 12, 12 + (index * 26)); + ctx.fillStyle = "#fff"; + ctx.font = "12px Arial"; + ctx.fillText(item.text, 44, 28 + (index * 26)); + imagesLoaded++; + if (imagesLoaded === data.length) { + that.viewBillboardPrimitive = that.viewer.scene.primitives.add(new Cesium.BillboardCollection()) + that.viewBillboardPrimitive.add({ + position: Cesium.Cartesian3.fromDegrees(that.viewPosition.lng, that.viewPosition.lat, that.viewPosition.alt + that.viewPointHeight), + image: canvas, + width: 200, + height: 180, + verticalOrigin: Cesium.VerticalOrigin.BOTTOM, + disableDepthTestDistance: Number.POSITIVE_INFINITY, + }) + } + }; + }) + }; + } + + clear() { + YJ.Measure.SetMeasureStatus(false) + this.end() + this.tip && this.tip.destroy() + this.event && this.event.destroy() + this.tip = null + this.event = null + if (this.sketch) { + this.viewer.entities.removeById(this.sketch.id); + this.sketch = null; + } + if (this.frustumOutline) { + // this.frustumOutline.destroy(); + this.viewer.entities.removeById(this.frustumOutline.id); + this.frustumOutline = null; + } + if (this.postStage) { + this.viewer.scene.postProcessStages.remove(this.postStage); + this.postStage = null; } - destroy() { - this.clear() + } + + destroy() { + this.clear() + this.editevent && this.editevent.destroy() + this.ControllerObject && this.ControllerObject.destroy() + this.ids.forEach(id => { + this.viewer.entities.removeById(id) + }) + this.ids = [] + if (this.viewBillboardPrimitive) { + this.viewer.scene.primitives.remove(this.viewBillboardPrimitive) + } + this.viewBillboardPrimitive = null + this.options.viewPosition = null + this.options.viewPositionEnd = null + YJ.Measure.SetMeasureStatus(false) + if (this._originalShadowMap) { + this.viewer.scene.shadowMap = this._originalShadowMap + this._originalShadowMap = null + } + this.viewer.shadows = this.viewer._shadows + } + close() { + YJ.Measure.SetMeasureStatus(false) + this.end() + this.editevent && this.editevent.destroy() + this.ControllerObject && this.ControllerObject.destroy() + this.ids.forEach(id => { + this.viewer.entities.removeById(id) + }) + } + + nodeEdit() { + if (YJ.Measure.GetMeasureStatus()) { + this.tools.message({ + text: '上一次测量未结束', + type: 'warning', + }); + } + else { + this.editevent && this.editevent.destroy() + this.ids.forEach(id => { + let entity = this.viewer.entities.getById(id) + entity.show = true + }) + let selectPoint + YJ.Measure.SetMeasureStatus(true) + // this.tip = new MouseTip('左键选择要操作的观测点，右键取消', this.sdk) + this.editevent = new Event(this.sdk) + this.editevent.mouse_left((movement, cartesian) => { + let pick = this.viewer.scene.pick(movement.position); + if (pick && pick.id && pick.id.id && this.ids.indexOf(pick.id.id) != -1 && (!selectPoint || selectPoint.id != pick.id.id)) { + selectPoint = pick.id + // this.event.destroy() + // this.tip.destroy() + this.viewer.entities.getById(this.ids[0]).position = new Cesium.Cartesian3.fromDegrees(this.viewPosition.lng, this.viewPosition.lat, this.viewPosition.alt) + this.viewer.entities.getById(this.ids[1]).position = new Cesium.Cartesian3.fromDegrees(this.viewPositionEnd.lng, this.viewPositionEnd.lat, this.viewPositionEnd.alt) + this.ControllerObject && this.ControllerObject.destroy() + this.ControllerObject = new Controller(this.sdk, { position: { ...this.cartesian3Towgs84(selectPoint.position._value, this.sdk.viewer) } }) + this.ControllerObject.controllerCallBack = (params, status) => { + if (params.position.alt < 0) { + params.position.alt = 0 + } + selectPoint.position = new Cesium.Cartesian3.fromDegrees(params.position.lng, params.position.lat, params.position.alt) + if (status) { + if (this.ids.indexOf(pick.id.id) == 0) { + this.viewPosition = params.position + } + else { + this.viewPositionEnd = params.position + } + YJ.Measure.SetMeasureStatus(true) + } + } + this.ControllerObject.editTranslational() + } + }) + this.editevent.mouse_right((movement, cartesian) => { + YJ.Measure.SetMeasureStatus(false) this.editevent && this.editevent.destroy() this.ControllerObject && this.ControllerObject.destroy() this.ids.forEach(id => { - this.viewer.entities.removeById(id) + let entity = this.viewer.entities.getById(id) + entity.show = false }) - this.ids = [] - if (this.viewBillboardPrimitive) { - this.viewer.scene.primitives.remove(this.viewBillboardPrimitive) - } - this.viewBillboardPrimitive = null - this.options.viewPosition = null - this.options.viewPositionEnd = null - YJ.Measure.SetMeasureStatus(false) - if (this._originalShadowMap) { - this.viewer.scene.shadowMap = this._originalShadowMap - this._originalShadowMap = null - } - this.viewer.shadows = this.viewer._shadows - } + selectPoint = null + }) + this.editevent.mouse_move((movement, cartesian) => { + // this.tip.setPosition( + // cartesian, + // movement.endPosition.x, + // movement.endPosition.y + // ) + }) - nodeEdit() { - if (YJ.Measure.GetMeasureStatus()) { - console.log('上一次测量未结束') - } - else { + this.editevent.gesture_pinck_start((movement, cartesian) => { + let startTime = new Date() + this.editevent.gesture_pinck_end(() => { + let endTime = new Date() + if (endTime - startTime >= 500) { + YJ.Measure.SetMeasureStatus(false) this.editevent && this.editevent.destroy() + this.ControllerObject && this.ControllerObject.destroy() this.ids.forEach(id => { - let entity = this.viewer.entities.getById(id) - entity.show = true + let entity = this.viewer.entities.getById(id) + entity.show = false }) - let selectPoint - YJ.Measure.SetMeasureStatus(true) - // this.tip = new MouseTip('左键选择要操作的观测点，右键取消', this.sdk) - this.editevent = new Event(this.sdk) - this.editevent.mouse_left((movement, cartesian) => { - let pick = this.viewer.scene.pick(movement.position); - if (pick && pick.id && pick.id.id && this.ids.indexOf(pick.id.id) != -1 && (!selectPoint || selectPoint.id != pick.id.id)) { - selectPoint = pick.id - // this.event.destroy() - // this.tip.destroy() - this.viewer.entities.getById(this.ids[0]).position = new Cesium.Cartesian3.fromDegrees(this.viewPosition.lng, this.viewPosition.lat, this.viewPosition.alt) - this.viewer.entities.getById(this.ids[1]).position = new Cesium.Cartesian3.fromDegrees(this.viewPositionEnd.lng, this.viewPositionEnd.lat, this.viewPositionEnd.alt) - this.ControllerObject && this.ControllerObject.destroy() - this.ControllerObject = new Controller(this.sdk, { position: { ...this.cartesian3Towgs84(selectPoint.position._value, this.sdk.viewer) } }) - this.ControllerObject.controllerCallBack = (params, status) => { - if (params.position.alt < 0) { - params.position.alt = 0 - } - selectPoint.position = new Cesium.Cartesian3.fromDegrees(params.position.lng, params.position.lat, params.position.alt) - if (status) { - if (this.ids.indexOf(pick.id.id) == 0) { - this.viewPosition = params.position - } - else { - this.viewPositionEnd = params.position - } - YJ.Measure.SetMeasureStatus(true) - } - } - this.ControllerObject.editTranslational() - } - }) - this.editevent.mouse_right((movement, cartesian) => { - YJ.Measure.SetMeasureStatus(false) - this.editevent && this.editevent.destroy() - this.ControllerObject && this.ControllerObject.destroy() - this.ids.forEach(id => { - let entity = this.viewer.entities.getById(id) - entity.show = false - }) - selectPoint = null - }) - this.editevent.mouse_move((movement, cartesian) => { - // this.tip.setPosition( - // cartesian, - // movement.endPosition.x, - // movement.endPosition.y - // ) - }) - - this.editevent.gesture_pinck_start((movement, cartesian) => { - let startTime = new Date() - this.editevent.gesture_pinck_end(() => { - let endTime = new Date() - if (endTime - startTime >= 500) { - YJ.Measure.SetMeasureStatus(false) - this.editevent && this.editevent.destroy() - this.ControllerObject && this.ControllerObject.destroy() - this.ids.forEach(id => { - let entity = this.viewer.entities.getById(id) - entity.show = false - }) - selectPoint = null - } - }) - }) - - } + selectPoint = null + } + }) + }) } - createLightCamera() { - if (!this.options.viewPosition) { - return - } - let _this = this - this.lightCamera = new Cesium.Camera(this.viewer.scene); - this.lightCamera.position = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight); - // if (this.viewPositionEnd) { - // let direction = Cesium.Cartesian3.normalize(Cesium.Cartesian3.subtract(this.viewPositionEnd, this.viewPosition, new Cesium.Cartesian3()), new Cesium.Cartesian3()); - // this.lightCamera.direction = direction; // direction是相机面向的方向 - // } - this.lightCamera.frustum.near = this.viewDistance * 0.001; - this.lightCamera.frustum.far = this.viewDistance; - const hr = Cesium.Math.toRadians(this.horizontalViewAngle); - const vr = Cesium.Math.toRadians(this.verticalViewAngle); - const aspectRatio = - (this.viewDistance * Math.tan(hr / 2) * 2) / - (this.viewDistance * Math.tan(vr / 2) * 2); - this.lightCamera.frustum.aspectRatio = aspectRatio; - if (hr > vr) { - this.lightCamera.frustum.fov = hr; - } else { - this.lightCamera.frustum.fov = vr; - } - this.lightCamera.setView({ - destination: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), - orientation: { - heading: Cesium.Math.toRadians(this.viewHeading || 0), - pitch: Cesium.Math.toRadians(this.viewPitch || 0), - roll: 0 - } - }); + } + + createLightCamera() { + if (!this.options.viewPosition) { + return } - - createShadowMap() { - this.shadowMap = new Cesium.ShadowMap({ - context: (this.viewer.scene).context, - lightCamera: this.lightCamera, - enabled: true, - isPointLight: true, - pointLightRadius: this.viewDistance, - cascadesEnabled: false, - size: 2048, // 2048 - softShadows: true, - normalOffset: false, - fromLightSource: false - }); - if (!this._originalShadowMap) { - this._originalShadowMap = this.viewer.scene.shadowMap - } - this.viewer.scene.shadowMap = this.shadowMap; - // setTimeout(() => { - // this.viewer.shadows = this.viewer._shadows - // }, 0); + let _this = this + this.lightCamera = new Cesium.Camera(this.viewer.scene); + this.lightCamera.position = Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight); + // if (this.viewPositionEnd) { + // let direction = Cesium.Cartesian3.normalize(Cesium.Cartesian3.subtract(this.viewPositionEnd, this.viewPosition, new Cesium.Cartesian3()), new Cesium.Cartesian3()); + // this.lightCamera.direction = direction; // direction是相机面向的方向 + // } + this.lightCamera.frustum.near = this.viewDistance * 0.001; + this.lightCamera.frustum.far = this.viewDistance; + const hr = Cesium.Math.toRadians(this.horizontalViewAngle); + const vr = Cesium.Math.toRadians(this.verticalViewAngle); + const aspectRatio = + (this.viewDistance * Math.tan(hr / 2) * 2) / + (this.viewDistance * Math.tan(vr / 2) * 2); + this.lightCamera.frustum.aspectRatio = aspectRatio; + if (hr > vr) { + this.lightCamera.frustum.fov = hr; + } else { + this.lightCamera.frustum.fov = vr; } + this.lightCamera.setView({ + destination: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), + orientation: { + heading: Cesium.Math.toRadians(this.viewHeading || 0), + pitch: Cesium.Math.toRadians(this.viewPitch || 0), + roll: 0 + } + }); + } - createPostStage() { - const fs = glsl - if (Number(Cesium.VERSION.split('.')[1]) >= 102) { - fs = glsl2 - } - const postStage = new Cesium.PostProcessStage({ - fragmentShader: fs, - uniforms: { - shadowMap_textureCube: () => { - this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); - return Reflect.get(this.shadowMap, "_shadowMapTexture"); - }, - shadowMap_matrix: () => { - this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); - return Reflect.get(this.shadowMap, "_shadowMapMatrix"); - }, - shadowMap_lightPositionEC: () => { - this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); - return Reflect.get(this.shadowMap, "_lightPositionEC"); - }, - shadowMap_normalOffsetScaleDistanceMaxDistanceAndDarkness: () => { - this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); - const bias = this.shadowMap._pointBias; - return Cesium.Cartesian4.fromElements( - bias.normalOffsetScale, - this.shadowMap._distance, - this.shadowMap.maximumDistance, - 0.0, - new Cesium.Cartesian4() - ); - }, - shadowMap_texelSizeDepthBiasAndNormalShadingSmooth: () => { - this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); - const bias = this.shadowMap._pointBias; - const scratchTexelStepSize = new Cesium.Cartesian2(); - const texelStepSize = scratchTexelStepSize; - texelStepSize.x = 1.0 / this.shadowMap._textureSize.x; - texelStepSize.y = 1.0 / this.shadowMap._textureSize.y; - - return Cesium.Cartesian4.fromElements( - texelStepSize.x, - texelStepSize.y, - bias.depthBias, - bias.normalShadingSmooth, - new Cesium.Cartesian4() - ); - }, - camera_projection_matrix: this.lightCamera.frustum.projectionMatrix, - camera_view_matrix: this.lightCamera.viewMatrix, - helsing_viewDistance: () => { - return this.viewDistance; - }, - helsing_visibleAreaColor: Cesium.Color.fromCssColorString(this.visibleAreaColor), - helsing_invisibleAreaColor: Cesium.Color.fromCssColorString(this.invisibleAreaColor), - } - }); - this.postStage = this.viewer.scene.postProcessStages.add(postStage); + createShadowMap() { + this.shadowMap = new Cesium.ShadowMap({ + context: (this.viewer.scene).context, + lightCamera: this.lightCamera, + enabled: true, + isPointLight: true, + pointLightRadius: this.viewDistance, + cascadesEnabled: false, + size: 2048, // 2048 + softShadows: true, + normalOffset: false, + fromLightSource: false + }); + if (!this._originalShadowMap) { + this._originalShadowMap = this.viewer.scene.shadowMap } + this.viewer.scene.shadowMap = this.shadowMap; + // setTimeout(() => { + // this.viewer.shadows = this.viewer._shadows + // }, 0); + } - drawFrustumOutline() { - const scratchRight = new Cesium.Cartesian3(); - const scratchRotation = new Cesium.Matrix3(); - const scratchOrientation = new Cesium.Quaternion(); - const position = this.lightCamera.positionWC; - const direction = this.lightCamera.directionWC; - const up = this.lightCamera.upWC; - let right = this.lightCamera.rightWC; - right = Cesium.Cartesian3.negate(right, scratchRight); - let rotation = scratchRotation; - Cesium.Matrix3.setColumn(rotation, 0, right, rotation); - Cesium.Matrix3.setColumn(rotation, 1, up, rotation); - Cesium.Matrix3.setColumn(rotation, 2, direction, rotation); - let orientation = Cesium.Quaternion.fromRotationMatrix(rotation, scratchOrientation); - - let instance = new Cesium.GeometryInstance({ - geometry: new Cesium.FrustumOutlineGeometry({ - frustum: this.lightCamera.frustum, - origin: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), - orientation: orientation - }), - id: Math.random().toString(36).substr(2), - attributes: { - color: Cesium.ColorGeometryInstanceAttribute.fromColor( - Cesium.Color.YELLOWGREEN//new Cesium.Color(0.0, 1.0, 0.0, 1.0) - ), - show: new Cesium.ShowGeometryInstanceAttribute(true) - } - }); - - this.frustumOutline = this.viewer.scene.primitives.add( - new Cesium.Primitive({ - geometryInstances: [instance], - appearance: new Cesium.PerInstanceColorAppearance({ - flat: true, - translucent: false - }) - }) - ); + createPostStage() { + const fs = glsl + if (Number(Cesium.VERSION.split('.')[1]) >= 102) { + fs = glsl2 } + const postStage = new Cesium.PostProcessStage({ + fragmentShader: fs, + uniforms: { + shadowMap_textureCube: () => { + this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); + return Reflect.get(this.shadowMap, "_shadowMapTexture"); + }, + shadowMap_matrix: () => { + this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); + return Reflect.get(this.shadowMap, "_shadowMapMatrix"); + }, + shadowMap_lightPositionEC: () => { + this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); + return Reflect.get(this.shadowMap, "_lightPositionEC"); + }, + shadowMap_normalOffsetScaleDistanceMaxDistanceAndDarkness: () => { + this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); + const bias = this.shadowMap._pointBias; + return Cesium.Cartesian4.fromElements( + bias.normalOffsetScale, + this.shadowMap._distance, + this.shadowMap.maximumDistance, + 0.0, + new Cesium.Cartesian4() + ); + }, + shadowMap_texelSizeDepthBiasAndNormalShadingSmooth: () => { + this.shadowMap.update(Reflect.get(this.viewer.scene, "_frameState")); + const bias = this.shadowMap._pointBias; + const scratchTexelStepSize = new Cesium.Cartesian2(); + const texelStepSize = scratchTexelStepSize; + texelStepSize.x = 1.0 / this.shadowMap._textureSize.x; + texelStepSize.y = 1.0 / this.shadowMap._textureSize.y; - drawSketch() { - this.sketch = this.viewer.entities.add({ - name: 'sketch', - position: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), - orientation: Cesium.Transforms.headingPitchRollQuaternion( - Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), - Cesium.HeadingPitchRoll.fromDegrees(this.viewHeading - 90, this.viewPitch, 0.0) - ), - ellipsoid: { - radii: new Cesium.Cartesian3( - this.viewDistance, - this.viewDistance, - this.viewDistance - ), - // innerRadii: new Cesium.Cartesian3(2.0, 2.0, 2.0), - minimumClock: Cesium.Math.toRadians(-this.horizontalViewAngle / 2), - maximumClock: Cesium.Math.toRadians(this.horizontalViewAngle / 2), - minimumCone: Cesium.Math.toRadians(90 - (this.verticalViewAngle / 2)), - maximumCone: Cesium.Math.toRadians(90 + (this.verticalViewAngle / 2)), - fill: false, - outline: true, - subdivisions: 256, - stackPartitions: 64, - slicePartitions: 64, - outlineColor: Cesium.Color.YELLOWGREEN - } - }); + return Cesium.Cartesian4.fromElements( + texelStepSize.x, + texelStepSize.y, + bias.depthBias, + bias.normalShadingSmooth, + new Cesium.Cartesian4() + ); + }, + camera_projection_matrix: this.lightCamera.frustum.projectionMatrix, + camera_view_matrix: this.lightCamera.viewMatrix, + helsing_viewDistance: () => { + return this.viewDistance; + }, + helsing_visibleAreaColor: Cesium.Color.fromCssColorString(this.visibleAreaColor), + helsing_invisibleAreaColor: Cesium.Color.fromCssColorString(this.invisibleAreaColor), + } + }); + this.postStage = this.viewer.scene.postProcessStages.add(postStage); + } - this.frustumOutline = this.viewer.entities.add({ - name: 'sketch', - position: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), - orientation: Cesium.Transforms.headingPitchRollQuaternion( - Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), - Cesium.HeadingPitchRoll.fromDegrees(this.viewHeading - 90, this.viewPitch, 0.0) - ), - ellipsoid: { - radii: new Cesium.Cartesian3( - this.viewDistance, - this.viewDistance, - this.viewDistance - ), - innerRadii: new Cesium.Cartesian3(0.0001, 0.0001, 0.0001), - minimumClock: Cesium.Math.toRadians(-this.horizontalViewAngle / 2), - maximumClock: Cesium.Math.toRadians(this.horizontalViewAngle / 2), - minimumCone: Cesium.Math.toRadians(90 - (this.verticalViewAngle / 2)), - maximumCone: Cesium.Math.toRadians(90 + (this.verticalViewAngle / 2)), - fill: false, - outline: true, - subdivisions: 256, - stackPartitions: 1, - slicePartitions: 1, - outlineColor: Cesium.Color.YELLOWGREEN - } - }); + drawFrustumOutline() { + const scratchRight = new Cesium.Cartesian3(); + const scratchRotation = new Cesium.Matrix3(); + const scratchOrientation = new Cesium.Quaternion(); + const position = this.lightCamera.positionWC; + const direction = this.lightCamera.directionWC; + const up = this.lightCamera.upWC; + let right = this.lightCamera.rightWC; + right = Cesium.Cartesian3.negate(right, scratchRight); + let rotation = scratchRotation; + Cesium.Matrix3.setColumn(rotation, 0, right, rotation); + Cesium.Matrix3.setColumn(rotation, 1, up, rotation); + Cesium.Matrix3.setColumn(rotation, 2, direction, rotation); + let orientation = Cesium.Quaternion.fromRotationMatrix(rotation, scratchOrientation); - } + let instance = new Cesium.GeometryInstance({ + geometry: new Cesium.FrustumOutlineGeometry({ + frustum: this.lightCamera.frustum, + origin: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), + orientation: orientation + }), + id: Math.random().toString(36).substr(2), + attributes: { + color: Cesium.ColorGeometryInstanceAttribute.fromColor( + Cesium.Color.YELLOWGREEN//new Cesium.Color(0.0, 1.0, 0.0, 1.0) + ), + show: new Cesium.ShowGeometryInstanceAttribute(true) + } + }); + + this.frustumOutline = this.viewer.scene.primitives.add( + new Cesium.Primitive({ + geometryInstances: [instance], + appearance: new Cesium.PerInstanceColorAppearance({ + flat: true, + translucent: false + }) + }) + ); + } + + drawSketch() { + this.sketch = this.viewer.entities.add({ + name: 'sketch', + position: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), + orientation: Cesium.Transforms.headingPitchRollQuaternion( + Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), + Cesium.HeadingPitchRoll.fromDegrees(this.viewHeading - 90, this.viewPitch, 0.0) + ), + ellipsoid: { + radii: new Cesium.Cartesian3( + this.viewDistance, + this.viewDistance, + this.viewDistance + ), + // innerRadii: new Cesium.Cartesian3(2.0, 2.0, 2.0), + minimumClock: Cesium.Math.toRadians(-this.horizontalViewAngle / 2), + maximumClock: Cesium.Math.toRadians(this.horizontalViewAngle / 2), + minimumCone: Cesium.Math.toRadians(90 - (this.verticalViewAngle / 2)), + maximumCone: Cesium.Math.toRadians(90 + (this.verticalViewAngle / 2)), + fill: false, + outline: true, + subdivisions: 256, + stackPartitions: 64, + slicePartitions: 64, + outlineColor: Cesium.Color.YELLOWGREEN + } + }); + + this.frustumOutline = this.viewer.entities.add({ + name: 'sketch', + position: Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), + orientation: Cesium.Transforms.headingPitchRollQuaternion( + Cesium.Cartesian3.fromDegrees(this.options.viewPosition.lng, this.options.viewPosition.lat, this.options.viewPosition.alt + this.viewPointHeight), + Cesium.HeadingPitchRoll.fromDegrees(this.viewHeading - 90, this.viewPitch, 0.0) + ), + ellipsoid: { + radii: new Cesium.Cartesian3( + this.viewDistance, + this.viewDistance, + this.viewDistance + ), + innerRadii: new Cesium.Cartesian3(0.0001, 0.0001, 0.0001), + minimumClock: Cesium.Math.toRadians(-this.horizontalViewAngle / 2), + maximumClock: Cesium.Math.toRadians(this.horizontalViewAngle / 2), + minimumCone: Cesium.Math.toRadians(90 - (this.verticalViewAngle / 2)), + maximumCone: Cesium.Math.toRadians(90 + (this.verticalViewAngle / 2)), + fill: false, + outline: true, + subdivisions: 256, + stackPartitions: 1, + slicePartitions: 1, + outlineColor: Cesium.Color.YELLOWGREEN + } + }); + + } } function getHeading(fromPosition, toPosition) { - let finalPosition = new Cesium.Cartesian3(); - let matrix4 = Cesium.Transforms.eastNorthUpToFixedFrame(fromPosition); - Cesium.Matrix4.inverse(matrix4, matrix4); - Cesium.Matrix4.multiplyByPoint(matrix4, toPosition, finalPosition); - Cesium.Cartesian3.normalize(finalPosition, finalPosition); - return Cesium.Math.toDegrees(Math.atan2(finalPosition.x, finalPosition.y)); + let finalPosition = new Cesium.Cartesian3(); + let matrix4 = Cesium.Transforms.eastNorthUpToFixedFrame(fromPosition); + Cesium.Matrix4.inverse(matrix4, matrix4); + Cesium.Matrix4.multiplyByPoint(matrix4, toPosition, finalPosition); + Cesium.Cartesian3.normalize(finalPosition, finalPosition); + return Cesium.Math.toDegrees(Math.atan2(finalPosition.x, finalPosition.y)); } function getPitch(fromPosition, toPosition) { - let finalPosition = new Cesium.Cartesian3(); - let matrix4 = Cesium.Transforms.eastNorthUpToFixedFrame(fromPosition); - Cesium.Matrix4.inverse(matrix4, matrix4); - Cesium.Matrix4.multiplyByPoint(matrix4, toPosition, finalPosition); - Cesium.Cartesian3.normalize(finalPosition, finalPosition); - return Cesium.Math.toDegrees(Math.asin(finalPosition.z)); + let finalPosition = new Cesium.Cartesian3(); + let matrix4 = Cesium.Transforms.eastNorthUpToFixedFrame(fromPosition); + Cesium.Matrix4.inverse(matrix4, matrix4); + Cesium.Matrix4.multiplyByPoint(matrix4, toPosition, finalPosition); + Cesium.Cartesian3.normalize(finalPosition, finalPosition); + return Cesium.Math.toDegrees(Math.asin(finalPosition.z)); } -export default ViewShedStage; \ No newline at end of file +export default ViewShedStage; diff --git a/src/Obj/Analysis/Visibility/index.js b/src/Obj/Analysis/Visibility/index.js index 94bd6ac..9652b00 100644 --- a/src/Obj/Analysis/Visibility/index.js +++ b/src/Obj/Analysis/Visibility/index.js @@ -27,9 +27,11 @@ class VisibilityAnalysis extends Tools { this.viewPointHeight = options.viewPointHeight this.Dialog = _Dialog this._EventBinding = new EventBinding() + this.tools = new Tools(this.sdk) YJ.Analysis.AnalysesResults.push(this) // VisibilityAnalysis.edit(this) VisibilityAnalysis.create(this) + } get viewPointHeight() { @@ -182,29 +184,33 @@ class VisibilityAnalysis extends Tools { that.tip.setPosition(cartesian, movement.endPosition.x, movement.endPosition.y) }) that.event.mouse_right((movement, cartesian) => { - end() + that.end() }) that.event.gesture_pinck_start((movement, cartesian) => { let startTime = new Date() that.event.gesture_pinck_end(() => { let endTime = new Date() if (endTime - startTime >= 500) { - end() + that.end() } }) }) } else { - console.log('上一次测量未结束') + that.tools.message({ + text: '上一次测量未结束', + type: 'warning', + }); } - function end() { - YJ.Measure.SetMeasureStatus(false) - that.tip.destroy() - that.event.destroy() - that.tip = null - that.event = null - } + + } + end() { + YJ.Measure.SetMeasureStatus(false) + this.tip && this.tip.destroy() + this.event && this.event.destroy() + this.tip = null + this.event = null } // static update(that) { diff --git a/src/Obj/Base/Graffiti/index.js b/src/Obj/Base/Graffiti/index.js index cd603d8..540b315 100644 --- a/src/Obj/Base/Graffiti/index.js +++ b/src/Obj/Base/Graffiti/index.js @@ -5,6 +5,7 @@ import Draw from '../../../Draw/draw' import MouseTip from '../../../MouseTip' import MouseEvent from '../../../Event' import Dialog from '../../../BaseDialog'; +import Tools from "../../../Tools"; import EventBinding from '../../Element/Dialog/eventBinding'; import { html } from "./_element"; import { CameraController } from '../../../Global/global' @@ -12,7 +13,7 @@ import { CameraController } from '../../../Global/global' class Graffiti extends Draw { /** * @constructor - * @param sdk + * @param sdk * @description 涂鸦 * @param options {object} 线属性 * @param options.width=10{number} 宽度 @@ -23,6 +24,7 @@ class Graffiti extends Draw { this.options.width = options.width || 1 this.options.color = options.color || '#ff0000' this._elms = {}; + this.tools = new Tools(sdk) this._EventBinding = new EventBinding() Graffiti.edit(this, true) } @@ -31,7 +33,7 @@ class Graffiti extends Draw { return this.options.color } set color(v) { - if(!this.options.color) { + if (!this.options.color) { return } this.options.color = v @@ -69,14 +71,15 @@ class Graffiti extends Draw { // 编辑框 static async edit(that, state) { if (state) { - that._DialogObject = await new Dialog(that.sdk.viewer._container, { - title: '涂鸦参数', - }) - await that._DialogObject.init() - let contentElm = document.createElement('div'); - contentElm.innerHTML = html() - that._DialogObject.contentAppChild(contentElm) + // that._DialogObject = await new Dialog(that.sdk.viewer._container, { + // title: '涂鸦参数', + // }) + // await that._DialogObject.init() + // let contentElm = document.createElement('div'); + // contentElm.innerHTML = html() + // that._DialogObject.contentAppChild(contentElm) // 颜色组件 + let contentElm = document.getElementsByClassName('graffiti')[0] let colorPicker = new YJColorPicker({ el: contentElm.getElementsByClassName("color")[0], size: 'mini',//颜色box类型 @@ -91,20 +94,20 @@ class Graffiti extends Draw { that.color = 'rgba(255,255,255,1)' },//点击清空按钮事件回调 }) - that._DialogObject._element.body.className = that._DialogObject._element.body.className + ' graffiti' + // that._DialogObject._element.body.className = that._DialogObject._element.body.className + ' graffiti' let all_elm = contentElm.getElementsByTagName("*") that._EventBinding.on(that, all_elm) that._elms = that._EventBinding.element that._elms.color = [colorPicker] - let confirmBtn = document.createElement('button'); - confirmBtn.className = 'confirm'; - confirmBtn.innerHTML = '确认' - that._DialogObject.footAppChild(confirmBtn) - confirmBtn.addEventListener('click', () => { - that.start() - Graffiti.edit(that, false) - }); + // let confirmBtn = document.createElement('button'); + // confirmBtn.className = 'confirm'; + // confirmBtn.innerHTML = '确认' + // that._DialogObject.footAppChild(confirmBtn) + // confirmBtn.addEventListener('click', () => { + // that.start() + // Graffiti.edit(that, false) + // }); } else { if (that._DialogObject && that._DialogObject.close) { @@ -122,7 +125,7 @@ class Graffiti extends Draw { start() { let _this = this if (YJ.Measure.GetMeasureStatus()) { - console.log('上一次测量未结束') + this.tools.message({ type: 'warning', text: '上一次测量未结束' }) } else { let viewer = this.sdk.viewer CameraController(this.sdk, false) @@ -160,7 +163,7 @@ class Graffiti extends Draw { }) }) this.event.mouse_left_up((movement, cartesian) => { - polylineArray[polylineArray.length-1].polyline.positions = positions + polylineArray[polylineArray.length - 1].polyline.positions = positions this.event.mouse_move((movement, cartesian) => { this.tip.setPosition( cartesian, @@ -221,7 +224,7 @@ class Graffiti extends Draw { } } - flicker() {} + flicker() { } } export default Graffiti diff --git a/src/Obj/Base/RoutePlanning/index.js b/src/Obj/Base/RoutePlanning/index.js index 287475a..f277340 100644 --- a/src/Obj/Base/RoutePlanning/index.js +++ b/src/Obj/Base/RoutePlanning/index.js @@ -4,6 +4,7 @@ import Dialog from '../../../BaseDialog' import MouseEvent from '../../../Event/index' import MouseTip from '../../../MouseTip' import { html, css } from './_element' +import Tools from "../../../Tools"; class RoutePlanning extends Base { /** @@ -27,6 +28,7 @@ class RoutePlanning extends Base { lng: null, lat: null } + this.tools = new Tools(sdk) this.init() } @@ -43,11 +45,12 @@ class RoutePlanning extends Base { } else { this.startEntity.show = false } - + this.startEntity.position = new Cesium.CallbackProperty(() => { let pos = this.sdk.viewer.scene.clampToHeight( new Cesium.Cartesian3.fromDegrees(this.startLng, this.startLat) ) + this.clickCallBack({ start: pos, end: this.endEntity.position }) return pos }, false) this.startEntity.billboard = { @@ -73,6 +76,7 @@ class RoutePlanning extends Base { let pos = this.sdk.viewer.scene.clampToHeight( new Cesium.Cartesian3.fromDegrees(this.endLng, this.endLat) ) + this.clickCallBack({ start: this.startEntity.position, end: pos }) return pos }, false) this.endEntity.billboard = { @@ -82,10 +86,21 @@ class RoutePlanning extends Base { width: 32, height: 32 } - this.edit(true) + // this.edit(true) this.clear() } + get onEnd() { + return this.clickCallBack + } + set onEnd(val) { + if (val && typeof val !== 'function') { + console.error('val:', val, '不是一个function') + } else { + this.clickCallBack = val + } + } + get startLng() { return this.start.lng } @@ -253,7 +268,7 @@ class RoutePlanning extends Base { end: [this.endLng, this.endLat] }) } else { - console.error('请先设置起点和终点坐标！') + this.tools.message({ type: 'warning', text: '请先设置起点和终点坐标！' }) } }) div.appendChild(queryBtn) @@ -696,6 +711,6 @@ class RoutePlanning extends Base { } } - flicker() {} + flicker() { } } export default RoutePlanning diff --git a/static/custom/css/index.css b/static/custom/css/index.css index a1ffab6..67d9e20 100644 --- a/static/custom/css/index.css +++ b/static/custom/css/index.css @@ -883,51 +883,51 @@ } /* 飞行漫游 */ -.YJ-custom-base-dialog>.content .fly-roam { +.fly-roam>.content .fly-roam { width: 474px; } -.YJ-custom-base-dialog>.content .fly-roam .total-time { +.fly-roam>.content .total-time { margin-right: 5px; } -.YJ-custom-base-dialog>.content .fly-roam .table { +.fly-roam>.content .table { font-size: 12px; } -.YJ-custom-base-dialog>.content .fly-roam .table .table-body { +.fly-roam>.content .table .table-body { height: 220px; } -.YJ-custom-base-dialog>.content .fly-roam .table .tr .th:first-child, -.YJ-custom-base-dialog>.content .fly-roam .table .tr .td:first-child { +.fly-roam>.content .table .tr .th:first-child, +.fly-roam>.content .table .tr .td:first-child { flex: 0 0 95px; width: 95px; } -.YJ-custom-base-dialog>.content .fly-roam .table .tr .th:nth-child(2), -.YJ-custom-base-dialog>.content .fly-roam .table .tr .td:nth-child(2) { +.fly-roam>.content .table .tr .th:nth-child(2), +.fly-roam>.content .table .tr .td:nth-child(2) { flex: 0 0 240px; width: 240px; } -.YJ-custom-base-dialog>.content .fly-roam .table .tr .th:last-child, -.YJ-custom-base-dialog>.content .fly-roam .table .tr .td:last-child { +.fly-roam>.content .table .tr .th:last-child, +.fly-roam>.content .table .tr .td:last-child { flex: 0 0 140px; width: 140px; } -.YJ-custom-base-dialog>.content .fly-roam .table .table-body .tr.active { +.fly-roam>.content .table .table-body .tr.active { background: rgba(var(--color-sdk-base-rgb), 0.15); } -.YJ-custom-base-dialog>.content .fly-roam .table .table-body .tr:last-child { +.fly-roam>.content .table .table-body .tr:last-child { border: 1px solid rgba(var(--color-sdk-base-rgb), 0.5); border-left: none; border-right: none; } -.YJ-custom-base-dialog>.content .fly-roam .table .table-body .tr:last-child .input { +.fly-roam>.content .table .table-body .tr:last-child .input { color: #808080; cursor: no-drop; } @@ -940,26 +940,26 @@ border-color: rgba(var(--color-sdk-base-rgb), 0.5) !important; } */ -.YJ-custom-base-dialog>.content .fly-roam .table .action { +.fly-roam>.content .table .action { display: flex; justify-content: space-around; } -.YJ-custom-base-dialog>.content .fly-roam .table i { +.fly-roam>.content .table i { font-size: 18px; color: #409eff; cursor: pointer; } -.YJ-custom-base-dialog>.content .fly-roam .table i:hover { +.fly-roam>.content .table i:hover { color: #6bb4ff; } -.YJ-custom-base-dialog>.content .fly-roam .table i:active { +.fly-roam>.content .table i:active { color: #409eff; } -.YJ-custom-base-dialog>.content .fly-roam button { +.fly-roam>.content button { padding: 6px 14px; } @@ -2214,6 +2214,17 @@ .YJ-custom-base-dialog.cut-fill>.content>div .div-item:last-child .row .unit { margin-left: 5px; } +.YJ-custom-base-dialog.cut-fill>.content .firstTip { + position: absolute; + left: 340px; + top: 145px +} + +.YJ-custom-base-dialog.cut-fill>.content .endTip { + position: absolute; + top: 145px; + left: 515px +} /* 淹没分析 */ .YJ-custom-base-dialog.submerge>.content>div .row>.col { @@ -2267,6 +2278,17 @@ flex: 0 0 60px; justify-content: center; } +.YJ-custom-base-dialog.submerge>.content .rangeWords { + font-size: 14px; + font-weight: 500; + letter-spacing: 0px; + line-height: 24px; + color: rgba(230, 247, 255, 1); + text-align: right; + vertical-align: top; + width: 42px; + margin-left: 10px +} /* 地形分析 */ .YJ-custom-base-dialog.terrain-excavation>.content { @@ -2417,6 +2439,44 @@ .YJ-custom-base-dialog.circle-view-shed>.content { width: 290px; } +.YJ-custom-base-dialog.circle-view-shed>.content .firstTip { + font-size: 14px; + font-weight: 700; + letter-spacing: 0px; + line-height: 0px; + color: rgba(255, 255, 255, 1); + text-align: left; + vertical-align: top; + position: absolute; + left: 88px; + top: 145px +} + +.YJ-custom-base-dialog.circle-view-shed>.content .endTip { + font-size: 14px; + font-weight: 700; + letter-spacing: 0px; + line-height: 0px; + color: rgba(255, 255, 255, 1); + text-align: left; + vertical-align: top; + position: absolute; + left: 240px; + top: 145px; +} + +.el-popper.is-dark { + z-index: 1000000 !important +} + +.el-slider__button { + width: 16px; + height: 16px; +} + +.el-slider { + --el-slider-main-bg-color: rgba(var(--color-sdk-base-rgb), 1) +} /* 地形可视域分析 */ .YJ-custom-base-dialog.visibility>.content {