类名 common/base/symbol/SimpleMarkerSymbol.js
import { defaultValue } from '../../util'
import Zondy from '../Zondy'
import { SymbolType } from '../enum'
import SimpleLineSymbol from './SimpleLineSymbol'
import MarkerSymbol from './MarkerSymbol'

/**
 * 简单Marker符号,支持点几何对象,参考示例:<a href='#new-SimpleMarkerSymbol'>[简单Marker样式]</a>
 * <br><br>[ES5引入方式]:<br/>
 * Zondy.Symbol.SimpleMarkerSymbol() <br/>
 * [ES6引入方式]:<br/>
 * import { SimpleMarkerSymbol } from "@mapgis/webclient-common" <br/>
 * <br/>
 * @class SimpleMarkerSymbol
 * @moduleEX SymbolModule
 * @extends MarkerSymbol
 * @param {Object} options 构造参数
 * @param {Color|String} [options.color = new Color(255, 255, 255, 1)] 填充颜色,默认为白色
 * @param {SimpleLineSymbol} [options.outline = new SimpleLineSymbol()] 外边线样式
 * @param {Number} [options.size = 20] 像素块大小(半径),单位像素
 * @param {String} [options.style = 'circle'] marker样式,默认'circle',可选"circle"|"square"|"cross"|"x"|"diamond"|"triangle"
 * @param {String} [options.path = ''] svg path属性,用于自定义符号,优先级高于style,仅支持MapView
 * @param {Number} [options.xoffset = 0] marker的x轴偏移,单位像素
 * @param {Number} [options.yoffset = 0] marker的y轴偏移,单位像素
 * @param {Number} [options.angle = 0 ] Marker图标的旋转角度,单位度,0~360度,顺时针旋转
 *
 * @summary <h5>支持如下方法:</h5>
 * [1、克隆并返回新的符号对象]{@link Symbol#clone} <br/>
 * [2、导出一个JSON对像]{@link Symbol#toJSON} <br/>
 * <a href='#fromJSON'>[3、通过json构造并返回一个新的SimpleMarkerSymbol对象]</a>
 *
 * @example <caption><h7 id='new-SimpleMarkerSymbol'>简单Marker样式</h7></caption>
 * // ES5引入方式
 * const { SimpleMarkerSymbol } = Zondy.Symbol
 * const { Color } = Zondy
 * // ES6引入方式
 * import { SimpleMarkerSymbol, Color } from "@mapgis/webclient-common"
 * const simpleMarkerSymbol = new SimpleMarkerSymbol({
 *   // 填充颜色
 *   color: new Color(252, 100, 22, 1),
 *   // 旋转角度,单位度,0~360度
 *   angle: 90,
 *   // marker的x轴偏移,单位像素
 *   xoffset: -1,
 *   // marker的y轴偏移,单位像素
 *   yoffset: 5,
 *   // 像素块大小(半径),单位像素
 *   size: 13,
 *   // 外边线样式
 *   outline: new SimpleLineSymbol({
 *     // 外边线颜色
 *     color: new Color(255, 0, 0, 1),
 *     // 外边线宽度
 *     width: 2
 *   }),
 * });
 *
 * @example <caption><h7 id='new-SimpleMarkerSymbol'>符号style和自定义path路径说明</h7></caption>
 * // 不论是style还是path,都是描述了图形的形状。值得注意的是,图形的填充颜色由color决定,图形的线划参数由outline属性决定。
 * // 设置符号为三角形,style属性为'triangle'。
 * const simpleMarkerSymbol = new SimpleMarkerSymbol({
 *         style: "triangle"
 *  });
 * // 如果设置path属性,将会覆盖Style描述的符号形状,采用path属性描述的符号形状。
 * const simpleMarkerSymbol = new SimpleMarkerSymbol({
 *         path:"M300 300 L0 300 L0 0 L300 300"
 *  });
 */
class SimpleMarkerSymbol extends MarkerSymbol {
  constructor(options) {
    super(options)
    options = defaultValue(options, {})
    /**
     * 符号类型
     * @member {String} SimpleMarkerSymbol.prototype.type
     */
    this.type = SymbolType.simpleMarker
    /**
     * marker大小
     * @member {Number} SimpleMarkerSymbol.prototype.size
     */
    this.size = defaultValue(options.size, 20)
    /**
     * 外边线样式类型
     * @member {SimpleLineSymbol} SimpleMarkerSymbol.prototype.outline
     */
    this.outline = this._decorate(
      'outline',
      options.outline,
      SimpleLineSymbol,
      SimpleLineSymbol.fromJSON
    )
    /**
     * marker样式
     * @member {String} SimpleMarkerSymbol.prototype.style
     */
    this.style = defaultValue(options.style, 'circle')
    /**
     * svg path属性,用于自定义,优先级高于style
     * @member {String} SimpleMarkerSymbol.prototype.path
     */
    this.path = defaultValue(options.path, '')
  }

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

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

  /**
   * 导出为JSON对象
   * @return {Object} JSON对像
   */
  toJSON() {
    const json = super.toJSON()
    json.size = this.size
    json.outline = this.outline.toJSON()
    json.style = this.style
    json.path = this.path
    return json
  }
}

Zondy.Symbol.SimpleMarkerSymbol = SimpleMarkerSymbol
export default SimpleMarkerSymbol
构造函数
成员变量
方法
事件