label.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. class Label2D extends THREE.EventDispatcher {
  2. constructor(o = {}) {
  3. super()
  4. this.title = o.title
  5. this.position = o.position
  6. console.log(o);
  7. this.elem = $(`<div class="room-label ${o.labeltype ? o.labeltype : ''} ${o.posi == 'right' ? 'right' : ''}" >
  8. <a><p>
  9. <span>${o.title}</span>
  10. ${o.labeltype ? `
  11. <div class="sline"></div>
  12. <span class="enspan">${o.entitle}</span>` : ''}
  13. </p></a>
  14. ${o.labeltype ? `<div class="picdetail">
  15. <div class="header">
  16. <span>${o.title}</span>
  17. <img src="images/video.png" alt="">
  18. </div>
  19. <div class="pinfo">
  20. <img src="images/image_${o.imgsrc}.jpg" alt="">
  21. <p>${o.infodesc}</p>
  22. </div>
  23. </div>`: ''}
  24. </div>`);
  25. $(".widgets-doll-labels").append(this.elem)
  26. this.pos2d = new THREE.Vector3
  27. this.wenli = o.imgsrc
  28. this.elem.css({ position: 'absolute', 'z-index': 999 })
  29. this.clickFun = o.clickFun;
  30. this.clickFun && this.elem.on('click', this.clickFun.bind(this))
  31. {
  32. let update = (e) => {
  33. this.update(e)
  34. }
  35. let updateShelter = ()=>{
  36. if (this.shelterByModel){
  37. if (convertTool.ifShelter(this.position, this.pos2d, viewer.camera, viewer.model.children, 0.05)) {
  38. this.sheltered = true
  39. this.elem.css('display', 'none');
  40. }else{
  41. this.sheltered = false
  42. this.update()
  43. }
  44. }
  45. }
  46. viewer.addEventListener("view.changed", update)
  47. viewer.addEventListener("delayUpdate", updateShelter)
  48. this.addEventListener('dispose', (e) => {
  49. viewer.removeEventListener("view.changed", update)
  50. viewer.removeEventListener("delayUpdate", updateShelter)
  51. })
  52. }
  53. this.visible = true
  54. this.shelterByModel = o.shelterByModel
  55. this.update()
  56. }
  57. updateShelter
  58. update(e={}) {
  59. if (!this.position || !this.visible || this.sheltered) return
  60. var p = convertTool.getPos2d(this.position, viewer.camera, $("#player")[0]);
  61. this.pos2d = p.vector;
  62. if (!p || !p.trueSide) {
  63. this.elem.css('display', 'none'); return;
  64. }
  65. //判断label是否被模型遮挡,遮挡则消失(如果是漫游模式最好提前计算visiblePanos)
  66. /* if (e.changeSlightly) {//防卡: 画面要停止转动时才执行
  67. if (this.shelterByModel && convertTool.ifShelter(this.position, p.vector, viewer.camera, viewer.model.children, 0.05)) {
  68. this.sheltered = true
  69. this.elem.css('display', 'none'); return;
  70. }else{
  71. this.sheltered = false
  72. }
  73. } else {
  74. //console.log('!changeSlightly')
  75. } */
  76. this.elem.css({
  77. left: p.pos.x + 'px',
  78. top: p.pos.y + 'px'
  79. })
  80. this.elem.css('display', 'block');
  81. }
  82. setVisible(visi, reason, level = 0, type) {
  83. convertTool.updateVisible(this, reason, visi, level, type)
  84. if (!this.visible) {
  85. this.elem.css('display', 'none');
  86. } else {
  87. this.update()
  88. }
  89. }
  90. setTitle(title) {
  91. this.title = title || ''
  92. this.elem.html(`<a><p><span>${this.title}</span></p></a>`)
  93. }
  94. setPos(pos) {
  95. this.position = pos;
  96. this.update()
  97. }
  98. dispose() {
  99. this.elem.remove();
  100. this.dispatchEvent({ type: 'dispose' })
  101. this._listeners = {}
  102. console.log('dispose')
  103. }
  104. }