sdk4.0/src/Obj/Base/BillboardObject/index.js

/**
 * 点
 */
import { getHost, getToken } from "../../../on";
import Dialog from '../../Element/Dialog'
import EventBinding from '../../Element/Dialog/eventBinding'
import cy_slider from '../../Element/cy_html_slider'
import cy_tabs from '../../Element/cy_html_tabs'
import richText from '../../Element/richText'
import { html } from './_element'
import Base from '../index'
import MouseEvent from '../../../Event/index'
import {
  addCluster,
  remove_entity_from_cluster
} from '../../../Global/cluster/cluster'
import CircleDiffuse from '../CircleDiffuse'
import RadarScan from '../RadarScan'
import { syncData } from '../../../Global/MultiViewportMode'
import {
  getBillboardDefaultUrl,
  setBillboardDefaultUrl,
  getGroundCover
} from '../../../Global/global'
import { Proj } from '../../../Tools/proj'
import { legp } from '../../Element/datalist'
import { getFontList, getFontFamily, getFontFamilyName } from '../../Element/fontSelect'
import MouseTip from '../../../MouseTip'
import {
  setSplitDirection,
  syncSplitData,
  setActiveId
} from '../../../Global/SplitScreen'
import {
  setActiveViewer,
  closeRotateAround,
  closeViewFollow
} from '../../../Global/global'

import { getGoodsList } from '../../../Tools/getGoodsList'

class BillboardObject extends Base {
  /**
   * @constructor
   * @description 创建点标注
   * @param sdk {object} sdk
   * @param options {object} 标注参数
   * @param options.id {string} 标注id
   * @param {object} options.positions 位置
   * @param {number} options.positions.lng 经度
   * @param {number} options.positions.lat 纬度
   * @param {number} options.positions.alt 高度
   * @param {number} options.heightMode=3 高度模式（0：海拔高度；1：相对地表；2：依附地表; 3：依附模型）
   * @param [options.scaleByDistance=true] {boolean} 图标是否跟随视角变化进行字段缩放
   * @param [options.show=true] {boolean} 标注整体的显示/隐藏
   * @param [options.near=2000] {number} 近端可视距离 scaleByDistance为true时生效
   * @param [options.far=100000]  {number} 远端可视距离 scaleByDistance为true时生效
   * @param options.billboard {object} 标注中图标的参数
   * @param [options.billboard.show=true] {boolean} 标注中图标的显示与隐藏
   * @param options.billboard.image {string} 图标路径
   * @param options.billboard.defaultImage {string} 默认图标的唯一标识
   * @param [options.billboard.scale=3] {number} 图标倍数
   *@param options.label {object} 标注文字的参数
   *@param [options.label.text] {string} 标注中文字
   *@param [options.label.show=true] {boolean} 标注文字显示/隐藏
   *@param [options.label.fontFamily=0] {number} 标注文字字体 0：黑体；1：思源黑体；2：庞门正道标题体；3：数黑体
   *@param [options.label.fontSize=39] {number} 标注文字大小 单位px，微软雅黑
   *@param [options.label.color=#00ffff] {string} 标注文字颜色
   *@param _Dialog {object} 弹框事件
   *@param _Dialog.confirmCallBack {function} 弹框确认时的回调
   *@param _Dialog.instructSubmit(id,name,instruct) {function} 提交指令（ID, 名称，指令内容）
   *@param _Dialog.operatingPointSubmit(id,name,operatingPoint) {function} 设置操作点（ID, 名称，操作点内容）
   * */
  constructor(sdk, options = {}, _Dialog = {}) {
    super(sdk, options)
    this.options.near = options.near || options.near === 0 ? options.near : 2000
    this.options.far = options.far || options.far === 0 ? options.far : 100000
    this.options.scaleByDistance =
      options.scaleByDistance || options.scaleByDistance === false
        ? options.scaleByDistance
        : true
    this.options.show =
      options.show || options.show === false ? options.show : true
    this.options.heightMode =
      options.heightMode || options.heightMode == 0 ? options.heightMode : 3
    this.options.billboard = options.billboard = options.billboard || {}
    this.options.billboard.isSelect = options.billboard.isSelect || false
    this.options.billboard.show =
      options.billboard.show || options.billboard.show === false
        ? options.billboard.show
        : true
    this.options.billboard.image =
      options.billboard.image ||
      getBillboardDefaultUrl(options.billboard.defaultImage) || this.getSourceRootPath() + '/img/A-ablu-blank.png'
    this.options.billboard.defaultImage = options.billboard.defaultImage
    this.options.billboard.scale =
      options.billboard.scale || options.billboard.scale === 0
        ? options.billboard.scale
        : 3
    options.label = options.label || {}
    this.options.label = options.label || {}
    this.options.label.text = options.label.text || this.options.name
    this.options.name = this.options.label.text
    this.options.label.show =
      options.label.show || options.label.show === false
        ? options.label.show
        : true
    this.options.label.fontFamily = options.label.fontFamily || 0
    this.options.label.fontSize = options.label.fontSize || 39
    this.options.label.color = options.label.color || '#00ffff'
    this.options.positions = options.positions = options.positions || {}
    this.options.positions.lng = Number(
      Number(options.positions.lng || 0).toFixed(8)
    )
    this.options.positions.lat = Number(
      Number(options.positions.lat || 0).toFixed(8)
    )
    this.options.positions.alt = Number(
      Number(options.positions.alt || 0).toFixed(2)
    )
    // this.options.diffuseShow = options.diffuseShow || false
    // this.options.diffuseRadius = (options.diffuseRadius || options.diffuseRadius === 0) ? options.diffuseRadius : 10
    // this.options.diffuseDuration = (options.diffuseDuration || options.diffuseDuration === 0) ? options.diffuseDuration : 2000
    // this.options.diffuseColor = options.diffuseColor || "#FF0000"
    // this.options.scanShow = options.scanShow || false
    // this.options.scanRadius = (options.scanRadius || options.scanRadius === 0) ? options.scanRadius : 10
    // this.options.scanDuration = (options.scanDuration || options.scanDuration === 0) ? options.scanDuration : 2000
    // this.options.scanColor = options.scanColor || "#FF0000"
    this.options.instruct = options.instruct || ''
    this.options.operatingPoint = options.operatingPoint || ''
    this.options.attribute = options.attribute || {}
    this.options.attribute.link = this.options.attribute.link || {}
    this.options.attribute.link.content =
      this.options.attribute.link.content || []
    this.options.attribute.vr = this.options.attribute.vr || {}
    this.options.attribute.vr.content = this.options.attribute.vr.content || []
    this.options.attribute.camera = this.options.attribute.camera || {}
    this.options.attribute.camera.content =
      this.options.attribute.camera.content || []
    this.options.attribute.ISC = this.options.attribute.ISC || {}
    this.options.attribute.ISC.content =
      this.options.attribute.ISC.content || []
    this.options.attribute.goods = this.options.attribute.goods || {}
    this.options.attribute.goods.content =
      this.options.attribute.goods.content || []
    this.options.attributeType = options.attributeType || 'richText'
    this.options.coordinate = options.coordinate || ''
    this.operate = {}
    this._elms = {}
    this.previous = {
      positions: { ...this.options.positions }
    }
    this.entity
    this._proj = this.sdk.proj




    // // 验证物资
    // let goodsContent = []
    // if(options.attribute && options.attribute.goods && options.attribute.goods.content && Array.isArray(options.attribute.goods.content)) {
    //   goodsContent = [...options.attribute.goods.content]
    // }
    // this.options.attribute.goods.content = []
    // if (goodsContent.length > 0) {
    //   getGoodsList().then((list)=>{
    //     for (let i = goodsContent.length-1; i >= 0; i--) {
    //       let falg = false
    //       for (let j = 0; j < list.length; j++) {
    //         if (goodsContent[i].ID === list[j].ID) {
    //           falg = true
    //           break
    //         }
    //       }
    //       if(!falg) {
    //         goodsContent.splice(i, 1)
    //       }
    //     }
    //     this.options.attribute.goods.content = [...goodsContent]
    //   })
    // }






    this.sdk.addIncetance(this.options.id, this)
    BillboardObject.create(this)
    this.picking = true

    this.Dialog = _Dialog
    this._EventBinding = new EventBinding()
    // this.Dialog.instructSubmit = () => {
    //   alert(6)
    // }
  }

  get type() {
    return 'BillboardObject'
  }

  static create(that) {
    let canvas
    let billboardH = 36
    let heightMode
    let positions = that.options.positions
    that.originalOptions = that.deepCopyObj(that.options)
    let isGlf = false
    let superGif
    let index = 0

    let font = getFontFamily(that.labelFontFamily) || 'Helvetica'
    let url = that.replaceHost(that.options.billboard.image, that.options.host)
    that._frameImages = []
    if (url && url.endsWith('gif')) {
      isGlf = true
      switch (that.options.heightMode) {
        case 2:
        case '2':
          heightMode = Cesium.HeightReference.CLAMP_TO_GROUND
          break
      }

      let gifImg = document.createElement('img')
      gifImg.setAttribute('rel:animated_src', url)
      gifImg.setAttribute('rel:auto_play', '1')
      const imgDiv = document.createElement('div')
      imgDiv.appendChild(gifImg)
      let id = Cesium.createGuid()
      superGif = new SuperGif({ gif: gifImg })
      that._superGif = superGif
      that._superGif.id = id  // 自定义id，用于判断gif实例是否改变

      superGif.load(function (status) {
        if (status == 404) {
          canvas = document.createElement('canvas')
          canvas.width = 0
          canvas.height = 0
          billboardH = 0
          if (that.entity) {
            that.entity.billboard.imgWidth = 0
            that.entity.billboard.imgHeight = 0
            that.entity.billboard.image = canvas
            addCluster(that.sdk, that.entity)
          }
          return
        }
        if (that._superGif.id != id) {
          return
        }
        let length = superGif.get_length()
        for (let i = 1; i <= length; i++) {
          superGif.move_to(i)
          that._frameImages.push(superGif.get_canvas().toDataURL())
        }
        canvas = superGif.get_canvas()
        let width = canvas.width
        let height = canvas.height
        billboardH = height * (31 / width)
        if (that.entity) {
          that.entity.billboard.imgWidth = width
          that.entity.billboard.imgHeight = height
          that.entity.billboard.image = new Cesium.CallbackProperty(() => {
            let img = that._frameImages[index]
            index = index >= that._frameImages.length - 1 ? 0 : index + 1
            return img
          }, false)
          addCluster(that.sdk, that.entity)
        }
      })
    }
    else {
      let image = new Image()
      image.src =
        url ||
        that.getSourceRootPath() + '/img/A-ablu-blank.png'
      switch (that.options.heightMode) {
        case 2:
        case '2':
          heightMode = Cesium.HeightReference.CLAMP_TO_GROUND
          break
      }
      canvas = document.createElement('canvas')
      image.onload = function () {
        let ratio = image.width / image.height
        image.width = 100
        image.height = 100 / ratio
        let width = image.width
        let height = image.height
        const ctx = canvas.getContext('2d', { willReadFrequently: true })
        canvas.width = width
        canvas.height = height
        ctx.drawImage(image, 0, 0, width, height)
        billboardH = height * (31 / width)
        if (that.entity) {
          that.entity.billboard.imgWidth = width
          that.entity.billboard.imgHeight = height
          that.entity.billboard.image = canvas
          addCluster(that.sdk, that.entity)
        }
      }
      image.onerror = function (err) {
        canvas.width = 0
        canvas.height = 0
        billboardH = 0
        if (that.entity) {
          that.entity.billboard.imgWidth = 0
          that.entity.billboard.imgHeight = 0
          that.entity.billboard.image = canvas
          addCluster(that.sdk, that.entity)
        }
      };
    }

    that.entity = new Cesium.Entity({
      show: that.options.show,
      id: that.options.id,
      position: Cesium.Cartesian3.fromDegrees(
        positions.lng,
        positions.lat,
        positions.alt
      ),
      billboard: {
        image: isGlf ? new Cesium.CallbackProperty(() => {
          let img = that._frameImages[index]
          index = index >= that._frameImages.length - 1 ? 0 : index + 1
          return img
        }, false) : canvas,
        scale: that.options.billboard.scale,
        disableDepthTestDistance: new Cesium.CallbackProperty(function () {
          return getGroundCover() ? undefined : Number.POSITIVE_INFINITY
        }, false),
        heightReference: heightMode,
        color: that.options.billboard.show
          ? undefined
          : new Cesium.Color(1.0, 1.0, 1.0, 0),
        width: 31,
        height: new Cesium.CallbackProperty(function () {
          return billboardH
        }, false),
        verticalOrigin: Cesium.VerticalOrigin.BOTTOM
        // pixelOffset: new Cesium.CallbackProperty(function () {
        //   return new Cesium.Cartesian2(
        //     0,
        //     -(billboardH / 2) * that.options.billboard.scale
        //   )
        // }, false)
      },
      label: {
        show: that.options.label.show,
        text: that.options.label.text,
        disableDepthTestDistance: new Cesium.CallbackProperty(function () {
          return getGroundCover() ? undefined : Number.POSITIVE_INFINITY
        }, false),
        heightReference: heightMode,
        font: that.options.label.fontSize + 'px ' + font,
        fillColor: Cesium.Color.fromCssColorString(that.options.label.color),
        // verticalOrigin : Cesium.VerticalOrigin.BOTTOM,
        pixelOffset: new Cesium.CallbackProperty(function () {
          if (that.options.billboard.show) {
            return new Cesium.Cartesian2(
              0,
              -billboardH * that.options.billboard.scale -
              that.options.label.fontSize / 2 -
              5
            )
          } else {
            return new Cesium.Cartesian2(
              0,
              -that.options.label.fontSize / 2 - 5
            )
          }
        }, false),
        outlineColor: Cesium.Color.BLACK,
        outlineWidth: 1,
        style: Cesium.LabelStyle.FILL_AND_OUTLINE
      }
    })
    that.entity.billboard.imgWidth = 31
    that.entity.billboard.imgHeight = 36
    that.entity.position = Cesium.Cartesian3.fromDegrees(
      positions.lng,
      positions.lat,
      positions.alt
    )
    if (that.options.heightMode == 3) {
      that.updateHeight()
    }

    that.renewPoint()
    // that.diffuseShow = that.options.diffuseShow
    // that.scanShow = that.options.scanShow
    syncData(that.sdk, that.options.id)
    if (that.options.show) {
      setSplitDirection(0, that.options.id)
    }
    if (that.options.billboard.isSelect) {
      that.selectBillboard()
    }
  }
  // 选中效果
  selectBillboard() {
    let that = this
    this.sdk.viewer.screenSpaceEventHandler.setInputAction(function (click) {
      var pickedObject = that.sdk.viewer.scene.pick(click.position)
      if (
        Cesium.defined(pickedObject) &&
        pickedObject.id &&
        pickedObject.id.id === 'airportBillboard'
      ) {
        if (that.entity.billboard) {
          // 如果点击的是Billboard，给它添加选中效果
          that.entity.billboard.color = Cesium.Color.YELLOW // 改变颜色
        }
        // 可以添加更多选中效果，例如边框等
      } else {
        if (that.entity.billboard) {
          that.entity.billboard.color = Cesium.Color.WHITE
        }
      }
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
  }
  get attributeSelect() {
    return [
      {
        name: '富文本',
        value: '富文本',
        key: 'richText'
      },
      {
        name: '链接',
        value: '链接',
        key: 'link'
      },
      // {
      //   name: 'IP摄像头',
      //   value: 'IP摄像头',
      //   key: 'camera'
      // },
      // {
      //   name: 'ISC摄像头',
      //   value: 'ISC摄像头',
      //   key: 'isc'
      // },
      // {
      //   name: '传感器',
      //   value: '传感器',
      //   key: 'sensor'
      // },
      // {
      //   name: '全景图',
      //   value: '全景图',
      //   key: 'vr'
      // },
      // {
      //   name: '物资',
      //   value: '物资',
      //   key: 'goods'
      // }
    ]
  }

  get show() {
    return this.options.show
  }
  set show(v) {
    if(!this.isShowView) {
      this.options.show = v
      this.originalOptions.show = v
    }
    if(!this.showView || this.showView == 3) {
      this.entity && (this.entity.show = this.options.show)
    }
    else {
      this.entity && (this.entity.show = false)
    }
    syncData(this.sdk, this.options.id)
    syncSplitData(this.sdk, this.options.id)

    if (this._DialogObject && this._DialogObject.showBtn) {
      this._DialogObject.showBtn.checked = this.options.show
    }

    this.isShowView = false
    // if (v) {
    //   if (this.diffuseShow) {
    //     this.diffuseShow = true
    //   }
    //   if (this.scanShow) {
    //     this.scanShow = true
    //   }
    // }
    // else {
    //   if (this.diffuse) {
    //     this.diffuse.show = v
    //   }
    //   if (this.scan) {
    //     this.scan.show = v
    //   }
    // }
  }

  get heightMode() {
    return this.options.heightMode ? this.options.heightMode : 0
  }
  set heightMode(v) {
    this.options.heightMode = v ? v : 0
    this.options.heightMode = v || v == 0 ? v : 3
    let heightMode
    let heightModeName = ''
    let altBoxElm
    if (
      this._DialogObject &&
      this._DialogObject._element &&
      this._DialogObject._element.content
    ) {
      altBoxElm = this._DialogObject._element.content.getElementsByClassName(
        'alt-box'
      )[0]
    }
    switch (this.options.heightMode) {
      case '0':
      case 0:
        altBoxElm &&
          (altBoxElm.className = 'input-number input-number-unit-1 alt-box')
        this._elms.height && (this._elms.height.style.display = 'flex')
        heightMode = Cesium.HeightReference.NONE
        heightModeName = '海拔高度'
        break
      case '1':
      case 1:
        altBoxElm &&
          (altBoxElm.className = 'input-number input-number-unit-1 alt-box')
        this._elms.height && (this._elms.height.style.display = 'flex')
        heightMode = Cesium.HeightReference.NONE
        heightModeName = '相对地表'
        break
      case '2':
      case 2:
        altBoxElm &&
          (altBoxElm.className =
            'input-number input-number-unit-1 alt-box disabled')
        heightModeName = '依附地表'
        altBoxElm &&
          (altBoxElm.className =
            'input-number input-number-unit-1 alt-box disabled')
        heightModeName = '依附地表'
        heightMode = Cesium.HeightReference.CLAMP_TO_GROUND
        this._elms.height && (this._elms.height.style.display = 'none')
        break
      case '3':
      case 3:
        altBoxElm &&
          (altBoxElm.className =
            'input-number input-number-unit-1 alt-box disabled')
        this._elms.height && (this._elms.height.style.display = 'none')
        heightMode = Cesium.HeightReference.NONE
        heightModeName = '依附模型'
        break
    }
    if (this.entity) {
      this.entity.billboard.heightReference = heightMode
      this.entity.label.heightReference = heightMode
    }
    this._elms.heightMode && (this._elms.heightMode.value = heightModeName)
  }

  get labelText() {
    return this.options.label.text
  }
  set labelText(v) {
    this.options.label.text = v
    this.options.name = v
    this.entity && (this.entity.label.text = v + '')
    this._elms.labelText &&
      this._elms.labelText.forEach(item => {
        item.value = v
      })
  }

  get lng() {
    return this.options.positions.lng
  }
  set lng(v) {
    this.options.positions.lng = Number(Number(v).toFixed(8))
    // this.scan && (this.scan.lng = v)
    // this.diffuse && (this.diffuse.lng = v)
    this.renewPoint()
    this.coordinate = this.options.coordinate
    this._projConvert && this._projConvert()
    this._elms.lng &&
      this._elms.lng.forEach(item => {
        item.value = v
      })
  }

  get lat() {
    return this.options.positions.lat
  }
  set lat(v) {
    this.options.positions.lat = Number(Number(v).toFixed(8))
    // this.scan && (this.scan.lat = v)
    // this.diffuse && (this.diffuse.lat = v)
    this.renewPoint()
    this.coordinate = this.options.coordinate
    this._projConvert && this._projConvert()
    this._elms.lat &&
      this._elms.lat.forEach(item => {
        item.value = v
      })
  }

  get alt() {
    return this.options.positions.alt
  }
  set alt(v) {
    this.options.positions.alt = Number(Number(v).toFixed(2))
    // this.scan && (this.scan.alt = v)
    // this.diffuse && (this.diffuse.alt = v)
    this.renewPoint()
    this.coordinate = this.options.coordinate
    this._elms.alt &&
      this._elms.alt.forEach(item => {
        item.value = this.options.positions.alt
      })

    if (this._elms.height) {
      let heightElm = this._elms.height.getElementsByClassName('height')[0]
      if (heightElm) {
        switch (this._elms.heightMode.value) {
          case '海拔高度':
            heightElm.value = this.options.positions.alt
            break
          // case '相对高度':
          //   this.getClampToHeight(this.options.positions).then(h => {
          //     heightElm.value = Number(
          //       (this.options.positions.alt - h).toFixed(2)
          //     )
          //   })
          //   break
          case '相对地表':
            if (this.sdk.viewer.scene.terrainProvider.availability) {
              Cesium.sampleTerrainMostDetailed(
                this.sdk.viewer.scene.terrainProvider,
                [
                  Cesium.Cartographic.fromDegrees(
                    this.options.positions.lng,
                    this.options.positions.lat
                  )
                ]
              ).then(position => {
                heightElm.value = Number(
                  (this.options.positions.alt - position[0].height).toFixed(2)
                )
              })
            } else {
              heightElm.value = Number(
                Number(this.options.positions.alt).toFixed(2)
              )
            }
            break
          case '依附地表':
          case '依附地表':
            break
          case '依附模型':
            this.updateHeight()
            break
        }
      }
    }
  }

  get near() {
    return this.options.near
  }
  set near(v) {
    let near = v
    if (near > this.far) {
      near = this.far
    }
    this.options.near = near
    this.renewPoint()
    this._elms.near &&
      this._elms.near.forEach(item => {
        item.value = near
      })
  }

  get far() {
    return this.options.far
  }
  set far(v) {
    let far = v
    if (far < this.near) {
      far = this.near
    }
    this.options.far = far
    this.renewPoint()
    this._elms.far &&
      this._elms.far.forEach(item => {
        item.value = far
      })
  }

  get scaleByDistance() {
    return this.options.scaleByDistance
  }
  set scaleByDistance(v) {
    this.options.scaleByDistance = v
    this.renewPoint()
    this._elms.scaleByDistance &&
      this._elms.scaleByDistance.forEach(item => {
        item.checked = v
      })
  }

  get billboardShow() {
    return this.options.billboard.show
  }
  set billboardShow(v) {
    this.options.billboard.show = v
    this.entity &&
      (this.entity.billboard.color = this.options.billboard.show
        ? undefined
        : new Cesium.Color(1.0, 1.0, 1.0, 0))
    this._elms.billboardShow &&
      this._elms.billboardShow.forEach(item => {
        item.value = v
      })
  }

  get billboardImage() {
    let url = this.options.billboard.image
    if (url && !url.startsWith("http")) {
      //说明是本地的json，在磁盘中存在的
      if (!url.includes(":")) {
        if (this.options.host) {
          let o = new URL(url, this.options.host)
          url = o.href
        }
      }
    }
    return url
  }
  set billboardImage(v) {
    let _this = this
    this.options.billboard.image = this.replaceHost(v, this.options.host)
    let url =
      this.options.billboard.image ||
      getBillboardDefaultUrl(this.options.billboard.defaultImage) ||
      this.getSourceRootPath() + '/img/A-ablu-blank.png'

    this._elms.billboardImage &&
      this._elms.billboardImage.forEach(item => {
        item.src = url
      })

    let isGlf = false
    let superGif
    if (_this.entity.billboard.image && _this.entity.billboard.image.getVa) { }
    if (url && url.endsWith('gif')) {
      isGlf = true

      let gifImg = document.createElement('img')
      gifImg.setAttribute('rel:animated_src', url)
      gifImg.setAttribute('rel:auto_play', '1')
      const imgDiv = document.createElement('div')
      imgDiv.appendChild(gifImg)
      let id = Cesium.createGuid()
      superGif = new SuperGif({ gif: gifImg })
      this._superGif = superGif
      this._superGif.id = id
      let billboardH = 36
      let index = 0
      _this._frameImages = []
      superGif.load(function (status) {
        if (status == 404) {
          let width = 31
          let height = 36
          canvas = document.createElement('canvas')
          canvas.width = 0
          canvas.height = 0
          billboardH = 0
          _this.entity.billboard.imgWidth = 0
          _this.entity.billboard.imgHeight = 0
          _this.entity && (_this.entity.billboard.image = canvas)
          _this.entity.billboard.height = new Cesium.CallbackProperty(function () {
            return 0
          }, false)
          _this.entity.label.pixelOffset = new Cesium.CallbackProperty(function () {
            return new Cesium.Cartesian2(0, 0)
          }, false)
          billboardH = height * (31 / width)
          return
        }
        if (_this._superGif.id != id) {
          return
        }
        let length = superGif.get_length()
        for (let i = 1; i <= length; i++) {
          superGif.move_to(i)
          _this._frameImages.push(superGif.get_canvas().toDataURL())
        }
        const canvas = superGif.get_canvas()
        let width = canvas.width
        let height = canvas.height
        billboardH = height * (31 / width)
        _this.entity.billboard.imgWidth = width
        _this.entity.billboard.imgHeight = height
        _this.entity && (_this.entity.billboard.image = new Cesium.CallbackProperty(() => {
          let img = _this._frameImages[index]
          index = index >= _this._frameImages.length - 1 ? 0 : index + 1
          return img
        }, false))
        _this.entity.billboard.height = new Cesium.CallbackProperty(function () {
          return billboardH
        }, false)
        _this.entity.label.pixelOffset = new Cesium.CallbackProperty(function () {
          if (_this.options.billboard.show) {
            return new Cesium.Cartesian2(
              0,
              -billboardH * _this.options.billboard.scale -
              _this.options.label.fontSize / 2 -
              5
            )
          } else {
            return new Cesium.Cartesian2(0, -_this.options.label.fontSize / 2 - 5)
          }
        }, false)
      })
    }
    else {
      let image = new Image()
      image.src = url
      let billboardH = 36
      const canvas = document.createElement('canvas')
      image.onload = function () {
        let ratio = image.width / image.height
        image.width = 100
        image.height = 100 / ratio
        let width = image.width
        let height = image.height
        const ctx = canvas.getContext('2d', { willReadFrequently: true })
        canvas.width = width
        canvas.height = height
        ctx.drawImage(image, 0, 0, width, height)
        billboardH = height * (31 / width)
        _this.entity.billboard.imgWidth = width
        _this.entity.billboard.imgHeight = height
        _this.entity && (_this.entity.billboard.image = canvas)
        _this.entity.billboard.height = new Cesium.CallbackProperty(function () {
          return billboardH
        }, false)
        _this.entity.label.pixelOffset = new Cesium.CallbackProperty(function () {
          if (_this.options.billboard.show) {
            return new Cesium.Cartesian2(
              0,
              -billboardH * _this.options.billboard.scale -
              _this.options.label.fontSize / 2 -
              5
            )
          } else {
            return new Cesium.Cartesian2(0, -_this.options.label.fontSize / 2 - 5)
          }
        }, false)
        billboardH = height * (31 / width)
      }
      image.onerror = function (err) {
        let width = 31
        let height = 36
        canvas.width = 0
        canvas.height = 0
        billboardH = 0
        _this.entity.billboard.imgWidth = 0
        _this.entity.billboard.imgHeight = 0
        _this.entity && (_this.entity.billboard.image = canvas)
        _this.entity.billboard.height = new Cesium.CallbackProperty(function () {
          return 0
        }, false)
        _this.entity.label.pixelOffset = new Cesium.CallbackProperty(function () {
          return new Cesium.Cartesian2(0, 0)
        }, false)
        billboardH = height * (31 / width)
      };
    }
  }

  get billboardScale() {
    return this.options.billboard.scale
  }
  set billboardScale(v) {
    this.options.billboard.scale = v
    this.renewPoint()
    this._elms.billboardScale &&
      this._elms.billboardScale.forEach(item => {
        item.value = v
      })
  }

  get labelShow() {
    return this.options.label.show
  }
  set labelShow(v) {
    this.options.label.show = v
    this.entity && (this.entity.label.show = v)
    this._elms.labelShow &&
      this._elms.labelShow.forEach(item => {
        item.value = v
      })
  }

  get labelFontFamily() {
    return this.options.label.fontFamily
  }

  set labelFontFamily(v) {
    this.options.label.fontFamily = v || 0
    this.renewPoint()

    let name = getFontFamilyName(this.labelFontFamily) || ''
    this._elms.labelFontFamily &&
      this._elms.labelFontFamily.forEach(item => {
        item.value = name
      })
  }

  get labelFontSize() {
    return this.options.label.fontSize
  }
  set labelFontSize(v) {
    this.options.label.fontSize = v
    this.renewPoint()
    this._elms.labelFontSize &&
      this._elms.labelFontSize.forEach(item => {
        item.value = v
      })
  }

  get labelColor() {
    return this.options.label.color
  }
  set labelColor(v) {
    this.options.label.color = v || '#00ffff'
    this.renewPoint()
    if (this._elms.labelColor) {
      this._elms.labelColor.forEach((item, i) => {
        let colorPicker = new YJColorPicker({
          el: item.el,
          size: 'mini', //颜色box类型
          alpha: true, //是否开启透明度
          defaultColor: this.options.label.color,
          disabled: false, //是否禁止打开颜色选择器
          openPickerAni: 'opacity', //打开颜色选择器动画
          sure: c => {
            this.labelColor = c
          }, //点击确认按钮事件回调
          clear: () => {
            this.labelColor = 'rgba(0,255,255,1)'
          } //点击清空按钮事件回调
        })
        this._elms.labelColor[i] = colorPicker
      })
    }
  }

  // get diffuseShow() {
  //   return this.options.diffuseShow
  // }
  // set diffuseShow(v) {
  //   this.options.diffuseShow = v
  //   this._elms.diffuseShow && this._elms.diffuseShow.forEach((item) => {
  //     item.checked = v
  //   })
  //   if (v && this.scanShow) {
  //     this.scanShow = false
  //   }
  //   if (this.diffuse) {
  //     if (this.show) {
  //       this.diffuse.show = this.options.diffuseShow
  //     }
  //   }
  //   else {
  //     this.diffuse = new CircleDiffuse(this.sdk, { show: this.diffuseShow, lng: this.lng, lat: this.lat, radius: this.diffuseRadius, duration: this.diffuseDuration, color: this.diffuseColor })
  //   }
  // }

  // get diffuseRadius() {
  //   return this.options.diffuseRadius
  // }
  // set diffuseRadius(v) {
  //   this.options.diffuseRadius = v
  //   this._elms.diffuseRadius && this._elms.diffuseRadius.forEach((item) => {
  //     item.value = v
  //   })
  //   if (this.diffuse) {
  //     this.diffuse.radius = this.options.diffuseRadius
  //   }
  // }

  // get diffuseDuration() {
  //   return this.options.diffuseDuration
  // }
  // set diffuseDuration(v) {
  //   this.options.diffuseDuration = v
  //   this._elms.diffuseDuration && this._elms.diffuseDuration.forEach((item) => {
  //     item.value = v
  //   })
  //   if (this.diffuse) {
  //     this.diffuse.duration = this.options.diffuseDuration
  //   }
  // }

  // get diffuseColor() {
  //   return this.options.diffuseColor
  // }
  // set diffuseColor(v) {
  //   this.options.diffuseColor = v
  //   if (this._elms.diffuseColor) {
  //     this._elms.diffuseColor.forEach((item, i) => {
  //       let diffuseColorPicker = new YJColorPicker({
  //         el: item.el,
  //         size: 'mini',//颜色box类型
  //         alpha: false,//是否开启透明度
  //         defaultColor: v,
  //         disabled: false,//是否禁止打开颜色选择器
  //         openPickerAni: 'opacity',//打开颜色选择器动画
  //         sure: (c) => {
  //           this.diffuseColor = c
  //         },//点击确认按钮事件回调
  //         clear: () => {
  //           this.diffuseColor = 'rgba(255,255,255,1)'
  //         },//点击清空按钮事件回调
  //       })
  //       this._elms.diffuseColor[i] = diffuseColorPicker
  //     })
  //   }
  //   if (this.diffuse) {
  //     this.diffuse.color = this.options.diffuseColor
  //   }
  // }

  // get scanShow() {
  //   return this.options.scanShow
  // }
  // set scanShow(v) {
  //   this.options.scanShow = v
  //   this._elms.scanShow && this._elms.scanShow.forEach((item) => {
  //     item.checked = v
  //   })
  //   if (v && this.diffuseShow) {
  //     this.diffuseShow = false
  //   }
  //   if (this.scan) {
  //     if (this.show) {
  //       this.scan.show = this.options.scanShow
  //     }
  //   }
  //   else {
  //     this.scan = new RadarScan(this.sdk, { show: this.scanShow, lng: this.lng, lat: this.lat, radius: this.scanRadius, duration: this.scanDuration, color: this.scanColor })
  //   }
  // }

  // get scanRadius() {
  //   return this.options.scanRadius
  // }
  // set scanRadius(v) {
  //   this.options.scanRadius = v
  //   this._elms.scanRadius && this._elms.scanRadius.forEach((item) => {
  //     item.value = v
  //   })
  //   if (this.scan) {
  //     this.scan.radius = this.options.scanRadius
  //   }
  // }

  // get scanDuration() {
  //   return this.options.scanDuration
  // }
  // set scanDuration(v) {
  //   this.options.scanDuration = v
  //   this._elms.scanDuration && this._elms.scanDuration.forEach((item) => {
  //     item.value = v
  //   })
  //   if (this.scan) {
  //     this.scan.duration = this.options.scanDuration
  //   }
  // }

  // get scanColor() {
  //   return this.options.scanColor
  // }
  // set scanColor(v) {
  //   this.options.scanColor = v
  //   if (this._elms.scanColor) {
  //     this._elms.scanColor.forEach((item, i) => {
  //       let scanColorPicker = new YJColorPicker({
  //         el: item.el,
  //         size: 'mini',//颜色box类型
  //         alpha: false,//是否开启透明度
  //         defaultColor: v,
  //         disabled: false,//是否禁止打开颜色选择器
  //         openPickerAni: 'opacity',//打开颜色选择器动画
  //         sure: (c) => {
  //           this.scanColor = c
  //         },//点击确认按钮事件回调
  //         clear: () => {
  //           this.scanColor = 'rgba(255,255,255,1)'
  //         },//点击清空按钮事件回调
  //       })
  //       this._elms.scanColor[i] = scanColorPicker
  //     })
  //   }
  //   if (this.scan) {
  //     this.scan.color = this.options.scanColor
  //   }
  // }

  get instruct() {
    return this.options.instruct
  }
  set instruct(v) {
    this.options.instruct = v
    this._elms.instruct &&
      this._elms.instruct.forEach(item => {
        item.value = v
      })
  }

  get operatingPoint() {
    return this.options.operatingPoint
  }
  set operatingPoint(v) {
    this.options.operatingPoint = v
    this._elms.operatingPoint &&
      this._elms.operatingPoint.forEach(item => {
        item.value = v
      })
  }

  get attributeType() {
    return this.options.attributeType
  }

  set attributeType(v) {
    this.options.attributeType = v
    this._elms.attributeType &&
      this._elms.attributeType.forEach(item => {
        item.value = v
      })
    let attributeContent = this._DialogObject._element.content.getElementsByClassName(
      'attribute-content'
    )
    for (let i = 0; i < attributeContent.length; i++) {
      if (
        attributeContent[i].className.indexOf('attribute-content-' + v) > -1
      ) {
        attributeContent[i].style.display = 'block'
      } else {
        attributeContent[i].style.display = 'none'
      }
    }
  }

  get attributeLink() {
    return this.options.attribute.link.content
  }

  set attributeLink(v) {
    this.options.attribute.link.content = v
    if (
      !this._DialogObject ||
      !this._DialogObject._element ||
      !this._DialogObject._element.content ||
      this._DialogObject._element.content.getElementsByClassName(
        'attribute-content-link'
      ).length == 0
    ) {
      return
    }
    let table = this._DialogObject._element.content
      .getElementsByClassName('attribute-content-link')[1]
      .getElementsByClassName('table')[0]
    let tableContent = table.getElementsByClassName('table-body')[0]
    tableContent.innerHTML = ''
    if (this.options.attribute.link.content.length > 0) {
      table.getElementsByClassName('table-empty')[0].style.display = 'none'
    } else {
      table.getElementsByClassName('table-empty')[0].style.display = 'flex'
    }
    for (let i = 0; i < this.options.attribute.link.content.length; i++) {
      let tr =
        `
      <div class="tr">
          <div class="td">` +
        this.options.attribute.link.content[i].name +
        `</div>
          <div class="td">` +
        this.options.attribute.link.content[i].url +
        `</div>
          <div class="td">
              <button @click="linkEdit">编辑</button>
              <button @click="linkDelete">删除</button>
          </div>
      </div>`
      let trElm = document.createRange().createContextualFragment(tr)
      tableContent.appendChild(trElm)
    }
    let item = tableContent.getElementsByClassName('tr')
    let fun = {
      linkEdit: async index => {
        this.attributeLink = await this.options.attribute.link.content
        let table = this._DialogObject._element.content
          .getElementsByClassName('attribute-content-link')[1]
          .getElementsByClassName('table')[0]
        let tableContent = table.getElementsByClassName('table-body')[0]
        let item = tableContent.getElementsByClassName('tr')
        for (let i = 0; i < item.length; i++) {
          if (index === i) {
            let height = item[i].offsetHeight
            let html = `
              <div class="td">
                <input class="input" type="text">
              </div>
              <div class="td">
                <textarea class="input link-edit" type="text"></textarea>
              </div>
              <div class="td">
                  <button @click="confirmEdit">确认</button>
                  <button @click="cancelEdit">取消</button>
              </div>`
            item[i].innerHTML = html
            let textareaElm = item[i].getElementsByClassName('link-edit')[0]
            textareaElm.style.height = height - 10 + 'px'
            let td = item[i].getElementsByClassName('td')
            td[0].getElementsByClassName(
              'input'
            )[0].value = this.options.attribute.link.content[index].name
            td[1].getElementsByClassName(
              'input'
            )[0].value = this.options.attribute.link.content[index].url
            let btn = item[i].getElementsByTagName('button')
            for (let n = 0; n < btn.length; n++) {
              if (!btn[n] || !btn[n].attributes) {
                continue
              }
              for (let m of btn[n].attributes) {
                if (m.name === '@click') {
                  btn[n].addEventListener('click', e => {
                    if (typeof fun[m.value] === 'function') {
                      fun[m.value](
                        {
                          name: td[0].getElementsByClassName('input')[0].value,
                          url: td[1].getElementsByClassName('input')[0].value
                        },
                        i
                      )
                    }
                  })
                  btn[n].attributes.removeNamedItem(m.name)
                  break
                }
              }
            }
            break
          }
        }
      },
      linkDelete: i => {
        this.options.attribute.link.content.splice(i, 1)
        this.attributeLink = this.options.attribute.link.content
      },

      confirmEdit: (value, i) => {
        let name = value.name && value.name.replace(/\s/g, '')
        let url = value.url && value.url.replace(/\s/g, '')
        if (name && url) {
          this.options.attribute.link.content[i] = value
        } else {
          window.ELEMENT &&
            window.ELEMENT.Message({
              message: '名称或链接不能为空！',
              type: 'warning',
              duration: 1500
            })
        }
        this.attributeLink = this.options.attribute.link.content
      },
      cancelEdit: () => {
        this.attributeLink = this.options.attribute.link.content
      },
      fileSelect: (value, i) => {
        let fileElm = item[i].getElementsByClassName('file-select')[0]
        fileElm.click()
        fileElm.removeEventListener('change', fileSelect)
        fileElm.addEventListener('change', fileSelect)
      }
    }
    let fileSelect = event => {
      if (event.target.value) {
        let td = item[
          event.target.getAttribute('index')
        ].getElementsByClassName('td')
        td[1].getElementsByClassName('input')[0].value = event.target.value
        event.target.value = null
      }
    }
    for (let i = 0; i < item.length; i++) {
      let btn = item[i].getElementsByTagName('button')
      for (let n = 0; n < btn.length; n++) {
        if (!btn[n] || !btn[n].attributes) {
          continue
        }
        for (let m of btn[n].attributes) {
          if (m.name === '@click') {
            btn[n].addEventListener('click', e => {
              if (typeof fun[m.value] === 'function') {
                fun[m.value](i)
              }
            })
            btn[n].attributes.removeNamedItem(m.name)
            break
          }
        }
      }
    }
  }

  get attributeCamera() {
    return this.options.attribute.camera.content
  }

  set attributeCamera(v) {
    this.options.attribute.camera.content = v
  }

  get attributeISC() {
    return this.options.attribute.ISC.content
  }

  set attributeISC(v) {
    this.options.attribute.ISC.content = v
  }

  get attributeVr() {
    return this.options.attribute.vr.content
  }

  set attributeVr(v) {
    this.options.attribute.vr.content = v
    if (
      !this._DialogObject ||
      !this._DialogObject._element ||
      !this._DialogObject._element.content ||
      this._DialogObject._element.content.getElementsByClassName(
        'attribute-content-vr'
      ).length == 0
    ) {
      return
    }
    let table = this._DialogObject._element.content
      .getElementsByClassName('attribute-content-vr')[1]
      .getElementsByClassName('table')[0]
    let tableContent = table.getElementsByClassName('table-body')[0]
    tableContent.innerHTML = ''
    if (this.options.attribute.vr.content.length > 0) {
      table.getElementsByClassName('table-empty')[0].style.display = 'none'
    } else {
      table.getElementsByClassName('table-empty')[0].style.display = 'flex'
    }
    for (let i = 0; i < this.options.attribute.vr.content.length; i++) {
      let tr =
        `
      <div class="tr">
          <div class="td">` +
        this.options.attribute.vr.content[i].name +
        `</div>
          <div class="td">` +
        this.options.attribute.vr.content[i].url +
        `</div>
          <div class="td">
              <button @click="vrEdit">编辑</button>
              <button @click="vrDelete">删除</button>
          </div>
      </div>`
      let trElm = document.createRange().createContextualFragment(tr)
      tableContent.appendChild(trElm)
    }
    let item = tableContent.getElementsByClassName('tr')
    let fun = {
      vrEdit: async index => {
        this.attributeVr = await this.options.attribute.vr.content
        let table = this._DialogObject._element.content
          .getElementsByClassName('attribute-content-vr')[1]
          .getElementsByClassName('table')[0]
        let tableContent = table.getElementsByClassName('table-body')[0]
        let item = tableContent.getElementsByClassName('tr')
        for (let i = 0; i < item.length; i++) {
          if (index === i) {
            let height = item[i].offsetHeight
            let html = `
              <div class="td">
                <input class="input" type="text">
              </div>
              <div class="td">
                <textarea class="input link-edit" type="text"></textarea>
              </div>
              <div class="td">
                  <button @click="confirmEdit">确认</button>
                  <button @click="cancelEdit">取消</button>
              </div>`
            item[i].innerHTML = html
            let textareaElm = item[i].getElementsByClassName('link-edit')[0]
            textareaElm.style.height = height - 10 + 'px'
            let td = item[i].getElementsByClassName('td')
            td[0].getElementsByClassName(
              'input'
            )[0].value = this.options.attribute.vr.content[index].name
            td[1].getElementsByClassName(
              'input'
            )[0].value = this.options.attribute.vr.content[index].url
            let btn = item[i].getElementsByTagName('button')
            for (let n = 0; n < btn.length; n++) {
              if (!btn[n] || !btn[n].attributes) {
                continue
              }
              for (let m of btn[n].attributes) {
                if (m.name === '@click') {
                  btn[n].addEventListener('click', e => {
                    if (typeof fun[m.value] === 'function') {
                      fun[m.value](
                        {
                          name: td[0].getElementsByClassName('input')[0].value,
                          url: td[1].getElementsByClassName('input')[0].value
                        },
                        i
                      )
                    }
                  })
                  btn[n].attributes.removeNamedItem(m.name)
                  break
                }
              }
            }
            break
          }
        }
      },
      vrDelete: i => {
        this.options.attribute.vr.content.splice(i, 1)
        this.attributeVr = this.options.attribute.vr.content
      },

      confirmEdit: (value, i) => {
        let name = value.name && value.name.replace(/\s/g, '')
        let url = value.url && value.url.replace(/\s/g, '')
        if (name && url) {
          this.options.attribute.vr.content[i] = value
        } else {
          window.ELEMENT &&
            window.ELEMENT.Message({
              message: '名称或链接不能为空！',
              type: 'warning',
              duration: 1500
            })
        }
        this.attributeVr = this.options.attribute.vr.content
      },
      cancelEdit: () => {
        this.attributeVr = this.options.attribute.vr.content
      },
      fileSelect: (value, i) => {
        let fileElm = item[i].getElementsByClassName('file-select')[0]
        fileElm.click()
        fileElm.removeEventListener('change', fileSelect)
        fileElm.addEventListener('change', fileSelect)
      }
    }
    let fileSelect = event => {
      if (event.target.value) {
        let td = item[
          event.target.getAttribute('index')
        ].getElementsByClassName('td')
        td[1].getElementsByClassName('input')[0].value = event.target.value
        event.target.value = null
      }
    }
    for (let i = 0; i < item.length; i++) {
      let btn = item[i].getElementsByTagName('button')
      for (let n = 0; n < btn.length; n++) {
        if (!btn[n] || !btn[n].attributes) {
          continue
        }
        for (let m of btn[n].attributes) {
          if (m.name === '@click') {
            btn[n].addEventListener('click', e => {
              if (typeof fun[m.value] === 'function') {
                fun[m.value](i)
              }
            })
            btn[n].attributes.removeNamedItem(m.name)
            break
          }
        }
      }
    }
  }

  get attributeGoods() {
    return this.options.attribute.goods.content
  }

  set attributeGoods(v) {
    this.options.attribute.goods.content = v
  }

  get billboardDefaultImage() {
    return (
      getBillboardDefaultUrl(this.options.billboard.defaultImage) ||
      this.getSourceRootPath() + '/img/A-ablu-blank.png'
    )
  }

  set billboardDefaultImage(v) {
    let url = this.replaceHost(v, this.options.host)
    setBillboardDefaultUrl(url, this.options.billboard.defaultImage)
    this._elms.billboardDefaultImage &&
      this._elms.billboardDefaultImage.forEach(item => {
        item.src = url
      })
  }

  get coordinate() {
    return this.options.coordinate
  }
  set coordinate(v) {
    this.options.coordinate = v
    let position = this._proj.convert(
      [
        {
          x: this.options.positions.lng,
          y: this.options.positions.lat,
          z: this.options.positions.alt
        }
      ],
      'EPSG:4326',
      v
    ).points
    if (
      this._DialogObject &&
      this._DialogObject._element &&
      this._DialogObject._element.content &&
      position[0]
    ) {
      this._DialogObject._element.content.getElementsByClassName(
        'convert-x'
      )[0].value = position[0].x
      this._DialogObject._element.content.getElementsByClassName(
        'convert-y'
      )[0].value = position[0].y
      this._DialogObject._element.content.getElementsByClassName(
        'convert-z'
      )[0].value = position[0].z
    }
    this._elms.coordinate &&
      this._elms.coordinate.forEach(item => {
        item.value = v
      })
  }

  /**
   * @description 编辑框
   * @param state=false {boolean} 状态: true打开, false关闭
   */
  async edit(state = false) {
    let _this = this
    this.originalOptions = this.deepCopyObj(this.options)

    // let elms = this.sdk.viewer._container.getElementsByClassName('YJ-custom-base-dialog')
    // for (let i = elms.length - 1; i >= 0; i--) {
    //   this.sdk.viewer._container.removeChild(elms[i])
    // }

    if (this._DialogObject && this._DialogObject.close) {
      this._DialogObject.close()
      this._DialogObject = null
    }

    if (state) {
      this._DialogObject = await new Dialog(
        this.sdk,
        this.options,
        {
          title: '点属性',
          left: '180px',
          top: '100px',
          confirmCallBack: options => {
            this.labelText = this.labelText.trim()
            if (!this.labelText) {
              this.labelText = '未命名对象'
            }
            this.originalOptions = this.deepCopyObj(this.options)
            this._DialogObject.close()
            let cdoptions = this.deepCopyObj(this.options)
            cdoptions.host = ''
            this.Dialog.confirmCallBack &&
              this.Dialog.confirmCallBack(cdoptions)
            syncData(this.sdk, this.options.id)
            syncSplitData(this.sdk, this.options.id)
          },
          resetCallBack: () => {
            this.reset()
            this.Dialog.resetCallBack && this.Dialog.resetCallBack()
          },
          removeCallBack: () => {
            this.Dialog.removeCallBack && this.Dialog.removeCallBack()
          },
          closeCallBack: () => {
            this.positionEditing = false
            setTimeout(() => {
              this.reset()
              this.Dialog.closeCallBack && this.Dialog.closeCallBack()
            }, 0)
          },
          showCallBack: show => {
            this.show = show
            this.Dialog.showCallBack && this.Dialog.showCallBack()
          },
          translationalCallBack: () => {
            this.positionEditing = !this.positionEditing
          },
          updateHeightCallBack: () => {
            this.updateHeight()
          }
        },
        true
      )
      this._DialogObject._element.body.className =
        this._DialogObject._element.body.className + ' billboard-object'
      let contentElm = document.createElement('div')
      contentElm.innerHTML = html(this)
      this._DialogObject.contentAppChild(contentElm)
      this.attributeType = this.options.attributeType
      this.attributeCamera = this.options.attribute.camera.content
      this.attributeISC = this.options.attribute.ISC.content

      // let coordinateElm = contentElm.getElementsByClassName('coordinate-select')[0]
      // let option = ''
      // this._proj.epsg_map.forEach((value, key) => {
      //   if (!this.options.coordinate) {
      //     this.options.coordinate = key
      //     this.originalOptions.coordinate = key
      //   }
      //   option += `<option value="${key}">${value.name} (${value.epsg})</option>`
      // })
      // coordinateElm.innerHTML = option
      // this.coordinate = this.options.coordinate

      // 创建标签页
      let tabsElm = new cy_tabs('point-object-edit-tabs', undefined, this.sdk)
      // 颜色组件
      let colorPicker = new YJColorPicker({
        el: contentElm.getElementsByClassName('labelColor')[0],
        size: 'mini', //颜色box类型
        alpha: true, //是否开启透明度
        defaultColor: this.labelColor,
        disabled: false, //是否禁止打开颜色选择器
        openPickerAni: 'opacity', //打开颜色选择器动画
        sure: color => {
          this.labelColor = color
        }, //点击确认按钮事件回调
        clear: () => {
          this.labelColor = 'rgba(255,255,255,1)'
        } //点击清空按钮事件回调
      })

      // let diffuseColorPicker = new YJColorPicker({
      //   el: contentElm.getElementsByClassName("diffuseColor")[0],
      //   size: 'mini',//颜色box类型
      //   alpha: false,//是否开启透明度
      //   defaultColor: this.diffuseColor,
      //   disabled: false,//是否禁止打开颜色选择器
      //   openPickerAni: 'opacity',//打开颜色选择器动画
      //   sure: (color) => {
      //     this.diffuseColor = color
      //   },//点击确认按钮事件回调
      //   clear: () => {
      //     this.diffuseColor = 'rgba(255,255,255,1)'
      //   },//点击清空按钮事件回调
      // })
      // let scanColorPicker = new YJColorPicker({
      //   el: contentElm.getElementsByClassName("scanColor")[0],
      //   size: 'mini',//颜色box类型
      //   alpha: false,//是否开启透明度
      //   defaultColor: this.scanColor,
      //   disabled: false,//是否禁止打开颜色选择器
      //   openPickerAni: 'opacity',//打开颜色选择器动画
      //   sure: (color) => {
      //     this.scanColor = color
      //   },//点击确认按钮事件回调
      //   clear: () => {
      //     this.scanColor = 'rgba(255,255,255,1)'
      //   },//点击清空按钮事件回调
      // })
      let all_elm = contentElm.getElementsByTagName('*')
      this._EventBinding.on(this, all_elm)
      this._elms = this._EventBinding.element
      this._elms.labelColor = [colorPicker]
      // this._elms.diffuseColor = [diffuseColorPicker]
      // this._elms.scanColor = [scanColorPicker]

      setTimeout(async () => {
        this.attributeLink = this.options.attribute.link.content
        this.attributeVr = this.options.attribute.vr.content
        // this.attributeCamera = this.options.attribute.camera
        this.cameraSelect && this.cameraSelect()
        this.ISCSelect && this.ISCSelect()
        this.goodsSelect && this.goodsSelect()
        let tagData = this.attributeSelect
        let attributeElm = this._DialogObject._element.content.getElementsByClassName(
          'attribute-select-box'
        )[0]
        if (attributeElm) {
          let legpObject = legp(attributeElm, '.attribute-select')
          legpObject.legp_search(tagData)
          let attributeSelectElm = this._DialogObject._element.content
            .getElementsByClassName('attribute-select')[0]
            .getElementsByTagName('input')[0]
          for (let i = 0; i < tagData.length; i++) {
            if (tagData[i].key === this.options.attributeType) {
              attributeSelectElm.value = tagData[i].value
              legpObject.legp_searchActive(tagData[i].value)
              break
            }
          }
          attributeSelectElm.addEventListener('input', () => {
            for (let i = 0; i < tagData.length; i++) {
              if (tagData[i].value === attributeSelectElm.value) {
                this.attributeType = tagData[i].key
                break
              }
            }
          })
        }

        let coordinateData = []
        this.epsg_map.forEach((value, key) => {
          coordinateData.push({
            name: `${value.name}(${value.epsg})`,
            value: key
          })
        })
        let coordinateDataLegpObject = legp(
          this._DialogObject._element.content.getElementsByClassName(
            'coordinate-select-box'
          )[0],
          '.coordinate-select'
        )
        if (coordinateDataLegpObject) {
          coordinateDataLegpObject.legp_search(coordinateData)
          let coordinateDataLegpElm = this._DialogObject._element.content
            .getElementsByClassName('coordinate-select')[0]
            .getElementsByTagName('input')[0]
          if (!this.coordinate) {
            this.coordinate = coordinateData[0].value
          } else {
            this.coordinate = this.coordinate
          }
          coordinateDataLegpElm.value = this.coordinate
          for (let i = 0; i < coordinateData.length; i++) {
            if (coordinateData[i].value === coordinateData.value) {
              coordinateDataLegpObject.legp_searchActive(
                coordinateData[i].value
              )
              break
            }
          }
          coordinateDataLegpElm.addEventListener('input', () => {
            for (let i = 0; i < coordinateData.length; i++) {
              if (coordinateData[i].value === coordinateDataLegpElm.value) {
                this.coordinate = coordinateData[i].value
                break
              }
            }
          })
        }

        let heightBoxElm = document.getElementsByClassName('height-box')[0]
        let heightElm = heightBoxElm.getElementsByClassName('height')[0]
        let heightModeData = [
          {
            name: '海拔高度',
            value: '海拔高度',
            key: '0'
          },
          {
            name: '相对地表',
            value: '相对地表',
            key: '1'
          },
          {
            name: '依附地表',
            value: '依附地表',
            key: '2'
          },
          {
            name: '依附模型',
            value: '依附模型',
            key: '3'
          }
        ]
        let heightMode = this.heightMode

        switch (heightMode) {
          case 0:
          case '0':
            heightElm.value = this.alt
            break
          case 1:
          case '1':
            if (this.sdk.viewer.scene.terrainProvider.availability) {
              Cesium.sampleTerrainMostDetailed(
                this.sdk.viewer.scene.terrainProvider,
                [
                  Cesium.Cartographic.fromDegrees(
                    this.options.positions.lng,
                    this.options.positions.lat
                  )
                ]
              ).then(position => {
                heightElm.value = Number(
                  (this.alt - Number(position[0].height.toFixed(2))).toFixed(2)
                )
              })
            } else {
              heightElm.value = Number(this.alt.toFixed(2))
            }
            break
          case 2:
          case '2':
          case 3:
          case '3':
            let objectsToExclude = []
            for (let [key, value] of this.sdk.entityMap) {
              if (value.type === 'RadarScanStereoscopic' && value.entity) {
                objectsToExclude.push(value.entity)
              }
            }
            this.getClampToHeight(this.options.positions, objectsToExclude).then(h => {
              this.alt = Number(h.toFixed(2))
              heightElm.value = this.alt
            })
            break
        }

        let heightModeObject = legp(
          this._DialogObject._element.content.getElementsByClassName(
            'height-mode-box'
          )[0],
          '.height-mode'
        )
        if (heightModeObject) {
          heightModeObject.legp_search(heightModeData)
          let heightModeDataLegpElm = this._DialogObject._element.content
            .getElementsByClassName('height-mode')[0]
            .getElementsByTagName('input')[0]
          heightModeDataLegpElm.value = heightModeData[this.heightMode].value
          for (let i = 0; i < heightModeData.length; i++) {
            if (heightModeData[i].value == heightModeDataLegpElm.value) {
              heightModeObject.legp_searchActive(heightModeData[i].value)
              break
            }
          }
          heightModeDataLegpElm.addEventListener('input', () => {
            for (let i = 0; i < heightModeData.length; i++) {
              if (heightModeData[i].value === heightModeDataLegpElm.value) {
                heightMode = heightModeData[i].key
                switch (heightMode) {
                  case 0:
                  case '0':
                    this.alt = Number(heightElm.value)
                    heightBoxElm.style.display = 'flex'
                    this.heightMode = 0
                    break
                  case 1:
                  case '1':
                    if (this.sdk.viewer.scene.terrainProvider.availability) {
                      Cesium.sampleTerrainMostDetailed(
                        this.sdk.viewer.scene.terrainProvider,
                        [
                          Cesium.Cartographic.fromDegrees(
                            this.options.positions.lng,
                            this.options.positions.lat
                          )
                        ]
                      ).then(position => {
                        this.alt =
                          Number(heightElm.value) +
                          Number(position[0].height.toFixed(2))
                      })
                    } else {
                      this.alt = Number(heightElm.value)
                    }
                    heightBoxElm.style.display = 'flex'
                    this.heightMode = 1
                    break
                  case 2:
                  case '2':
                    this.heightMode = 2
                    break
                  case 3:
                  case '3':
                    let objectsToExclude = []
                    for (let [key, value] of this.sdk.entityMap) {
                      if (value.type === 'RadarScanStereoscopic' && value.entity) {
                        objectsToExclude.push(value.entity)
                      }
                    }
                    this.getClampToHeight(this.options.positions, objectsToExclude).then(h => {
                      this.alt = Number(h.toFixed(2))
                    })
                    this.heightMode = 3
                    break
                }
                break
              }
            }
          })

          heightElm.addEventListener('input', () => {
            switch (heightMode) {
              case 0:
              case '0':
                this.options.positions.alt = Number(
                  Number(heightElm.value).toFixed(2)
                )
                break
              case 1:
              case '1':
                if (this.sdk.viewer.scene.terrainProvider.availability) {
                  Cesium.sampleTerrainMostDetailed(
                    this.sdk.viewer.scene.terrainProvider,
                    [
                      Cesium.Cartographic.fromDegrees(
                        this.options.positions.lng,
                        this.options.positions.lat
                      )
                    ]
                  ).then(position => {
                    this.alt =
                      Number(heightElm.value) +
                      Number(position[0].height.toFixed(2))
                  })
                } else {
                  this.alt = Number(heightElm.value)
                }
                break
              case 2:
              case '2':
                break
            }
            this.renewPoint()
            this.coordinate = this.options.coordinate
            this._elms.alt &&
              this._elms.alt.forEach(item => {
                item.value = this.options.positions.alt
              })
          })
          this._elms.height = heightBoxElm
          this._elms.heightMode = heightModeDataLegpElm

          this.heightMode = this.heightMode
        }

        let fontData = getFontList()
        let fontObject = legp(
          this._DialogObject._element.content.getElementsByClassName(
            'font-select-box'
          )[0],
          '.font-select'
        )
        if (fontObject) {
          fontObject.legp_search(fontData)
          let fontDataLegpElm = this._DialogObject._element.content
            .getElementsByClassName('font-select')[0]
            .getElementsByTagName('input')[0]
          fontDataLegpElm.value = fontData[this.labelFontFamily].value
          for (let i = 0; i < fontData.length; i++) {
            if (fontData[i].value == fontDataLegpElm.value) {
              fontObject.legp_searchActive(fontData[i].value)
              break
            }
          }
          fontDataLegpElm.addEventListener('input', () => {
            for (let i = 0; i < fontData.length; i++) {
              if (fontData[i].value === fontDataLegpElm.value) {
                this.labelFontFamily = fontData[i].key
                break
              }
            }
          })
          this._elms.labelFontFamily = [fontDataLegpElm]
        }
      }, 0)

      let lngEln = contentElm.getElementsByClassName('lng')[0]
      let latEln = contentElm.getElementsByClassName('lat')[0]
      lngEln.value = this.lng
      latEln.value = this.lat
      this._elms.lng.push(lngEln)
      this._elms.lat.push(latEln)

      let projCheckboxBoxElms = this._DialogObject._element.content.getElementsByClassName(
        'YJ-custom-checkbox-box'
      )
      let projCheckboxElms = this._DialogObject._element.content.getElementsByClassName(
        'YJ-custom-checkbox'
      )
      let projInputBoxElms = this._DialogObject._element.content.getElementsByClassName(
        'proj-input-box'
      )

      projCheckboxElms[0].checked = true
      projInputBoxElms[1].style.display = 'none'
      projInputBoxElms[2].style.display = 'none'

      projCheckboxBoxElms[0].addEventListener('click', () => {
        projCheckboxElms[0].checked = true
        projInputBoxElms[0].style.display = 'block'
        projCheckboxElms[1].checked = false
        projInputBoxElms[1].style.display = 'none'
        projCheckboxElms[2].checked = false
        projInputBoxElms[2].style.display = 'none'
      })
      projCheckboxBoxElms[1].addEventListener('click', () => {
        projCheckboxElms[1].checked = true
        projInputBoxElms[1].style.display = 'block'
        projCheckboxElms[0].checked = false
        projInputBoxElms[0].style.display = 'none'
        projCheckboxElms[2].checked = false
        projInputBoxElms[2].style.display = 'none'
      })
      projCheckboxBoxElms[2].addEventListener('click', () => {
        projCheckboxElms[2].checked = true
        projInputBoxElms[2].style.display = 'block'
        projCheckboxElms[0].checked = false
        projInputBoxElms[0].style.display = 'none'
        projCheckboxElms[1].checked = false
        projInputBoxElms[1].style.display = 'none'
      })

      _this._projConvert = () => {
        if (!this._DialogObject || this._DialogObject.isDestroy) {
          return
        }
        let lng,
          lat,
          lngD,
          lngM,
          lngS,
          latD,
          latM,
          latS,
          lngDM,
          latDM,
          lngDMS,
          latDMS,
          lngdnArr1,
          lngdnArr2,
          latdnArr1,
          latdnArr2,
          lngdnsArr1,
          lngdnsArr2,
          lngdnsArr3,
          latdnsArr1,
          latdnsArr2,
          latdnsArr3
        lng = _this.lng
        lat = _this.lat
        lngDM = _this._proj.degreesToDMS(lng, true)
        latDM = _this._proj.degreesToDMS(lat, true)
        lngdnArr1 = lngDM.split('°')
        lngdnArr2 = lngdnArr1[1].split("'")
        latdnArr1 = latDM.split('°')
        latdnArr2 = latdnArr1[1].split("'")
        contentElm.getElementsByClassName('lng-dm-d')[0].value = lngdnArr1[0]
        contentElm.getElementsByClassName('lng-dm-m')[0].value = lngdnArr2[0]
        contentElm.getElementsByClassName('lat-dm-d')[0].value = latdnArr1[0]
        contentElm.getElementsByClassName('lat-dm-m')[0].value = latdnArr2[0]

        lngDMS = _this._proj.degreesToDMS(lng)
        latDMS = _this._proj.degreesToDMS(lat)
        lngdnsArr1 = lngDMS.split('°')
        lngdnsArr2 = lngdnsArr1[1].split("'")
        lngdnsArr3 = lngdnsArr2[1].split('"')
        latdnsArr1 = latDMS.split('°')
        latdnsArr2 = latdnsArr1[1].split("'")
        latdnsArr3 = latdnsArr2[1].split('"')
        contentElm.getElementsByClassName('lng-dms-d')[0].value = lngdnsArr1[0]
        contentElm.getElementsByClassName('lng-dms-m')[0].value = lngdnsArr2[0]
        contentElm.getElementsByClassName('lng-dms-s')[0].value = lngdnsArr3[0]
        contentElm.getElementsByClassName('lat-dms-d')[0].value = latdnsArr1[0]
        contentElm.getElementsByClassName('lat-dms-m')[0].value = latdnsArr2[0]
        contentElm.getElementsByClassName('lat-dms-s')[0].value = latdnsArr3[0]
      }

      _this._projConvert()
    } else {
      // if (this._element_style) {
      //   document.getElementsByTagName('head')[0].removeChild(this._element_style)
      //   this._element_style = null
      // }
      // if (this._DialogObject && this._DialogObject.remove) {
      //   this._DialogObject.remove()
      //   this._DialogObject = null
      // }
    }
  }

  renewPoint() {
    let _this = this

    let font = getFontFamily(this.labelFontFamily) || 'Helvetica'

    if (this.entity) {
      this.entity.position = Cesium.Cartesian3.fromDegrees(
        this.options.positions.lng,
        this.options.positions.lat,
        this.options.positions.alt
      )
      if (this.options.scaleByDistance) {
        this.entity.billboard.scaleByDistance = new Cesium.NearFarScalar(
          this.options.near,
          1,
          this.options.far,
          0
        )
        this.entity.billboard.pixelOffsetScaleByDistance = new Cesium.NearFarScalar(
          this.options.near,
          1,
          this.options.far,
          0
        )
        this.entity.label.scaleByDistance = new Cesium.NearFarScalar(
          this.options.near,
          1,
          this.options.far,
          0
        )
        this.entity.label.pixelOffsetScaleByDistance = new Cesium.NearFarScalar(
          this.options.near,
          1,
          this.options.far,
          0
        )
      } else {
        this.entity.billboard.scaleByDistance = undefined
        this.entity.billboard.pixelOffsetScaleByDistance = undefined
        this.entity.label.scaleByDistance = undefined
        this.entity.label.pixelOffsetScaleByDistance = undefined
      }
      // this.entity.billboard.pixelOffset = new Cesium.CallbackProperty(
      //   function () {
      //     let billboardH =
      //       _this.entity.billboard.imgHeight *
      //       (31 / _this.entity.billboard.imgWidth)
      //     return new Cesium.Cartesian2(
      //       0,
      //       -(billboardH / 2) * _this.options.billboard.scale
      //     )
      //   },
      //   false
      // )
      this.entity.label.pixelOffset = new Cesium.CallbackProperty(function () {
        if (_this.options.billboard.show) {
          let billboardH = _this.entity.billboard.imgHeight ?
            _this.entity.billboard.imgHeight *
            (31 / _this.entity.billboard.imgWidth) : 0
          return new Cesium.Cartesian2(
            0,
            -billboardH * _this.options.billboard.scale -
            _this.options.label.fontSize / 2 -
            5
          )
        } else {
          return new Cesium.Cartesian2(0, -_this.options.label.fontSize / 2 - 5)
        }
      }, false)
      this.entity.label.font = this.options.label.fontSize + 'px ' + font
      this.entity.label.fillColor = Cesium.Color.fromCssColorString(
        this.options.label.color
      )
      this.entity.billboard.scale = this.options.billboard.scale
    }
  }

  reset() {
    if (!this.entity) {
      return
    }
    this.options = this.deepCopyObj(this.originalOptions)
    this.near = this.originalOptions.near
    this.far = this.originalOptions.far
    this.scaleByDistance = this.originalOptions.scaleByDistance
    this.billboardShow = this.originalOptions.billboard.show
    this.billboardImage = this.originalOptions.billboard.image
    this.billboardScale = this.originalOptions.billboard.scale
    this.labelText = this.originalOptions.label.text
    this.labelShow = this.originalOptions.label.show
    this.labelFontSize = this.originalOptions.label.fontSize
    this.labelColor = this.originalOptions.label.color
    this.lng = this.originalOptions.positions.lng
    this.lat = this.originalOptions.positions.lat
    this.alt = this.originalOptions.positions.alt
    // this.diffuseShow = this.originalOptions.diffuseShow
    // this.diffuseRadius = this.originalOptions.diffuseRadius
    // this.diffuseDuration = this.originalOptions.diffuseDuration
    // this.diffuseColor = this.originalOptions.diffuseColor
    // this.scanShow = this.originalOptions.scanShow
    // this.scanRadius = this.originalOptions.scanRadius
    // this.scanDuration = this.originalOptions.scanDuration
    // this.scanColor = this.originalOptions.scanColor
    this.instruct = this.originalOptions.instruct
    this.operatingPoint = this.originalOptions.operatingPoint
    this.attributeLink = this.options.attribute.link.content
    this.attributeVr = this.options.attribute.vr.content
    this.attributeCamera = this.options.attribute.camera.content
    this.attributeGoods = this.options.attribute.goods.content
    this.attributeISC = this.options.attribute.ISC.content
    this.cameraSelect && this.cameraSelect()
    this.goodsSelect && this.goodsSelect()
  }

  async remove() {
    await remove_entity_from_cluster(this.sdk.viewer, this.entity)
    this.entity = null
    if (!this.sdk.viewer || !this.sdk.viewer.entities) {
      return
    }
    // if (this.diffuse) {
    //   this.diffuse.remove()
    //   this.diffuse = null
    // }
    // if (this.scan) {
    //   this.scan.remove()
    //   this.scan = null
    // }
    if (this._DialogObject && !this._DialogObject.isDestroy) {
      this._DialogObject.close()
      this._DialogObject = null
    }
    this.event && this.event.destroy()
    this.tip && this.tip.destroy()
    await this.sdk.removeIncetance(this.options.id)
    await syncData(this.sdk, this.options.id)
    // this.entity = null
  }

  // 点击弹框内图标切换
  clickChangeImage() {
    this.Dialog.clickChangeImage && this.Dialog.clickChangeImage()
  }
  // 点击弹框内默认图标切换
  clickChangeDefaultImage() {
    this.Dialog.clickChangeDefaultImage && this.Dialog.clickChangeDefaultImage()
  }

  instructSubmit() {
    this.Dialog.instructSubmit &&
      this.Dialog.instructSubmit(
        this.options.id,
        this.options.label.text,
        this.instruct
      )
    this.originalOptions.instruct = this.instruct
  }

  operatingPointSubmit() {
    this.Dialog.operatingPointSubmit &&
      this.Dialog.operatingPointSubmit(
        this.options.id,
        this.options.label.text,
        this.operatingPoint
      )
    this.originalOptions.operatingPoint = this.operatingPoint
  }

  _addLink() {
    // document.getElementsByClassName
    if (
      this._DialogObject._element.content.getElementsByClassName('link_add')[0]
        .value
    ) {
      this.options.attribute.link.content.push({
        name: '链接',
        url: this._DialogObject._element.content.getElementsByClassName(
          'link_add'
        )[0].value
      })
      this._DialogObject._element.content.getElementsByClassName(
        'link_add'
      )[0].value = ''
      this.attributeLink = this.options.attribute.link.content
    } else {
      this.Dialog.clickAddLink && this.Dialog.clickAddLink()
    }
  }

  addAttributeLink(link) {
    this.options.attribute.link.content.push({
      name: '链接',
      url: link
    })
    this.attributeLink = this.options.attribute.link.content
  }

  _addRr() {
    if (
      this._DialogObject._element.content.getElementsByClassName('vr_add')[0]
        .value
    ) {
      this.options.attribute.vr.content.push({
        name: '全景图',
        url: this._DialogObject._element.content.getElementsByClassName(
          'vr_add'
        )[0].value
      })
      this._DialogObject._element.content.getElementsByClassName(
        'vr_add'
      )[0].value = ''
      this.attributeVr = this.options.attribute.vr.content
    } else {
      this.Dialog.clickAddVr && this.Dialog.clickAddVr()
    }
  }

  addAttributeRr(vr) {
    this.options.attribute.vr.content.push({
      name: '全景图',
      url: vr
    })
    this.attributeVr = this.options.attribute.vr.content
  }

  /**
   * 打开富文本框
   */
  openRichTextEditor(e) {
    // var ue = UE.getEditor('app');
    richText.open(
      this.options.id,
      this.options.name,
      this.options.richTextContent
    )
    richText.primaryCallBack = content => {
      this.options.richTextContent = content
    }
  }

  async updateHeight() {
    if (!this.sdk || !this.sdk.viewer || !this.sdk.viewer.scene) {
      return
    }
    let height
    let height2
    let point1 = new Cesium.Cartesian3.fromDegrees(
      this.options.positions.lng,
      this.options.positions.lat,
      0
    )
    let point2 = new Cesium.Cartesian3.fromDegrees(
      this.options.positions.lng,
      this.options.positions.lat,
      10000000000000
    )

    let objectsToExclude = []
    for (let [key, value] of this.sdk.entityMap) {
      if (value.type === 'RadarScanStereoscopic' && value.entity) {
        objectsToExclude.push(value.entity)
      }
    }
    let updatedCartesians = await this.sdk.viewer.scene.clampToHeightMostDetailed([point1], objectsToExclude)
    if (updatedCartesians && updatedCartesians[0]) {
      height = this.cartesian3Towgs84(updatedCartesians[0], this.sdk.viewer).alt
    }

    let direction = Cesium.Cartesian3.subtract(
      point1,
      point2,
      new Cesium.Cartesian3()
    )
    let c = Cesium.Cartesian3.normalize(direction, new Cesium.Cartesian3())
    let ray = new Cesium.Ray(point2, c)
    let r = {}
    let pickedObjects = this.sdk.viewer.scene.drillPickFromRay(ray)
    for (let i = pickedObjects.length - 1; i >= 0; i--) {
      if (pickedObjects[i].position) {
        r = pickedObjects[i]
        break
      }
    }
    if (r && r.position) {
      height2 = this.cartesian3Towgs84(r.position, this.sdk.viewer).alt
    }
    let promise
    try {
      promise = await Cesium.sampleTerrainMostDetailed(
        this.sdk.viewer.terrainProvider,
        [
          Cesium.Cartographic.fromDegrees(
            this.options.positions.lng,
            this.options.positions.lat
          )
        ]
      )
    } catch (error) { }

    if ((height2 === void 0 || height2 < promise[0].height) && promise) {
      height2 = promise[0].height
    }
    if (height === void 0 || height < height2) {
      height = height2
    }
    if (height !== undefined) {
      this.options.positions.alt = Number(Number(height).toFixed(2))
      this._elms.alt &&
        this._elms.alt.forEach(item => {
          item.value = this.options.positions.alt
        })
      // this.scan && (this.scan.alt = v)
      // this.diffuse && (this.diffuse.alt = v)
      this.renewPoint()
      this.coordinate = this.options.coordinate

      if (this._elms.height) {
        let heightElm = this._elms.height.getElementsByClassName('height')[0]
        if (heightElm) {
          switch (this._elms.heightMode.value) {
            case '海拔高度':
              heightElm.value = this.options.positions.alt
              break
            case '相对地表':
              if (this.sdk.viewer.scene.terrainProvider.availability) {
                Cesium.sampleTerrainMostDetailed(
                  this.sdk.viewer.scene.terrainProvider,
                  [
                    Cesium.Cartographic.fromDegrees(
                      this.options.positions.lng,
                      this.options.positions.lat
                    )
                  ]
                ).then(position => {
                  heightElm.value = Number(
                    (this.options.positions.alt - position[0].height).toFixed(2)
                  )
                })
              } else {
                heightElm.value = this.options.positions.alt
              }
              break
            case '依附地表':
              break
            case '依附模型':
              heightElm.value = this.options.positions.alt
              break
          }
        }
      }
    }
  }

  async flyTo(options = {}) {
    setActiveViewer(0)
    closeRotateAround(this.sdk)
    closeViewFollow(this.sdk)

    if (
      this.options.customView &&
      this.options.customView.relativePosition &&
      this.options.customView.orientation
    ) {
      let orientation = {
        heading: Cesium.Math.toRadians(
          this.options.customView.orientation.heading || 0.0
        ),
        pitch: Cesium.Math.toRadians(
          this.options.customView.orientation.pitch || -60.0
        ),
        roll: Cesium.Math.toRadians(
          this.options.customView.orientation.roll || 0.0
        )
      }

      let lng = this.options.customView.relativePosition.lng
      let lat = this.options.customView.relativePosition.lat
      let alt = this.options.customView.relativePosition.alt
      let destination = Cesium.Cartesian3.fromDegrees(lng, lat, alt)

      let position = { lng: 0, lat: 0 }
      if (this.options.position) {
        position = { ...this.options.position }
      } else if (this.options.positions) {
        position = { ...this.options.positions }
      } else if (this.options.center) {
        position = { ...this.options.center }
      } else if (this.options.start) {
        position = { ...this.options.start }
      } else {
        if (this.options.hasOwnProperty('lng')) {
          position.lng = this.options.lng
        }
        if (this.options.hasOwnProperty('lat')) {
          position.lat = this.options.lat
        }
        if (this.options.hasOwnProperty('alt')) {
          position.alt = this.options.alt
        }
      }
      // 如果没有高度值，则获取紧贴高度计算
      if (!position.hasOwnProperty('alt')) {
        let objectsToExclude = []
        for (let [key, value] of this.sdk.entityMap) {
          if (value.type === 'RadarScanStereoscopic' && value.entity) {
            objectsToExclude.push(value.entity)
          }
        }
        position.alt = await this.getClampToHeight(position, objectsToExclude)
      }
      lng = this.options.customView.relativePosition.lng + position.lng
      lat = this.options.customView.relativePosition.lat + position.lat
      alt = this.options.customView.relativePosition.alt + position.alt
      destination = Cesium.Cartesian3.fromDegrees(lng, lat, alt)
      this.sdk.viewer.camera.flyTo({
        destination: destination,
        orientation: orientation
      })
    } else {
      let objectsToExclude = []
      for (let [key, value] of this.sdk.entityMap) {
        if (value.type === 'RadarScanStereoscopic' && value.entity) {
          objectsToExclude.push(value.entity)
        }
      }
      let height = await this.getClampToHeight(this.options.positions, objectsToExclude)
      this.sdk.viewer.camera.flyTo({
        orientation: options.orientation,
        destination: Cesium.Cartesian3.fromDegrees(
          this.options.positions.lng,
          this.options.positions.lat,
          height + (options.height || 500)
        )
      })
    }
  }

  setPosition(v) {
    this.options.positions.lng = v.position.lng
    this.options.positions.lat = v.position.lat
    this.options.positions.alt = v.position.alt
    this.renewPoint()
  }

  /**@desc 打开平移功能
   *
   * @memberOf Source
   * @param status {boolean}
   *
   * */
  set positionEditing(status) {
    if (!this.sdk || !this.sdk.viewer || !this.entity) {
      return
    }
    this.operate.positionEditing = status
    this.event && this.event.destroy()
    this.event = new MouseEvent(this.sdk)
    if (status === true) {
      this.picking = false
      this.tip && this.tip.destroy()
      this.tip = new MouseTip('点击鼠标左键确认，右键取消', this.sdk)
      this.previous = {
        positions: { ...this.options.positions }
      }
      let moveEvent = (movement, cartesian) => {
        this.entity.position = new Cesium.CallbackProperty(function () {
          return cartesian
        }, false)

        this.tip.setPosition(
          cartesian,
          movement.endPosition.x,
          movement.endPosition.y
        )
      }
      let leftEvent = (movement, cartesian) => {
        let positions = this.cartesian3Towgs84(cartesian, this.sdk.viewer)
        this.lng = positions.lng
        this.lat = positions.lat
        this.alt = positions.alt
        this.previous = {
          positions: { ...this.options.positions }
        }
        this.event.mouse_move(() => { })
        this.event.mouse_left(() => { })
        this.event.mouse_right(() => { })
        this.event.gesture_pinck_start(() => { })
        this.event.gesture_pinck_end(() => { })
        this.entity.position = new Cesium.CallbackProperty(function () {
          return cartesian
        }, false)
        this.positionEditing = false
      }
      this.event.mouse_move(moveEvent)
      this.event.mouse_left(leftEvent)
      this.event.mouse_right((movement, cartesian) => {
        this.positionEditing = false
      })

      this.event.gesture_pinck_start((movement, cartesian) => {
        let startTime = new Date()
        this.event.gesture_pinck_end(() => {
          let endTime = new Date()
          let pos = {
            position: {
              x: (movement.position1.x + movement.position2.x) / 2,
              y: (movement.position1.y + movement.position2.y) / 2
            }
          }
          if (endTime - startTime >= 500) {
            // 长按取消
            this.positionEditing = false
          } else {
            leftEvent(pos, cartesian)
          }
        })
      })
    } else {
      this.picking = true
      if (this.event) {
        this.event.mouse_move(() => { })
        this.event.mouse_left(() => { })
        this.event.mouse_right(() => { })
        this.event.gesture_pinck_start(() => { })
        this.event.gesture_pinck_end(() => { })
        this.event.destroy()
        this.event = null
      }
      this.tip && this.tip.destroy()
      this.lng = this.previous.positions.lng
      this.lat = this.previous.positions.lat
      this.alt = this.previous.positions.alt
      this.renewPoint()
    }
  }

  get positionEditing() {
    return this.operate.positionEditing
  }

  setDIV(options = { domid: '', x: 10, y: 10 }) {
    options.x = options.x || options.x === 0 ? options.x : 10
    options.y = options.y || options.y === 0 ? options.y : 10
    let siteInfoDom = document.getElementById(options.domid)
    let siteInfoPosition = Cesium.Cartesian3.fromDegrees(
      this.options.positions.lng,
      this.options.positions.lat
    )

    this.sdk.viewer.scene.postRender.addEventListener(percentage => {
      //转换到屏幕坐标
      if (
        siteInfoDom.style.display === 'block' ||
        siteInfoDom.style.display === ''
      ) {
        let winpos = this.sdk.viewer.scene.cartesianToCanvasCoordinates(
          siteInfoPosition
        )
        if (winpos) {
          siteInfoDom.style.left = (winpos.x + options.x).toFixed(0) + 'px'
          siteInfoDom.style.top = (winpos.y + options.y).toFixed(0) + 'px'
        }
      }
    })
  }

  async setCustomView(val) {
    if (val) {
      this.options.customView = val
    } else {
      let camera = this.sdk.viewer.camera
      let cameraPosition84 = this.cartesian3Towgs84(
        camera.position,
        this.sdk.viewer
      )

      let position = { lng: 0, lat: 0 }
      let relativePosition = { ...cameraPosition84 }
      if (this.options.positions) {
        position = { ...this.options.positions }
      } else {
        if (this.options.hasOwnProperty('lng')) {
          position.lng = this.options.lng
        }
        if (this.options.hasOwnProperty('lat')) {
          position.lat = this.options.lat
        }
        if (this.options.hasOwnProperty('alt')) {
          position.alt = this.options.alt
        }
      }
      // 如果没有高度值，则获取紧贴高度计算
      if (!position.hasOwnProperty('alt')) {
        let objectsToExclude = []
        for (let [key, value] of this.sdk.entityMap) {
          if (value.type === 'RadarScanStereoscopic' && value.entity) {
            objectsToExclude.push(value.entity)
          }
        }
        position.alt = await this.getClampToHeight(position, objectsToExclude)
      }
      relativePosition = {
        lng: cameraPosition84.lng - position.lng,
        lat: cameraPosition84.lat - position.lat,
        alt: cameraPosition84.alt - position.alt
      }

      this.options.customView = {
        orientation: {
          heading: Cesium.Math.toDegrees(camera.heading),
          pitch: Cesium.Math.toDegrees(camera.pitch),
          roll: Cesium.Math.toDegrees(camera.roll)
        },
        relativePosition: relativePosition
      }
      this.originalOptions &&
        (this.originalOptions.customView = this.options.customView)
    }
  }
}

export default BillboardObject