| this._renderRemoveCallback = scene.postRender.addEventListener(() => { | this._renderRemoveCallback = scene.postRender.addEventListener(() => { | ||||
| let cp = this._viewer.camera.positionWC | let cp = this._viewer.camera.positionWC | ||||
| let cd = this._viewer.camera.direction | let cd = this._viewer.camera.direction | ||||
| const offset = this._viewer.getOffset(); | |||||
| this.eachOverlay((item) => { | this.eachOverlay((item) => { | ||||
| if (item && item.position) { | if (item && item.position) { | ||||
| let position = Transform.transformWGS84ToCartesian(item.position) | let position = Transform.transformWGS84ToCartesian(item.position) | ||||
| scene, | scene, | ||||
| position | position | ||||
| ) | ) | ||||
| if (windowCoord) { | |||||
| windowCoord.x += offset.x; | |||||
| windowCoord.y += offset.y; | |||||
| } | |||||
| item._updateStyle( | item._updateStyle( | ||||
| windowCoord, | windowCoord, | ||||
| Cesium.Cartesian3.distance(position, cp), | Cesium.Cartesian3.distance(position, cp), |
| } | } | ||||
| this._delegate = Cesium.Viewer | this._delegate = Cesium.Viewer | ||||
| ? new Cesium.Viewer(id, { | ? new Cesium.Viewer(id, { | ||||
| ...DEF_OPTS, | |||||
| ...options, | |||||
| }) | |||||
| ...DEF_OPTS, | |||||
| ...options, | |||||
| }) | |||||
| : new CesiumViewer(id, { | : new CesiumViewer(id, { | ||||
| ...DEF_OPTS, | |||||
| ...options, | |||||
| }) // Initialize the viewer | |||||
| ...DEF_OPTS, | |||||
| ...options, | |||||
| }) // Initialize the viewer | |||||
| /** | /** | ||||
| * Registers events | * Registers events | ||||
| link.click() | link.click() | ||||
| return this | return this | ||||
| } | } | ||||
| getOffset() { | |||||
| const offset = { x: 0, y: 0 }; | |||||
| const container = this._delegate?.container; | |||||
| if (container) { | |||||
| if (container.getBoundingClientRect) { | |||||
| const rect = container.getBoundingClientRect(); | |||||
| offset.x = rect.left; | |||||
| offset.y = rect.top; | |||||
| } else { | |||||
| offset.x = container.offsetLeft; | |||||
| offset.y = container.offsetTop; | |||||
| } | |||||
| } | |||||
| return offset; | |||||
| } | |||||
| } | } | ||||
| export default Viewer | export default Viewer |
| * mount content | * mount content | ||||
| * @private | * @private | ||||
| */ | */ | ||||
| _mountContent() {} | |||||
| _mountContent() { } | |||||
| /** | /** | ||||
| * binds event | * binds event | ||||
| * @private | * @private | ||||
| */ | */ | ||||
| _bindEvent() {} | |||||
| _bindEvent() { } | |||||
| /** | /** | ||||
| * Unbinds event | * Unbinds event | ||||
| * @private | * @private | ||||
| */ | */ | ||||
| _unbindEvent() {} | |||||
| _unbindEvent() { } | |||||
| /** | /** | ||||
| * When enable modifies the hook executed, the subclass copies it as required | * When enable modifies the hook executed, the subclass copies it as required | ||||
| * @param windowCoord | * @param windowCoord | ||||
| * @private | * @private | ||||
| */ | */ | ||||
| _updateWindowCoord(windowCoord) {} | |||||
| _updateWindowCoord(windowCoord) { } | |||||
| /** | /** | ||||
| * Hook for installed | * Hook for installed | ||||
| * @private | * @private | ||||
| */ | */ | ||||
| _installHook() {} | |||||
| _installHook() { } | |||||
| /** | /** | ||||
| * Installs to viewer | * Installs to viewer | ||||
| `) | `) | ||||
| } | } | ||||
| getViewerOffset() { | |||||
| if (!this._viewer) { | |||||
| return { x: 0, y: 0 }; | |||||
| } | |||||
| return this._viewer.getOffset(); | |||||
| } | |||||
| /** | /** | ||||
| * Registers type | * Registers type | ||||
| * @param type | * @param type |
| * @private | * @private | ||||
| */ | */ | ||||
| _updateWindowCoord(windowCoord) { | _updateWindowCoord(windowCoord) { | ||||
| let visibility = this._ulEl.hasChildNodes() ? 'visible' : 'hidden' | |||||
| let visibility = this._ulEl.hasChildNodes() ? 'visible' : 'hidden'; | |||||
| let { x, y } = windowCoord; | |||||
| const offset = this.getViewerOffset(); | |||||
| x += offset.x; | |||||
| y += offset.y; | |||||
| this._wrapper.style.cssText = ` | this._wrapper.style.cssText = ` | ||||
| visibility:${visibility}; | visibility:${visibility}; | ||||
| z-index:1; | z-index:1; | ||||
| transform:translate3d(${Math.round(windowCoord.x)}px,${Math.round( | |||||
| windowCoord.y | |||||
| transform:translate3d(${Math.round(x)}px,${Math.round( | |||||
| y | |||||
| )}px, 0); | )}px, 0); | ||||
| ` | ` | ||||
| } | } |
| x = windowCoord.x | x = windowCoord.x | ||||
| y = windowCoord.y | y = windowCoord.y | ||||
| } | } | ||||
| const offset = this.getViewerOffset(); | |||||
| x += offset.x; | |||||
| y += offset.y; | |||||
| this._wrapper.style.cssText = ` | this._wrapper.style.cssText = ` | ||||
| visibility:visible; | visibility:visible; |
| */ | */ | ||||
| _updateWindowCoord(windowCoord) { | _updateWindowCoord(windowCoord) { | ||||
| let x = windowCoord.x + 10 | let x = windowCoord.x + 10 | ||||
| let y = windowCoord.y - this._wrapper.offsetHeight / 2 | |||||
| let y = windowCoord.y - this._wrapper.offsetHeight / 2; | |||||
| const offset = this.getViewerOffset(); | |||||
| x += offset.x; | |||||
| y += offset.y; | |||||
| this._wrapper.style.cssText = ` | this._wrapper.style.cssText = ` | ||||
| visibility:visible; | visibility:visible; | ||||
| z-index:1; | z-index:1; |