    import BaseRenderer from './BaseRenderer'
    import { Zondy } from '../../base'
    import { defaultValue } from '../../util'
    import { RendererType } from '../../base/enum'
    import { Symbol } from '../../base/symbol'
    import { VisualVariable } from './visualVariable'
    import ClassBreakInfo from './support/ClassBreakInfo'

    /**
     * 分段专题图渲染样式，支持的图层如下：<br/>
     * [IGS地图图片图层]{@link IGSMapImageLayer}、[几何图形图层]{@link GraphicsLayer}、[IGS要素图层]{@link IGSFeatureLayer}、
     * [geojson图层]{@link GeoJSONLayer}、[OGC-WFS图层]{@link WFSLayer}
     * @class ClassBreakRenderer
     * @extends BaseRenderer
     * @moduleEX BaseModule
     * @param {Object} options 构造参数
     * @param {String} [options.field = ''] 过滤字段名
     * @param {String} [options.valueExpressionTitle] 字段表达式描述
     * @param {String} [options.valueExpression] 字段表达式
     * @param {Array} [options.classBreakInfos = []] 分段专题图字段样式，支持的样式如下：<br/>
     * [1、点样式]{@link SimpleMarkerSymbol}<br/>
     * [2、线样式]{@link SimpleLineSymbol}<br/>
     * [3、区样式]{@link SimpleFillSymbol}<br/>
     * 示例如下：<br>
     * <a href='#ClassBreak-point'>[1、分段专题图-点]</a><br/>
     * <a href='#ClassBreak-line'>[2、分段专题图-线]</a><br/>
     * <a href='#ClassBreak-fill'>[3、分段专题图-区]</a>
     * @param {Object} [options.defaultSymbol] 默认样式，当分段值未覆盖时，使用默认样式，支持的样式如下：<br/>
     * [1、点样式]{@link SimpleMarkerSymbol}<br/>
     * [2、线样式]{@link SimpleLineSymbol}<br/>
     * [3、区样式]{@link SimpleFillSymbol}<br/>
     * 示例如下：<br>
     * <a href='#defaultSymbol-point'>[1、默认样式-点]</a><br/>
     * <a href='#defaultSymbol-line'>[2、默认样式-线]</a><br/>
     * <a href='#defaultSymbol-fill'>[3、默认样式-区]</a>
     *
     * @example <caption><h7 id='ClassBreak-point'>分段专题图-点</h7></caption>
     * // ES5引入方式
     * const { ClassBreakRenderer } = Zondy.Renderer
     * const { SimpleMarkerSymbol, SimpleLineSymbol } = Zondy.Symbol
     * const { Color } = Zondy
     * // ES6引入方式
     * import { ClassBreakRenderer, SimpleMarkerSymbol, SimpleLineSymbol, Color } from "@mapgis/webclient-common"
     * // 创建分段专题图渲染样式对象
     * const classBreakRenderer = new ClassBreakRenderer({
     *  //字段名
     *  field: '你的字段名',
     *  // 默认样式
     *  defaultSymbol: undefined,
     *  //分段专题图字段样式
     *  classBreakInfos: [{
     *    // 分段最大值
     *    maxValue: 20,
     *    // 分段最小值
     *    minValue: 1,
     *    //匹配到该值后的样式，更多样式详见：[《SimpleMarkerSymbol》]{@link SimpleMarkerSymbol}
     *    symbol: new SimpleMarkerSymbol({
     *      // 填充颜色
     *      color: 'rgba(1,1,252,0)',
     *      // 点半径
     *      size: 13,
     *      // 外边线样式
     *      outline: new SimpleLineSymbol({
     *        //线颜色
     *        color: new Color(255, 1, 0, 1),
     *        //线宽
     *        width: 1
     *      })
     *    })
     *  },{
     *    // 分段最大值
     *    maxValue: 40,
     *    // 分段最大值
     *    minValue: 20,
     *    //匹配到该值后的样式，更多样式详见：[《SimpleMarkerSymbol》]{@link SimpleMarkerSymbol}
     *    symbol: new SimpleMarkerSymbol({
     *      // 填充颜色
     *      color: 'rgba(1,1,252,0)',
     *      // 点半径
     *      size: 13,
     *      // 外边线样式
     *      outline: new SimpleLineSymbol({
     *        //线颜色
     *        color: new Color(255, 1, 0, 1),
     *        //线宽
     *        width: 1
     *      })
     *    })
     *  }]
     * });
     *
     * @example <caption><h7 id='ClassBreak-line'>分段专题图-线</h7></caption>
     * // ES5引入方式
     * const { ClassBreakRenderer } = Zondy.Renderer
     * const { SimpleLineSymbol } = Zondy.Symbol
     * const { Color } = Zondy
     * // ES6引入方式
     * import { ClassBreakRenderer, SimpleLineSymbol, Color } from "@mapgis/webclient-common"
     * // 创建分段专题图渲染样式对象
     * const classBreakRenderer = new ClassBreakRenderer({
     *  //字段名
     *  field: '你的字段名',
     *  // 默认样式
     *  defaultSymbol: undefined,
     *  //分段专题图字段样式
     *  classBreakInfos: [{
     *    // 分段最大值
     *    maxValue: 20,
     *    // 分段最小值
     *    minValue: 1,
     *    //匹配到该值后的样式，更多样式详见：[《SimpleLineSymbol》]{@link SimpleLineSymbol}
     *    symbol: new SimpleLineSymbol({
     *      //线符号颜色
     *      color: new Color(1, 255, 0, 1),
     *      //线宽
     *      width: 2
     *    })
     *  },{
     *    // 分段最大值
     *    maxValue: 40,
     *    // 分段最大值
     *    minValue: 20,
     *    //匹配到该值后的样式，更多样式详见：[《SimpleLineSymbol》]{@link SimpleLineSymbol}
     *    symbol: new SimpleLineSymbol({
     *      //线符号颜色
     *      color: new Color(1, 255, 0, 1),
     *      //线宽
     *      width: 2
     *    })
     *  }]
     * });
     *
     * @example <caption><h7 id='ClassBreak-fill'>分段专题图-区</h7></caption>
     * // ES5引入方式
     * const { ClassBreakRenderer } = Zondy.Renderer
     * const { SimpleFillSymbol, SimpleLineSymbol } = Zondy.Symbol
     * const { Color } = Zondy
     * // ES6引入方式
     * import { ClassBreakRenderer, SimpleFillSymbol, SimpleLineSymbol, Color } from "@mapgis/webclient-common"
     * // 创建分段专题图渲染样式对象
     * const classBreakRenderer = new ClassBreakRenderer({
     *  //字段名
     *  field: '你的字段名',
     *  // 默认样式
     *  defaultSymbol: undefined,
     *  //分段专题图字段样式
     *  classBreakInfos: [{
     *    // 分段最大值
     *    maxValue: 20,
     *    // 分段最小值
     *    minValue: 1,
     *    //匹配到该值后的样式，更多样式详见：[《SimpleFillSymbol》]{@link SimpleFillSymbol}
     *    symbol: new SimpleFillSymbol({
     *      // 填充符号颜色
     *      color: new Color(111, 222, 0, 0.3),
     *      // 外边线样式
     *      outline: new SimpleLineSymbol({
     *        // 线符号颜色
     *        color: new Color(255, 255, 0, 1),
     *        // 线宽
     *        width: 1
     *      })
     *    })
     *  },{
     *    // 分段最大值
     *    maxValue: 40,
     *    // 分段最大值
     *    minValue: 20,
     *    //匹配到该值后的样式，更多样式详见：[《SimpleFillSymbol》]{@link SimpleFillSymbol}
     *    symbol: new SimpleFillSymbol({
     *      // 填充符号颜色
     *      color: new Color(21, 110, 22, 0.3),
     *      // 外边线样式
     *      outline: new SimpleLineSymbol({
     *        //线符号颜色
     *        color: new Color(255, 255, 0, 1),
     *        //线宽
     *        width: 1
     *      })
     *    })
     *  }]
     * });
     *
     * @example <caption><h7 id='defaultSymbol-point'>默认样式-点</h7></caption>
     * // ES5引入方式
     * const { SimpleMarkerSymbol, SimpleLineSymbol } = Zondy.Symbol
     * const { Color } = Zondy
     * const { ClassBreakRenderer } = Zondy.Renderer
     * // ES6引入方式
     * import { SimpleMarkerSymbol, SimpleLineSymbol, Color, ClassBreakRenderer } from "@mapgis/webclient-common"
     * // 初始化默认样式，更多样式详见：[《SimpleMarkerSymbol》]{@link SimpleMarkerSymbol}
     * const defaultSymbol = new SimpleMarkerSymbol({
     *   // 填充颜色
     *   color: 'rgba(1,1,252,0)',
     *   // 点半径
     *   size: 13,
     *   // 外边线样式
     *   outline: new SimpleLineSymbol({
     *     //线颜色
     *     color: new Color(255, 1, 0, 1),
     *     //线宽
     *     width: 1
     *   })
     * })
     * // 初始化渲染对象
     * const renderer = new ClassBreakRenderer({
     *   //字段名
     *   field: '你的字段名',
     *   //分段专题图字段样式
     *   classBreakInfos: [],
     *   // 默认样式
     *   defaultSymbol: defaultSymbol
     * })
     *
     * @example <caption><h7 id='defaultSymbol-line'>默认样式-线</h7></caption>
     * // ES5引入方式
     * const { SimpleLineSymbol, SimpleMarkerSymbol } = Zondy.Symbol
     * const { Color } = Zondy
     * const { ClassBreakRenderer } = Zondy.Renderer
     * // ES6引入方式
     * import { SimpleLineSymbol, SimpleMarkerSymbol, Color, ClassBreakRenderer } from "@mapgis/webclient-common"
     * // 初始化默认样式，更多样式详见：[《SimpleLineSymbol》]{@link SimpleLineSymbol}
     * const defaultSymbol = new SimpleLineSymbol({
     *   // 填充颜色
     *   color: new Color(255, 0, 0, 1),
     *   // 线宽
     *   width: 2
     * })
     * // 初始化渲染对象
     * const renderer = new ClassBreakRenderer({
     *   //字段名
     *   field: '你的字段名',
     *   //分段专题图字段样式
     *   classBreakInfos: [],
     *   // 默认样式
     *   defaultSymbol: defaultSymbol
     * })
     *
     * @example <caption><h7 id='defaultSymbol-fill'>默认样式-区</h7></caption>
     * // ES5引入方式
     * const { SimpleFillSymbol, SimpleLineSymbol } = Zondy.Symbol
     * const { Color } = Zondy
     * const { ClassBreakRenderer } = Zondy.Renderer
     * // ES6引入方式
     * import { SimpleFillSymbol, SimpleLineSymbol, Color, ClassBreakRenderer } from "@mapgis/webclient-common"
     * // 初始化默认样式，更多样式详见：[《SimpleFillSymbol》]{@link SimpleFillSymbol}
     * const defaultSymbol = new SimpleFillSymbol({
     *   // 填充颜色
     *   color: 'rgba(1,1,252,0)',
     *   // 外边线样式
     *   outline: new SimpleLineSymbol({
     *     //线颜色
     *     color: new Color(255, 1, 0, 1),
     *     //线宽
     *     width: 1
     *   })
     * })
     * // 初始化渲染对象
     * const renderer = new ClassBreakRenderer({
     *   //字段名
     *   field: '你的字段名',
     *   //分段专题图字段样式
     *   classBreakInfos: [],
     *   // 默认样式
     *   defaultSymbol: defaultSymbol
     * })
     * @see [<h7>字段表达式说明</h7>]{@tutorial 表达式}
     * @example <caption><h7 id='valueExpression'>字段表达式</h7></caption>
      const renderer = new ClassBreakRenderer({
        valueExpression: "$feature.FID * 5",
        // 默认样式
        defaultSymbol: undefined,
        //分段专题图字段样式
        classBreakInfos: [
          {
            // 分段最大值
            maxValue: 20,
            // 分段最小值
            minValue: 1,
            //匹配到该值后的样式，更多样式详见：《SimpleFillSymbol》
            symbol: new SimpleFillSymbol({
              // 填充符号颜色
              color: new Color(111, 222, 0, 0.3),
              // 外边线样式
              outline: new SimpleLineSymbol({
                // 线符号颜色
                color: new Color(255, 255, 0, 1),
                // 线宽
                width: 1,
              }),
            }),
          },
          {
            // 分段最大值
            maxValue: 40,
            // 分段最大值
            minValue: 20,
            //匹配到该值后的样式，更多样式详见：《SimpleFillSymbol》
            symbol: new SimpleFillSymbol({
              // 填充符号颜色
              color: new Color(21, 110, 22, 0.3),
              // 外边线样式
              outline: new SimpleLineSymbol({
                //线符号颜色
                color: new Color(255, 255, 0, 1),
                //线宽
                width: 1,
              }),
            }),
          },
        ],
      });
     */
    class ClassBreakRenderer extends BaseRenderer {
      constructor(options) {
        super(options)
        options = defaultValue(options, {})
        /**
         * type 'class-breaks'，分段专题图
         * @member {String} ClassBreakRenderer.prototype.type
         */
        this.type = RendererType.classBreak
        /**
         * field 过滤字段名
         * @member {String} ClassBreakRenderer.prototype.field
         */
        this.field = defaultValue(options.field, '')
        /**
         * classBreakInfos 分段参数
         * @member {Array<ClassBreakInfo>} ClassBreakRenderer.prototype.classBreakInfos
         */
        this.classBreakInfos = defaultValue(options.classBreakInfos, [])
        this.classBreakInfos = this.classBreakInfos.map((classBrealInfo) =>
          ClassBreakInfo.fromJSON(classBrealInfo)
        )
        /**
         * defaultSymbol 默认样式，当分段值未覆盖时，使用默认样式
         * @member {Symbol} ClassBreakRenderer.prototype.defaultSymbol
         */
        this.defaultSymbol = this._decorate(
          'symbol',
          options.defaultSymbol,
          Symbol,
          Symbol.fromJSON
        )
        /**
         * 视觉变量(暂不支持)
         * @member {Array<VisualVariable> } ClassBreakRenderer.prototype.visualVariables
         */
        this.visualVariables = defaultValue(options.visualVariables, [])
        this.visualVariables = this.visualVariables.map((v) =>
          VisualVariable.fromJSON(v)
        )
        /**
         * 字段表达式描述
         * @member {String} ClassBreakRenderer.prototype.valueExpressionTitle
         */
        this.valueExpressionTitle = defaultValue(options.valueExpressionTitle, '')
        /**
         * 字段表达式
         * @member {String} ClassBreakRenderer.prototype.valueExpression
         */
        this.valueExpression = defaultValue(options.valueExpression, '')
        /**
         * 默认的标签
         * @member {String} ClassBreakRenderer.prototype.defaultLabel
         */
        this.defaultLabel = defaultValue(options.defaultLabel, null)
        /**
         * 默认的描述
         * @member {String} ClassBreakRenderer.prototype.defaultDescription
         */
        this.defaultDescription = defaultValue(options.defaultDescription, null)
      }

      /**
       * 导出为json对象
       * @return {Object} json对象
       * */
      toJSON() {
        const json = super.toJSON()
        json.field = this.field
        json.classBreakInfos = this.classBreakInfos
        json.defaultSymbol = this.defaultSymbol.toJSON()
        json.classBreakInfos = this.classBreakInfos.map((v) => v.toJSON())
        json.visualVariables = this.visualVariables.map((v) => v.toJSON())
        json.valueExpression = this.valueExpression
        json.valueExpressionTitle = this.valueExpressionTitle
        json.defaultLabel = this.defaultLabel
        json.defaultDescription = this.defaultDescription
        return json
      }

      /**
       * 克隆renderer对象
       * @return {ClassBreakRenderer} 克隆后的renderer对象
       */
      clone() {
        return new ClassBreakRenderer(this.toJSON())
      }
    }

    /**
     * 通过json创造ClassBreakRenderer对象
     * @param {Object} json
     * @return {ClassBreakRenderer} 新创建的ClassBreakRenderer对象
     * @example <caption><h7>通过json创造ClassBreakRenderer对象</h7></caption>
     * let classBreakRenderer = ClassBreakRenderer.fromJSON({
     *    // 初始化参数
     * })
     * */
    ClassBreakRenderer.fromJSON = function (json) {
      json = defaultValue(json, {})
      return new ClassBreakRenderer(json)
    }

    Zondy.Renderer.ClassBreakRenderer = ClassBreakRenderer
    export default ClassBreakRenderer