| | |
| | | * |
| | | */ |
| | | constructor(viewer, popup) { |
| | | this._viewer = viewer |
| | | this._popup = popup |
| | | this._position = popup.position |
| | | this._title = popup.title |
| | | this._content = popup.content |
| | | this.appendPopup() |
| | | this._viewer = viewer; |
| | | this._popup = popup; |
| | | this._position = popup.position; |
| | | this._title = popup.title; |
| | | this._content = popup.content; |
| | | this.appendPopup(); |
| | | this.isOpen = true; |
| | | } |
| | | |
| | | get viewer() { |
| | |
| | | |
| | | // 创建元素并追加 |
| | | createVideoWindowAll(id, className, position) { |
| | | let dom = document.getElementById('mobile-map_popup_content'); |
| | | dom.style.display = 'block'; |
| | | |
| | | var childs = document.getElementById('mobile-map_popup_content').getElementsByTagName('div') |
| | | |
| | | if (childs.length > 0) { |
| | |
| | | |
| | | var el = $("<div class=''></div>") |
| | | |
| | | // var divBig = $("<div style='width: 100%; height: 100%;' class=''></div>") |
| | | |
| | | // var divForms = $("<div class='divForms divForms-theme'></div>") |
| | | |
| | | // var divFormsWrap = $("<div class='divForms-wrap'></div>") |
| | | |
| | | // var area = $("<div class='area'></div>") |
| | | |
| | | // var arrowLt = $("<div class='arrow-lt'></div>") |
| | | // var bT = $("<div class='b-t'></div>") |
| | | // var bR = $("<div class='b-r'></div>") |
| | | // var bB = $("<div class='b-b'></div>") |
| | | // var bL = $("<div class='b-l'></div>") |
| | | // var arrowRb = $("<div class='arrow-rb'></div>") |
| | | |
| | | // var labelWrap = $("<div class='label-wrap'></div>") |
| | | var titleDiv = $("<div class='mobiletitle'></div>").text(this._title) |
| | | var labelContent = $("<div class='mobilelabel-content'></div>").append(this._content) |
| | | |
| | | // var titleDiv = $("<div class='mobiletitle'>楼</div>") |
| | | // var labelContent = $("<div class='mobilelabel-content'>内容</div>") |
| | | |
| | | // labelWrap.append(titleDiv) |
| | | // labelWrap.append(labelContent) |
| | | |
| | | // var bTL = $("<div class='b-t-l'></div>") |
| | | // var bBR = $("<div class='b-b-r'></div>") |
| | | |
| | | // var arrow = $("<div class='arrow'></div>") |
| | | |
| | | // area.append(arrowLt) |
| | | // area.append(bT) |
| | | // area.append(bR) |
| | | // area.append(bB) |
| | | // area.append(bL) |
| | | // area.append(arrowRb) |
| | | // area.append(labelWrap) |
| | | |
| | | // divFormsWrap.append(area) |
| | | // divFormsWrap.append(bTL) |
| | | // divFormsWrap.append(bBR) |
| | | |
| | | // divForms.append(divFormsWrap) |
| | | // divForms.append(arrow) |
| | | |
| | | // divBig.append(divForms) |
| | | // el.append(divBig) |
| | | el.append(titleDiv) |
| | | el.append(labelContent) |
| | | |
| | |
| | | $('#mobile-map_popup_content').append(el) |
| | | |
| | | this._viewer.scene.postRender.addEventListener(function () { |
| | | if (!self.isOpen) { |
| | | return; |
| | | } |
| | | const windowCoord = DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates( |
| | | self._viewer.scene, |
| | | position |
| | |
| | | } |
| | | |
| | | positionPopUp(windowCoord, id) { |
| | | if (!windowCoord) { |
| | | return; |
| | | } |
| | | const wx = document.getElementById('app').clientWidth; |
| | | const x = windowCoord.x - (wx / 100 * 35); |
| | | const y = windowCoord.y - document.getElementById(id).offsetHeight - 15; |
| | |
| | | transform:translate3d(${Math.round(x)}px,${Math.round(y)}px, 0); |
| | | ` |
| | | } |
| | | closeOur() { |
| | | this.isOpen = false; |
| | | let dom = document.getElementById('mobile-map_popup_content'); |
| | | dom.style.display = 'none'; |
| | | // var childs = document.getElementById('mobile-map_popup_content').getElementsByTagName('div') |
| | | |
| | | // if (childs.length > 0) { |
| | | // for (var i = 0; i < childs.length; i++) { |
| | | // document.getElementById('mobile-map_popup_content').removeChild(childs[i]) |
| | | // } |
| | | // } |
| | | } |
| | | } |
| | | |
| | | export default mobileDivForms |