    import { Zondy, Collection, WMTSStyle } from '../../../base'
    import { LayerType, LoadStatus } from '../../../base/enum'
    import { defaultValue, Log, toJSON } from '../../../util'
    import { WMTSServer } from '../../../service'
    import WMTSSubLayer from './WMTSSubLayer'
    import TileMatrixSet from '../../../base/TileMatrixSet'
    import { Extent, Point, SpatialReference } from '../../../base/geometry'
    import {
      getEPSGCodeFromOGCSupportedCRSString,
      getEPSGFromTileMatrixSetId,
      getTileResolution,
      initCorporationType
    } from '../support/Utils'
    import OGCLayer from './OGCLayer'
    import TileInfo from '../support/TileInfo'
    import LOD from '../support/LOD'
    import Projection from '../../../base/Projection'

    /**
     * WMTS图层，<br>
     * 目前二维上支持4326(包括4490，4214以及4610)，3857以及EPSG支持的自定义坐标系，三维上仅支持4326(包括4490，4214以及4610)以及3857坐标系，WMTS服务会自动读取元信息上的坐标系，不需要用户指定
     * <br><br>[ES5引入方式]：<br/>
     * Zondy.Layer.WMTSLayer() <br/>
     * [ES6引入方式]：<br/>
     * import { WMTSLayer } from "@mapgis/webclient-common" <br/>
     * <br/>
     * 针对图层的操作请在图层加载完毕事件中进行<br/>
     * Layer.on('layerview-created', function (result) {<br/>
     *   console.log("加载完毕:", result.layer)<br/>
     * });<br/>
     * 如果不想在该事件中放入业务代码，则请确认图层资源已加载完毕后再进行操作<br/>
     * if(layer.loadStatus === 'loaded') {<br/>
     *   // 你的业务逻辑<br/>
     * }
     * @class WMTSLayer
     * @moduleEX LayerModule
     * @extends OGCLayer
     * @fires Layer#图层加载完毕事件
     * @fires Layer#图层销毁完毕事件
     * @fires Layer#图层更新完毕事件
     * @fires Layer#图层显隐更新完毕事件
     * @fires Layer#图层透明度更新完毕事件
     * @fires Layer#图层顺序更新完毕事件
     * @fires Layer#图层刷新完毕事件
     * @param {Object} options 构造参数
     * @param {String} [options.url] 服务基地址，支持如下服务：<br/>
     * 1、支持MapGIS的WMTS服务，格式为：http://{ip}:{port}/igs/rest/services/{ServiceName}/WMTSServer，请注意，当在IGS中发布自定义坐标系的WMTS服务时，可能会有部分地图无法正确的进行预览，
     * 并且该服务中的范围参数是错误的，请自行指定跳转范围，或从该服务对应的瓦片服务中获取，参考示例：<a href='#MapIGS'>[加载MapGIS的WMTS服务]</a><br/>
     * 2、支持ArcGIS的WMTS服务，格式为：http://{ip}:{port}/arcgis/rest/services/{ServiceName}/MapServer/WMTS，参考示例：<a href='#ArcGIS'>[加载ArcGIS的WMTS服务]</a><br/>
     * 3、支持天地图的WMTS服务：格式为：http://t{0~6的随机数}.tianditu.gov.cn/{图层类型}_{坐标系}/wmts，<br/>
     * 其中天地图层类型如下：<br/>
     * vec：矢量底图、img：卫星影像底图、cva: 矢量注记图层（中文）、eva: 矢量注记图层（英文）、cia: 注记图层（中文）、eia: 注记图层（英文）、ter: 地形晕渲底图、cta: 注记（中文）、ibo: 全球国界<br/>
     * 坐标系如下：<br/>
     * w：墨卡托坐标系(3857)、c：经纬度坐标系(4326)<br/>
     * 参考示例：<a href='#tdt'>[加载天地图的WMTS服务]</a><br/>
     * @param {Number} [options.opacity = 1] 图层透明度，0到1之间的值，0为完全透明，1为不透明，参考示例：<a href='#opacity'>[修改图层透明度]
     * @param {Boolean} [options.visible = true] 图层显示或隐藏，true则显示，false则隐藏，参考示例：<a href='#visible'>[设置图层显隐]
     * @param {Number} [options.minScale = 0] 最小缩放级数，仅会请求级数大于等于minScale的图片
     * @param {Number} [options.maxScale = 19] 最大缩放级数，仅会请求级数小于等于maxScale的图片
     * @param {String} [options.tokenKey = 'token'] token名
     * @param {String} [options.tokenValue] token值，只有当tokenValue存在时，才会绑定token
     * @param {Polygon|Extent|Circle|null} [options.clippingArea = null] 图层空间裁剪范围，仅支持多边形裁剪、矩形裁剪、圆形裁剪
     *
     * @summary <h5>支持如下方法：</h5>
     * <a href='#load'>[1、加载图层资源]</a><br/>
     * <a href='#findSublayerById'>[2、根据子图层id查询图层]</a><br/>
     * <a href='#fromServerUrl'>[3、通过url创建图层对象]</a><br/>
     * <a href='#fromJSON'>[4、通过传入的json构造并返回一个新的几何对象]</a><br/>
     * [5、导出为json对象]{@link OGCLayer#toJSON}<br/>
     * [6、克隆几何对象]{@link OGCLayer#clone}
     *
     * @example <caption><h7 id='MapIGS'>加载WMTS图层</h7></caption>
     * // ES5引入方式
     * const { Map, MapView, SceneView } = Zondy
     * const { WMTSLayer } = Zondy.Layer
     * // ES6引入方式
     * import { Map, MapView, SceneView, WMTSLayer } from "@mapgis/webclient-common"
     * // 初始化图层管理容器
     * const map = new Map();
     * // 初始化二维地图视图对象
     * const mapView = new MapView({
     *   // 视图id
     *   viewId: "viewer-id",
     *   // 图层管理容器
     *   map: map
     * });
     * // 初始化三维地图视图对象
     * const mapView = new SceneView({
     *   // 视图id
     *   viewId: "viewer-id",
     *   // 图层管理容器
     *   map: map
     * });
     * // 初始化WMTS图层
     * const wmtsLayer = new WMTSLayer({
     *   // 服务基地址
     *   url: 'http://{ip}:{port}/igs/rest/services/{serviceName}/WMTSServer'
     * });
     * // 将图层加入容器中
     * map.add(wmtsLayer);
     * // 图层加载完毕
     * wmsLayer.on('layerview-created', function (result) {
     *   console.log("加载完毕:", result.layer)
     *   // 视点跳转
     *   sceneView.flyTo({
     *     extent: result.layer.extent
     *   })
     * });
     *
     * @example <caption><h7 id='ArcGIS'>添加ArcGIS的WMTS图层示例</h7></caption>
     * // ES5引入方式
     * const { Map, MapView, SceneView } = Zondy
     * const { WMTSLayer } = Zondy.Layer
     * // ES6引入方式
     * import { Map, MapView, SceneView, WMTSLayer } from "@mapgis/webclient-common"
     * // 初始化图层管理容器
     * const map = new Map();
     * // 初始化二维地图视图对象
     * const mapView = new MapView({
     *   // 视图id
     *   viewId: "viewer-id",
     *   // 图层管理容器
     *   map: map
     * });
     * // 初始化三维地图视图对象
     * const mapView = new SceneView({
     *   // 视图id
     *   viewId: "viewer-id",
     *   // 图层管理容器
     *   map: map
     * });
     * // 初始化WMTS图层
     * const wmtsLayer = new WMTSLayer({
     *   url: 'http://{ip}:{port}/arcgis/rest/services/{serviceName}/MapServer/WMTS'
     * });
     * // 将图层加入容器中
     * map.add(wmtsLayer);
     * // 图层加载完毕
     * wmsLayer.on('layerview-created', function (result) {
     *   console.log("加载完毕:", result.layer)
     *   // 视点跳转
     *   sceneView.flyTo({
     *     extent: result.layer.extent
     *   })
     * });
     *
     * @example <caption><h7 id='tdt'>加载天地图的WMTS服务</h7></caption>
     * // ES5引入方式
     * const { Map, MapView, SceneView } = Zondy
     * const { WMTSLayer } = Zondy.Layer
     * // ES6引入方式
     * import { Map, MapView, SceneView, WMTSLayer } from "@mapgis/webclient-common"
     * // 初始化图层管理容器
     * const map = new Map();
     * // 初始化二维地图视图对象
     * const mapView = new MapView({
     *   // 视图id
     *   viewId: "viewer-id",
     *   // 图层管理容器
     *   map: map
     * });
     * // 初始化三维地图视图对象
     * const mapView = new SceneView({
     *   // 视图id
     *   viewId: "viewer-id",
     *   // 图层管理容器
     *   map: map
     * });
     * 初始化WMTS图层
     * const wmtsLayer = new WMTSLayer({
     *   // 加载经纬度的影像地图
     *   url: 'http://t6.tianditu.gov.cn/img_c/wmts',
     *   // 天地图必须加token，且token名为tk
     *   tokenKey: 'tk',
     *   // token请在天地图官网申请
     *   tokenValue: '天地图token'
     * });
     * // 将图层加入容器中
     * map.add(wmtsLayer);
     * // 图层加载完毕
     * wmsLayer.on('layerview-created', function (result) {
     *   console.log("加载完毕:", result.layer)
     *   // 视点跳转
     *   sceneView.flyTo({
     *     extent: result.layer.extent
     *   })
     * });
     *
     * @example <caption><h7 id='opacity'>修改图层透明度</h7></caption>
     * // ES5引入方式
     * const { WMTSLayer } = Zondy.Layer
     * // ES6引入方式
     * import { WMTSLayer } from "@mapgis/webclient-common"
     * // 初始化时设置
     * const wmtsLayer = new WMTSLayer({
     *   // 服务基地址
     *   url: 'http://{ip}:{port}/igs/rest/services/{serviceName}/WMTSServer',
     *   // 设置透明度
     *   opacity: 1.0
     * });
     * // 将图层加入容器中
     * map.add(wmtsLayer);
     *
     * // 加载完成后设置
     * wmsLayer.on('layerview-created', function (result) {
     *   console.log("加载完毕:", result.layer)
     *   // 设置透明度
     *   wmtsLayer.opacity = 0.5
     * })
     *
     * @example <caption><h7 id='visible'>设置图层显隐</h7></caption>
     * // ES5引入方式
     * const { WMTSLayer } = Zondy.Layer
     * // ES6引入方式
     * import { WMTSLayer } from "@mapgis/webclient-common"
     * // 初始化时设置
     * const wmtsLayer = new WMTSLayer({
     *   // 服务基地址
     *   url: 'http://{ip}:{port}/igs/rest/services/{serviceName}/WMTSServer',
     *   // 设置图层显隐
     *   visible: true
     * });
     * // 将图层加入容器中
     * map.add(wmtsLayer);
     *
     * // 加载完成后设置
     * wmsLayer.on('layerview-created', function (result) {
     *   console.log("加载完毕:", result.layer)
     *   // 设置图层显隐
     *   wmtsLayer.visible = !wmtsLayer.visible
     * })
     *
     * @example <caption><h7>删除图层</h7></caption>
     * map.remove(wmtsLayer)
     */
    class WMTSLayer extends OGCLayer {
      constructor(options) {
        super(options)
        options = defaultValue(options, {})

        /**
         * 图层类型
         * @readonly
         * @member {type} WMTSLayer.prototype.type
         */
        this.type = LayerType.wmts

        /**
         * 当前处于活动状态的子图层
         * @member {WMTSSubLayer} WMTSLayer.prototype.activeLayer
         */
        this.activeLayer = defaultValue(options.activeLayer, new WMTSSubLayer())
        /**
         * WMTSSublayer 子图层对象的集合
         * @readonly
         * @member {Array<WMTSSubLayer>} WMTSLayer.prototype.sublayers
         */
        this.sublayers = defaultValue(options.sublayers, new Collection())
        if (!(this.sublayers instanceof Collection)) {
          this.sublayers = new Collection(this.sublayers)
        }
        /**
         * 服务基地址
         * @readonly
         * @member {String} WMTSLayer.prototype.url
         */
        this.url = defaultValue(options.url, undefined)
        /**
         * 空间参考
         * @readonly
         * @member {SpatialReference} WMTSLayer.prototype.spatialReference
         */
        this.spatialReference = SpatialReference.fromJSON(options.spatialReference)
        /**
         * 图块矩阵集的集合
         * @readonly
         * @member {Array<TileMatrixSet>} WMTSLayer.prototype.tileMatrixSets
         */
        this.tileMatrixSets = defaultValue(options.tileMatrixSets, [])
        /**
         * WMTS 公司代码
         * @readonly
         * @member {String} WMTSLayer.prototype.corporationType
         */
        this.corporationType = initCorporationType(this.url)
        /**
         * 最小缩放级别
         * @member {Number} WMTSLayer.prototype.minScale
         */
        this.minScale = defaultValue(options.minScale, 0)
        /**
         * 最大缩放级别
         * @member {Number} WMTSLayer.prototype.maxScale
         */
        this.maxScale = defaultValue(options.maxScale, 19)
        /**
         * 图片宽度
         * @readonly
         * @member {Number} WMTSLayer.prototype.imageWidth
         */
        this.imageWidth = 256
        /**
         * 图片高度
         * @readonly
         * @member {Number} WMTSLayer.prototype.imageHeight
         */
        this.imageHeight = 256
        // 空间裁剪范围
        this._clippingArea = defaultValue(options.clippingArea, null)
        // 地图服务对象
        this._mapServer = new WMTSServer({
          url: this.url
        })
      }

      /**
       * 通过传入的json构造并返回一个新的几何对象<a id='fromJSON'></a>
       * @param {Object} [json] JSON对象
       * @example <caption><h7>通过传入的json构造并返回一个新的几何对象</h7></caption>
       * // ES5引入方式
       * const { WMTSLayer } = Zondy.Layer
       * // ES6引入方式
       * import { WMTSLayer } from "@mapgis/webclient-common"
       * const json = {
       *   // 服务基地址
       *   url: 'http://{ip}:{port}/igs/rest/services/{serviceName}/WMTSServer'
       * }
       * const wmtsLayer = new WMTSLayer.fromJSON(json)
       */
      static fromJSON(json) {
        json = defaultValue(json, {})
        const _layer = new WMTSLayer(json)
        _layer.imageWidth = json.imageWidth
        _layer.imageHeight = json.imageHeight

        return _layer
      }

      /**
       * @description 转换为json对象
       * @return {Object} json对象
       */
      toJSON() {
        const json = super.toJSON()
        json.type = this.type
        json.activeLayer = toJSON(this.activeLayer, WMTSSubLayer)
        json.url = this.url
        json.spatialReference = toJSON(this.spatialReference, SpatialReference)
        json.corporationType = this.corporationType
        json.minScale = this.minScale
        json.maxScale = this.maxScale
        json.imageWidth = this.imageWidth
        json.imageHeight = this.imageHeight

        const _sublayers = []
        this.sublayers.forEach(function (sublayer) {
          _sublayers.push(toJSON(sublayer, WMTSSubLayer))
        })
        json.sublayers = _sublayers

        const _tileMatrixSets = []
        for (let i = 0; i < this.tileMatrixSets.length; i++) {
          _tileMatrixSets.push(toJSON(this.tileMatrixSets[i], TileMatrixSet))
        }
        json.tileMatrixSets = _tileMatrixSets

        return json
      }

      /**
       * 加载图层资源<a id='load'></a>
       * @example <caption><h7>不加载图层，仅获取图层信息</h7></caption>
       * // ES5引入方式
       * const { WMTSLayer } = Zondy.Layer
       * // ES6引入方式
       * import { WMTSLayer } from "@mapgis/webclient-common"
       * // 初始化图层
       * const wmtsLayer = new WMTSLayer({
       *   // 服务基地址
       *   url: 'http://{ip}:{port}/igs/rest/services/{serviceName}/WMTSServer'
       * });
       * wmtsLayer.load().then((result) => {
       *   // 获取完图层信息
       *   console.log(wmtsLayer)
       * })
       */
      load() {
        return super.load()
      }

      /**
       * 子类加载服务端资源方法
       * @private
       * */
      _load() {
        const self = this
        return this._mapServer.getCapabitities().then((result) => {
          Log.info('MapServer信息查询成功:', result)
          const data = result.data

          // IGS2.0服务
          if (
            self.url.indexOf('/igs/rest/services/') > -1 ||
            self.url.indexOf('/arcgis/rest/services/') > -1 ||
            self.url.indexOf('.tianditu.gov.cn/') > -1
          ) {
            // 获取tileMatrixSets
            data.tileMatrixSet.forEach((tileMatrixSet) => {
              const _epsgCode = getEPSGCodeFromOGCSupportedCRSString(
                tileMatrixSet.supportedCRS
              )
              const _spatialReference = new SpatialReference({
                wkid: _epsgCode
              })
              const _topLeftCorner =
                tileMatrixSet.tileMatrix[0].topLeftCorner.split(' ')
              const _lods = []
              tileMatrixSet.tileMatrix.forEach(function (tileMatrix, index) {
                const _lod = new LOD()
                // identifier不一定与level的数字对应，可能是一个字符串形式
                _lod.level = tileMatrix.identifier
                _lod.scale = Number(tileMatrix.scaleDenominator)
                if (tileMatrix.identifier) {
                  // 存在两种情况，其一是参照系:级数,其二是只为级数
                  const _pos = tileMatrix.identifier.lastIndexOf(':')
                  if (_pos >= 0) {
                    _lod.levelValue = parseInt(
                      tileMatrix.identifier.substring(_pos + 1)
                    )
                  } else {
                    _lod.levelValue = parseInt(tileMatrix.identifier)
                  }
                }
                _lod.resolution = getTileResolution(
                  tileMatrixSet.identifier,
                  self.corporationType,
                  _lod.scale,
                  _spatialReference
                )
                _lods.push(_lod)
              })
              // 经纬度或者高斯坐标左上角的点坐标是反的，YX
              let _coordinates
              // 经纬度坐标系
              if (_spatialReference.isGeographic) {
                _coordinates = [
                  Number(_topLeftCorner[1]),
                  Number(_topLeftCorner[0])
                ]
              }
              // 高斯坐标系
              else if (
                (_spatialReference.wkid >= 2327 &&
                  _spatialReference.wkid <= 2442) ||
                (_spatialReference.wkid >= 4491 &&
                  _spatialReference.wkid <= 4554) ||
                (_spatialReference.wkid >= 21413 &&
                  _spatialReference.wkid <= 21423) ||
                (_spatialReference.wkid >= 21473 && _spatialReference.wkid <= 21483)
              ) {
                _coordinates = [
                  Number(_topLeftCorner[1]),
                  Number(_topLeftCorner[0])
                ]
              }
              // 天地图的3857坐标系是反的，YX
              else if (self.url.indexOf('.tianditu.gov.cn/') > -1) {
                // 中文注记墨卡托服务的原点是经纬度，因此要转成墨卡托坐标，由于原点纬度超过了85.05度，之上的投影都是错误的，因此写死，不进行投影
                // 参考资料https://zh.wikipedia.org/wiki/Web%E5%A2%A8%E5%8D%A1%E6%89%98%E6%8A%95%E5%BD%B1
                if (self.url.indexOf('/_w/') > -1) {
                  _coordinates = [-20037508.3427892, 20037508.3427892]
                } else {
                  _coordinates = [
                    Number(_topLeftCorner[1]),
                    Number(_topLeftCorner[0])
                  ]
                }
              }
              // 其他坐标系是正的，XY
              else {
                _coordinates = [
                  Number(_topLeftCorner[0]),
                  Number(_topLeftCorner[1])
                ]
              }
              const _tileInfo = new TileInfo({
                origin: new Point({
                  coordinates: _coordinates,
                  spatialReference: _spatialReference
                }),
                size: [
                  Number(tileMatrixSet.tileMatrix[0].tileWidth),
                  Number(tileMatrixSet.tileMatrix[0].tileHeight)
                ],
                lods: _lods,
                spatialReference: _spatialReference
              })
              self.tileMatrixSets.push(
                new TileMatrixSet({
                  extent: '',
                  id: tileMatrixSet.identifier,
                  tileInfo: _tileInfo,
                  layer: self,
                  tileMatrix: tileMatrixSet.tileMatrix,
                  identifier: tileMatrixSet.identifier,
                  supportedCRS: tileMatrixSet.supportedCRS
                })
              )
            })
            // 设置activeLayer以及坐标系
            if (Array.isArray(data.layer)) {
              data.layer.forEach((layer, index) => {
                if (index === 0) {
                  self.activeLayer = self._createWMTSSubLayer(layer, data)
                  self.spatialReference = new SpatialReference(
                    getEPSGFromTileMatrixSetId(layer.tileMatrixSetId)
                  )
                }
                self.sublayers.add(self._createWMTSSubLayer(layer, data))
              })
            }
            // 地图文档中只有一个图层的情况
            else {
              if (typeof data.layer.boundingBox.lowerCorner === 'string') {
                data.layer.boundingBox.lowerCorner =
                  data.layer.boundingBox.lowerCorner.split(' ')
              }
              if (typeof data.layer.boundingBox.upperCorner === 'string') {
                data.layer.boundingBox.upperCorner =
                  data.layer.boundingBox.upperCorner.split(' ')
              }
              // 遍历所有的tileMatrixSets，找到identifier包含028mm_GB的子元素
              // 暂时这样做，没找到更好的处理方法
              for (let i = 0; i < self.tileMatrixSets.length; i++) {
                if (
                  self.tileMatrixSets[i].identifier.indexOf('028mm_GB') > -1 ||
                  self.tileMatrixSets[i].identifier === 'default' ||
                  self.tileMatrixSets[i].identifier === 'default028mm' ||
                  self.tileMatrixSets[i].identifier === 'w' ||
                  self.tileMatrixSets[i].identifier === 'c'
                ) {
                  // 获取坐标系wkid
                  const supportedCRS =
                    self.tileMatrixSets[i].supportedCRS.split(':')
                  const wkid = Number(supportedCRS[supportedCRS.length - 1])
                  // 初始化坐标系
                  const spatialReference = new SpatialReference({
                    wkid
                  })
                  // 获取瓦片大小
                  self.imageWidth = defaultValue(
                    Number(self.tileMatrixSets[i].tileMatrix[0].tileWidth),
                    256
                  )
                  self.imageHeight = defaultValue(
                    Number(self.tileMatrixSets[i].tileMatrix[0].tileHeight),
                    256
                  )
                  self._spatialReference = spatialReference
                  // 设置地图范围
                  self.extent = self._getExtentFromBoundingBox(
                    data.layer.boundingBox,
                    self.url
                  )
                }
              }
              // 指定激活图层
              self.activeLayer = self._createWMTSSubLayer(
                data.layer,
                self.tileMatrixSets
              )
              // 新增子图层
              self.sublayers.add(
                self._createWMTSSubLayer(data.layer, self.tileMatrixSets)
              )
            }
            return new Promise((resolve) => {
              self.loadStatus = LoadStatus.loaded
              self.loaded = true
              resolve(self)
            })
          }
        })
      }

      /**
       * @description 根据id查询子图层<a id='findSublayerById'></a>
       * @param {Object} id 子图层的id
       * @return {WMTSSubLayer} 找到的子图层对象
       */
      findSublayerById(id) {
        return this.sublayers.items[id]
      }

      /**
       * 从WMTS的boundingBox参数中构造外包盒，注意天地图的范围坐标是YX，其他的都是XY
       * @private
       * @param {Object} boundingBox WMTS的boundingBox属性
       * @param {String} url 服务基地址，用来判定服务厂商
       * @return {Extent} 图层范围
       * */
      _getExtentFromBoundingBox(boundingBox, url) {
        let _extent
        // 天地图的范围坐标是反的
        if (url.indexOf('.tianditu.gov.cn/') > -1) {
          _extent = new Extent({
            xmin: Number(boundingBox.lowerCorner[0]),
            ymin: Number(boundingBox.lowerCorner[1]),
            xmax: Number(boundingBox.upperCorner[0]),
            ymax: Number(boundingBox.upperCorner[1]),
            spatialReference: SpatialReference.fromJSON(this.spatialReference)
          })
        }
        // 其他的是正的
        else {
          _extent = new Extent({
            xmin: Number(boundingBox.lowerCorner[1]),
            ymin: Number(boundingBox.lowerCorner[0]),
            xmax: Number(boundingBox.upperCorner[1]),
            ymax: Number(boundingBox.upperCorner[0]),
            spatialReference: SpatialReference.fromJSON(this.spatialReference)
          })
        }

        return _extent
      }

      _createWMTSSubLayer(layerJson, tileMatrixSets) {
        // 获取图层范围
        const _extent = this._getExtentFromBoundingBox(
          layerJson.boundingBox,
          this.url
        )

        return new WMTSSubLayer({
          identifier: layerJson.identifier,
          title: layerJson.title,
          description: 'WMTS子图层',
          imageFormat: layerJson.format,
          imageFormats: [layerJson.format],
          styleId: Array.isArray(layerJson.Style)
            ? layerJson.Style[0].identifier
            : layerJson.Style.identifier,
          styles: [
            new WMTSStyle({
              id: layerJson.Style.identifier,
              title: layerJson.Style.title
            })
          ],
          tileMatrixSets,
          tileMatrixSetId: tileMatrixSets[0].identifier,
          extent: _extent,
          resourceURLTemplates: []
        })
      }
    }

    /**
     * 通过url创建图层对象<a id='fromServerUrl'></a>
     * @param {String} url 服务基地址
     * @return {WMTSLayer} 新的图层对象
     * @example <caption><h7>通过url创建图层对象</h7></caption>
     * // ES5引入方式
     * const { WMTSLayer } = Zondy.Layer
     * // ES6引入方式
     * import { WMTSLayer } from "@mapgis/webclient-common"
     * // 初始化图层
     * const url = 'http://{ip}:{port}/igs/rest/services/{serviceName}/WMTSServer';
     * const wmtsLayer = new WMTSLayer.fromServerUrl(url);
     * */
    WMTSLayer.fromServerUrl = function (url) {
      return new WMTSLayer({
        url
      })
    }

    Object.defineProperties(WMTSLayer.prototype, {
      /**
       * 空间裁剪范围
       * @member WMTSLayer.prototype.clippingArea
       * @type {Polygon|Extent|Circle|null}
       */
      clippingArea: {
        get() {
          return this._clippingArea
        },
        set(value) {
          this._clippingArea = value
          this._fireUpdateEvent('空间裁剪区域', [
            {
              name: 'clippingArea',
              params: [this._clippingArea],
              dataChanged: true,
              operationType: 'property'
            }
          ])
        }
      }
    })

    Zondy.Layer.WMTSLayer = WMTSLayer
    export default WMTSLayer