nj_museum/public/package/js/label.js

class Label2D extends THREE.EventDispatcher {
    constructor(o = {}) {
        super()
        this.title = o.title
        this.position = o.position
        console.log(o);
        this.elem = $(`<div class="room-label ${o.labeltype ? o.labeltype : ''} ${o.posi == 'right' ? 'right' : ''}" >
        <a><p>
        <span>${o.title}</span>
        ${o.labeltype ? `
        <div class="sline"></div>
        <span class="enspan">${o.entitle}</span>` : ''}
        </p></a>
        
        ${o.labeltype ? `<div class="picdetail">
        <div class="header">
          <span>${o.title}</span>
          <img src="images/video.png" alt="">
        </div>
        <div class="pinfo">
          <img src="images/image_${o.imgsrc}.jpg" alt="">
          <p>${o.infodesc}</p>
        </div>
      </div>`: ''}
        </div>`);

        $(".widgets-doll-labels").append(this.elem)
        this.pos2d = new THREE.Vector3
        this.wenli = o.imgsrc

        this.elem.css({ position: 'absolute', 'z-index': 999 })
        this.clickFun = o.clickFun;
        this.clickFun && this.elem.on('click', this.clickFun.bind(this))

        {
            let update = (e) => {
                this.update(e)
            }
            viewer.addEventListener("view.changed", update)
            this.addEventListener('dispose', (e) => {
                viewer.removeEventListener("view.changed", update)
            })
        }
        this.visible = true
        this.shelterByModel = o.shelterByModel
        this.update()
    }




 
    update(e={}) {
        if (!this.position || !this.visible || !e.changeSlightly && this.sheltered) return
 

        var p = convertTool.getPos2d(this.position, viewer.camera, $("#player")[0]);
        if (!p || !p.trueSide) {
            this.elem.css('display', 'none'); return;
        }

        //判断label是否被模型遮挡，遮挡则消失(如果是漫游模式最好提前计算visiblePanos)

        if (e.changeSlightly) {//防卡： 画面要停止转动时才执行
            if (this.shelterByModel && convertTool.ifShelter(this.position, p.vector, viewer.camera, viewer.model.children, 0.05)) {
                this.sheltered = true
                this.elem.css('display', 'none'); return;
            }else{
                this.sheltered = false
            }
        } else {
            //console.log('！changeSlightly')
        }


        this.elem.css({
            left: p.pos.x + 'px',
            top: p.pos.y + 'px'
        })

        this.elem.css('display', 'block');
        this.pos2d = p.vector;
    }

    setVisible(visi, reason, level = 0, type) {
        convertTool.updateVisible(this, reason, visi, level, type)

        if (!this.visible) {
            this.elem.css('display', 'none');
        } else {
            this.update()
        }
    }

    setTitle(title) {
        this.title = title || ''
        this.elem.html(`<a><p><span>${this.title}</span></p></a>`)
    }

    setPos(pos) {
        this.position = pos;
        this.update()
    }

    dispose() {
        this.elem.remove();
        this.dispatchEvent({ type: 'dispose' })
        this._listeners = {}
        console.log('dispose')
    }


}