MapGIS Client for JavaScript API

import { defaultValue, getGUID } from '../../../util'
import { defined } from '../../../util'
import VectorTileRenderUtil from '../../support/VectorTileRenderUtil'

/**
 * ArcGIS矢量瓦片子图层
 * @class ArcGISVectorTileSubLayer
 * @moduleEX LayerModule
 * @extends SubLayer
 * @param {Object} options 构造参数
 * @param {BaseRenderer} [options.renderer] 渲染样式对象，支持如下渲染样式：<br/>
 * [1、单值渲染]{@link UniqueValueRenderer}<br/>
 * [2、分段渲染]{@link ClassBreakRenderer}
 * @param {String} [options.type] 矢量瓦片子图层的类型
 * @param {String} [options.id ] 矢量瓦片子图层的id
 * @param {String} [options.title] 矢量瓦片子图层的标题
 * @param {Boolean} [options.visible = true] 图层可见性
 * @param {IGSVectorTileLayer} [options.layer] 矢量瓦片父图层
 * @param {Array} [options.sublayers] 矢量瓦片子图层
 */
class ArcGISVectorTileSubLayer {
  constructor(options) {
    options = defaultValue(options, {})
    // 初始化矢量瓦片样式
    // 矢量瓦片标准的几类样式
    /**
     * 矢量瓦片子图层的类型 {@link https://docs.mapbox.com/mapbox-gl-js/style-spec/layers}
     * @member {String} ArcGISVectorTileSubLayer.prototype.type
     */
    this.type = defaultValue(options.type, '')

    /**
     * 矢量瓦片子图层的id
     * @member {String} ArcGISVectorTileSubLayer.prototype.id
     */
    this.id = defaultValue(options.id, getGUID())

    /**
     * 矢量瓦片子图层的标题
     * @member {String} ArcGISVectorTileSubLayer.prototype.title
     */
    this.title = defaultValue(options.title, '')
    // 初始化样式
    const style = defaultValue(options.style, {})
    if (!style.paint) {
      style.paint = {}
    }
    if (!style.layout) {
      style.layout = {}
    }
    // 访问器
    this._visible = defaultValue(
      options.visible,
      defined(style.layout.visibility)
        ? style.layout.visibility === 'visible'
        : true
    )
    this._minZoom = defaultValue(
      options.minZoom,
      defaultValue(style.minzoom, 0)
    )
    this._maxZoom = defaultValue(
      options.maxZoom,
      defaultValue(style.maxzoom, 24)
    )
    this._renderer = defaultValue(options.renderer, undefined)
    // mvt私有图层样式
    this._style = defaultValue(style, {})

    /**
     * 矢量瓦片图层
     * @member {IGSVectorTileLayer} ArcGISVectorTileSubLayer.prototype.layer
     */
    this.layer = defaultValue(options.layer, undefined)

    /**
     * 矢量瓦片子图层
     * @member {Array<ArcGISVectorTileSubLayer>} ArcGISVectorTileSubLayer.prototype.sublayers
     */
    this.sublayers = defaultValue(options.sublayers, [])
    // 传入样式统一
    this._updateStyle()
  }

  set minZoom(zoom) {
    this._minZoom = zoom
    this._style.minzoom = zoom
    if (this.layer) {
      this.layer.setStyleLayerZoomRange(this.id, this._minZoom, this._maxZoom)
    }
  }

  get minZoom() {
    return this._minZoom
  }

  set maxZoom(zoom) {
    this._maxZoom = zoom
    this._style.maxzoom = zoom
    if (this.layer) {
      this.layer.setStyleLayerZoomRange(this.id, this._minZoom, this._maxZoom)
    }
  }

  get maxZoom() {
    return this._maxZoom
  }

  /**
   * @description 渲染样式对象
   * @param {String} renderer
   */
  set renderer(renderer) {
    this._renderer = renderer
    const style = VectorTileRenderUtil.renderToStyle(
      renderer,
      this.type,
      JSON.parse(JSON.stringify(this._style))
    )
    if (style && this.layer) {
      const paint = style.paint
      const layout = style.layout
      if (paint) {
        this._style.paint = Object.assign(this._style.paint, paint)
        this.layer.setPaintProperties(this.id, paint)
      }
      if (layout) {
        this._style.layout = Object.assign(this._style.layout, layout)
        this.layer.setLayoutProperties(this.id, layout)
      }
    }
  }

  get renderer() {
    return this._renderer
  }

  set visible(flag) {
    this._visible = flag
    if (this.layer) {
      const visibleDesc = this._visible ? 'visible' : 'none'
      this.style.layout['visibility'] = visibleDesc
      this.layer.setLayoutProperties(this.id, this.style.layout)
    }
  }

  get visible() {
    return this._visible
  }

  get style() {
    return this._style || {}
  }

  set style(style) {
    this._style = style
  }

  set filter(filterStr) {
    this._style.filter = filterStr
    if (this.layer) {
      this.layer.setStyleLayerFilter(this.id, this._style.filter)
    }
  }

  get filter() {
    return this._style.filter
  }

  _updateStyle() {
    // 更新renderer
    if (this._renderer) {
      const style = VectorTileRenderUtil.renderToStyle(
        this._renderer,
        this.type,
        JSON.parse(JSON.stringify(this._style))
      )
      if (style) {
        const paint = style.paint
        const layout = style.layout
        this._style.paint = Object.assign(this._style.paint, paint)
        this._style.layout = Object.assign(this._style.layout, layout)
      }
    }
    // 更新visible
    const visibleDesc = this._visible ? 'visible' : 'none'
    this.style.layout['visibility'] = visibleDesc
    // 更新zoom
    this._style.minzoom = this._minZoom
    this._style.maxzoom = this._maxZoom
  }

  /**
   * 通过json对象初始化该对象
   * @param {Object} json json对象
   * @memberof ArcGISVectorTileSubLayer
   */
  fromJSON(json) {
    json = defaultValue(json, {})
    this.type = defaultValue(json.type, this.type)
    this.id = defaultValue(json.id, this.id)
    this.title = defaultValue(json.title, this.title)
    this._style = defaultValue(json.style, this._style)
    this._visible = defaultValue(json.visible, this._visible)
    this._minZoom = defaultValue(json.minZoom, this._minZoom)
    this._maxZoom = defaultValue(json.maxZoom, this._maxZoom)
    this._renderer = defaultValue(json.renderer, this._renderer)
  }

  /**
   * 将图层转为json对象
   * @return {Object} josn对象
   * */
  toJSON() {
    return {
      type: this.type,
      id: this.id,
      title: this.title,
      style: this._style,
      visible: this.visible,
      minZoom: this.minZoom,
      maxZoom: this.maxZoom,
      renderer: this.renderer ? this.renderer.toJSON() : null
    }
  }

  /**
   * 克隆图层对象
   * @return {ArcGISVectorTileSubLayer} 克隆后的图层对象
   */
  clone() {
    return new ArcGISVectorTileSubLayer(this.toJSON())
  }
}

export default ArcGISVectorTileSubLayer