MapGIS Client for JavaScript API

import { defaultValue } from '../../util'
import Zondy from '../Zondy'
import { SymbolType } from '../enum'
import MarkerSymbol from './MarkerSymbol'

/**
 * 图片Marker符号，支持点几何对象，参考示例：<a href='#new-PictureMarkerSymbol'>[图片Marker样式]</a>
 * <br><br>[ES5引入方式]：<br/>
 * Zondy.Symbol.PictureMarkerSymbol() <br/>
 * [ES6引入方式]：<br/>
 * import { PictureMarkerSymbol } from "@mapgis/webclient-common" <br/>
 * <br/>
 * @class PictureMarkerSymbol
 * @moduleEX SymbolModule
 * @extends MarkerSymbol
 * @param {Object} options 构造参数
 * @param {Color|String} [options.color = new Color(255, 255, 255, 1)] 覆盖颜色，默认为白色
 * @param {Number} [options.width = 20] 图片宽度，单位像素
 * @param {Number} [options.height = 20] 图片高度，单位像素
 * @param {String} [options.url = ''] 图片url,支持图片base64编码加载
 * @param {Number} [options.xoffset = 0] marker的x轴偏移，单位像素
 * @param {Number} [options.yoffset = 0] marker的y轴偏移，单位像素
 * @param {Number} [options.angle = 0 ] 旋转角度，单位度，0~360度
 *
 * @summary <h5>支持如下方法：</h5>
 * [1、克隆并返回新的符号对象]{@link Symbol#clone} <br/>
 * [2、导出一个JSON对像]{@link Symbol#toJSON} <br/>
 * <a href='#fromJSON'>[3、通过json构造并返回一个新的PictureMarkerSymbol对象]</a>
 *
 * @example <caption><h7 id='new-PictureMarkerSymbol'>创建图片Marker样式对象</h7></caption>
 * // ES5引入方式
 * const { PictureMarkerSymbol } = Zondy.Symbol
 * const { Color } = Zondy
 * // ES6引入方式
 * import { PictureMarkerSymbol, Color } from "@mapgis/webclient-common"
 * const pictureMarkerSymbol = new PictureMarkerSymbol({
 *   // 覆盖颜色
 *   color: new Color(252, 100, 22, 1),
 *   // 旋转角度，单位度，0~360度
 *   angle: 90,
 *   // marker的x轴偏移，单位像素
 *   xoffset: -1,
 *   // marker的y轴偏移，单位像素
 *   yoffset: 5,
 *   // 图片高度，单位像素
 *   height: 20,
 *   // 图片宽度，单位像素
 *   width: 30,
 *   // 图片url
 *   url: "图片url"
 * });
 */
class PictureMarkerSymbol extends MarkerSymbol {
  constructor(options) {
    super(options)
    options = defaultValue(options, {})

    /**
     * 符号类型
     * @member {String} PictureMarkerSymbol.prototype.type
     */
    this.type = SymbolType.pictureMarker

    /**
     * 图片宽度
     * @member {Number} PictureMarkerSymbol.prototype.width
     */
    this.width = defaultValue(options.width, 20)

    /**
     * 图片高度
     * @member {Number} PictureMarkerSymbol.prototype.height
     */
    this.height = defaultValue(options.height, 20)

    /**
     * 图片url
     * @member {String} PictureMarkerSymbol.prototype.url
     */
    this.url = defaultValue(options.url, '')
  }

  /**
   * 通过json构造并返回一个新的PictureMarkerSymbol对象<a id='fromJSON'></a>
   * @param {Object} json 符号的实例化JSON
   * @return {PictureMarkerSymbol} 新的PictureMarkerSymbol对象
   * @example <caption><h7>通过json构造并返回一个新的PictureMarkerSymbol对象</h7></caption>
   */
  static fromJSON(json) {
    json = defaultValue(json, {})
    return new PictureMarkerSymbol(json)
  }

  /**
   * 克隆并返回新的符号对象
   * @return {PictureMarkerSymbol} 克隆后的新符号对象
   */
  clone() {
    return new PictureMarkerSymbol(this.toJSON())
  }

  /**
   * 导出为JSON对象
   * @return {Object} JSON对像
   */
  toJSON() {
    const json = super.toJSON()
    json.width = this.width
    json.height = this.height
    json.url = this.url
    return json
  }
}

Zondy.Symbol.PictureMarkerSymbol = PictureMarkerSymbol
export default PictureMarkerSymbol