cesium 自定义气泡 类

        class CesiumPopupClass {
            constructor(viewer, options) {
                this.viewer = viewer
                this.position = options.position;
                this.options = this.extend({}, options);
                var popupContainer = document.createElement("div");
                popupContainer.classList.add('popup');
                var popupInner = '';
                popupContainer.innerHTML = popupInner;
                popupContainer.style.display = 'none';
                viewer.cesiumWidget.container.appendChild(popupContainer);
                popupContainer.style.cssText = "display: none;position: absolute;left: 0;top: 0;min-width: 200px;z-index:9999;";

                this.popupContainer = popupContainer;

                // 初始化  
                this.init();
            }
            init() {
                if (this.position) {
                    this.popupContainer.style.display = 'block'
                    this.renderListener = this.viewer.scene.postRender.addEventListener(this.render, this)
                }
            }
            render() {
                var ellipsoid = this.viewer.scene.globe.ellipsoid;
                var geometry = Cesium.Cartesian3.fromDegrees(
                    this.position[0],
                    this.position[1],
                    0,
                    ellipsoid
                );

                if (!geometry) return
                var position = Cesium.SceneTransforms.wgs84ToWindowCoordinates(this.viewer.scene, geometry)
                if (!position) {
                    return
                }
                if (this.popupContainer) {
                    this.popupContainer.style.left = position.x - this.popupContainer.offsetWidth / 2 + 'px'
                    this.popupContainer.style.top = position.y - this.popupContainer.offsetHeight - 10 + 'px'
                }
            }
            remove() {
                if (this.popupContainer) {
                    this.popupContainer.parentNode.removeChild(this.popupContainer)
                    this.popupContainer = null
                }

                if (this.renderListener) {
                    this.renderListener()
                    this.renderListener = null
                }

                if (this.viewer) {
                    this.viewer = null
                }
            }
            extend(obj, obj2) {
                for (var k in obj2) {
                    obj[k] = obj2[k];
                }
                return obj;
            }
        }

        let p1 = new CesiumPopupClass(viewer, {
            position: [112.57482863, 26.81853529]
        })
        let p2 = new CesiumPopupClass(viewer, {
            position: [112.57524924, 26.81874033]
        })
        p2.remove();

你可能感兴趣的:(前端,javascript,html)