sdk4.0_new/src/Obj/Base/GeoJson/index2.js

/**
 * @name: index
 * @author: Administrator
 * @date: 2023-03-04 10:39
 * @description：index
 * @update: 2023-03-04 10:39
 */
import { getHost } from "../../../on";
import Base from '../index'
import Tools from '../../../Tools'

class GeoJson extends Base {
  /**
   * @constructor
   * @param sdk
   * @param options {object} 参数
   * @param options.id {string} id
   * @param options.url {string} geojson地址
   * @param [options.color=#ef0606] {string} 线条颜色
   * @param [options.width=1] {number}  线条宽度
   * @example new YJ.Obj.GeoJson(earth,{id:"123",url:""})
   * */
  constructor(sdk, options = {}) {
    super(sdk, options)

    this.primitive = undefined
    this.positions = []

    this.loading = true
  }

  setDefaultValue() {
    super.setDefaultValue()
    this.options.host = this.options.host || getHost()
    let url = this.options.url
    if(this.options.host) {
      let o = new URL(this.options.url, this.options.host)
      url = o.href
    }
    
    this.options.url = url
    this.options.color = this.options.color || '#ef0606'
    this.options.width = this.options.width || 1
  }

  get show() {
    if (this.primitive) return this.primitive.show
    return undefined
  }

  set show(status) {
    if (this.primitive) {
      this.primitive.show = status
    }
  }

  async on() {
    let rsp = await fetch(this.options.url)
    let json = await rsp.json()
    return GeoJson.addDataToGlobe(this, json.features)
  }

  /*geojosn暂时只用线的形式*/
  static addDataToGlobe(that, features) {
    const instances = []
    for (let i = 0; i < features.length; i++) {
      let positions = []
      if ('LineString' === features[i].geometry.type) {
        features[i].geometry.coordinates.forEach(c => {
          that.positions.push({ lng: c[0], lat: c[1] })
          positions.push(c[0], c[1])
        })
      }
      if ('Polygon' === features[i].geometry.type) {
        features[i].geometry.coordinates.forEach(polygon => {
          polygon.forEach(c => {
            that.positions.push({ lng: c[0], lat: c[1] })
            positions.push(c[0], c[1])
          })
        })
      }

      const polyline = new Cesium.GroundPolylineGeometry({
        positions: Cesium.Cartesian3.fromDegreesArray(positions),
        width: that.options.width //线宽
        // vertexFormat: Cesium.PolylineColorAppearance.VERTEX_FORMAT
      })
      // let geometry = Cesium.PolylineGeometry.createGeometry(polyline)
      instances.push(
        new Cesium.GeometryInstance({
          geometry: polyline
          // attributes: {
          //   color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.BLUE),
          // },
        })
      )
    }

    that.primitive = new Cesium.GroundPolylinePrimitive({
      geometryInstances: instances,
      // appearance: new Cesium.PerInstanceColorAppearance({ // 为每个instance着色
      //   translucent: true,
      //   closed: false
      // }),
      appearance: new Cesium.PolylineMaterialAppearance({
        material: Cesium.Material.fromType('Color', {
          color: Cesium.Color.fromCssColorString(that.options.color)
        })
      }),
      asynchronous: false, // 确定基元是异步创建还是阻塞直到准备就绪
      show: that.options.show ?? true
    })
    that.viewer.scene.primitives.add(that.primitive)
    that.loading = false
  }

  remove() {
    if (this.primitive) {
      super.remove()
      this.viewer.scene.primitives.remove(this.primitive)
      this.primitive = null
    }
  }

  flyTo() {
    if (!this.loading) {
      if (this.positions) {
        let arr = new Tools().cal_envelope(this.positions)
        var rectangle = new Cesium.Rectangle.fromDegrees(
          arr[0][0],
          arr[0][1],
          arr[2][0],
          arr[2][1]
        )
        this.viewer.camera.flyTo({
          destination: rectangle
        })
      }
    }
  }

  flicker() {}
}

export default GeoJson