类名 UniqueValueRenderer

# new UniqueValueRenderer(options)

单值专题图渲染样式，支持的图层如下：
IGS地图图片图层、几何图形图层、IGS要素图层、 geojson图层、OGC-WFS图层

参数

名称 类型 默认值 描述
options Object

构造参数
field String ''

字段名
valueExpressionTitle String

字段表达式描述
valueExpression String

字段表达式
defaultVisible Boolean true

默认符号是否显示
uniqueValueInfos Array.<UniqueValueInfo> []

单值专题图字段样式，支持的样式如下：
1、点样式
2、线样式
3、区样式
示例如下：
[1、单值专题图-点]
[2、单值专题图-线]
[3、单值专题图-区]
defaultSymbol Object

默认样式，当分段值未覆盖时，使用默认样式，支持的样式如下：
1、点样式
2、线样式
3、区样式
示例如下：
[1、默认样式-点]
[2、默认样式-线]
[3、默认样式-区]
See:
示例

默认样式-点

// ES5引入方式
const { SimpleMarkerSymbol, SimpleLineSymbol } = Zondy.Symbol
const { Color } = Zondy
const { UniqueValueRenderer } = Zondy.Renderer
// ES6引入方式
import { SimpleMarkerSymbol, SimpleLineSymbol, Color, UniqueValueRenderer } from "@mapgis/webclient-common"
// 初始化默认样式，更多样式详见：《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 UniqueValueRenderer({
  //字段名
  field: '你的字段名',
  //单值专题图字段样式
  uniqueValueInfos: [],
  // 默认样式
  defaultSymbol: defaultSymbol
})

默认样式-线

// ES5引入方式
const { SimpleLineSymbol } = Zondy.Symbol
const { Color } = Zondy
const { UniqueValueRenderer } = Zondy.Renderer
// ES6引入方式
import { SimpleLineSymbol, Color, UniqueValueRenderer } from "@mapgis/webclient-common"
// 初始化默认样式，更多样式详见：《SimpleLineSymbol》
const defaultSymbol = new SimpleLineSymbol({
  // 填充颜色
  color: new Color(255, 0, 0, 1),
  // 线宽
  width: 2
})
// 初始化渲染对象
const renderer = new UniqueValueRenderer({
  //字段名
  field: '你的字段名',
  //单值专题图字段样式
  uniqueValueInfos: [],
  // 默认样式
  defaultSymbol: defaultSymbol
})

默认样式-区

// ES5引入方式
const { SimpleFillSymbol, SimpleLineSymbol } = Zondy.Symbol
const { Color } = Zondy
const { UniqueValueRenderer } = Zondy.Renderer
// ES6引入方式
import { SimpleFillSymbol, SimpleLineSymbol, Color, UniqueValueRenderer } from "@mapgis/webclient-common"
// 初始化默认样式，更多样式详见：《SimpleFillSymbol》
const defaultSymbol = new Symbol.SimpleFillSymbol({
  // 填充颜色
  color: 'rgba(1,1,252,0)',
  // 外边线样式
  outline: new Symbol.SimpleLineSymbol({
    //线颜色
    color: new Color(255, 1, 0, 1),
    //线宽
    width: 1
  })
})
// 初始化渲染对象
const renderer = new Renderer.UniqueValueRenderer({
  //字段名
  field: '你的字段名',
  //单值专题图字段样式
  uniqueValueInfos: [],
  // 默认样式
  defaultSymbol: defaultSymbol
})

单值专题图-点

// ES5引入方式
const { UniqueValueRenderer } = Zondy.Renderer
const { SimpleMarkerSymbol, SimpleLineSymbol } = Zondy.Symbol
const { Color } = Zondy
// ES6引入方式
import { UniqueValueRenderer, SimpleMarkerSymbol, SimpleLineSymbol, Color } from "@mapgis/webclient-common"
//创建单值专题图渲染样式对象，更多样式详见：《SimpleMarkerSymbol》
let uniqueRender = new UniqueValueRenderer({
    //字段名
    field: '你的字段名',
    // 默认样式
    defaultSymbol: undefined,
    //单值专题图字段样式
    uniqueValueInfos: [{
        //指定字段值1
        value: "字段值1",
        //匹配到该值后的样式
        symbol: new SimpleMarkerSymbol({
          // 填充颜色
          color: 'rgba(1,1,252,0)',
          // 点半径
          size: 13,
          // 外边线样式
          outline: new SimpleLineSymbol({
            //线颜色
            color: new Color(255, 1, 0, 1),
            //线宽
            width: 1
          })
        })
    },{
        //指定字段值2
        value: "字段值2",
        //匹配到该值后的样式
        symbol: new SimpleMarkerSymbol({
          // 填充颜色
          color: 'rgba(1,1,252,0)',
          // 点半径
          size: 13,
          // 外边线样式
          outline: new SimpleLineSymbol({
            //线颜色
            color: new Color(255, 1, 0, 1),
            //线宽
            width: 1
          })
        })
    }]
});

单值专题图-线

// ES5引入方式
const { UniqueValueRenderer } = Zondy.Renderer
const { SimpleLineSymbol } = Zondy.Symbol
const { Color } = Zondy
// ES6引入方式
import { UniqueValueRenderer, SimpleLineSymbol, Color } from "@mapgis/webclient-common"
//创建单值专题图渲染样式对象，更多样式详见：《SimpleLineSymbol》
let uniqueRender = new UniqueValueRenderer({
    //字段名
    field: '你的字段名',
    // 默认样式
    defaultSymbol: undefined,
    //单值专题图字段样式
    uniqueValueInfos: [{
        //指定字段值1
        value: "字段值1",
        //匹配到该值后的样式
        symbol: new SimpleLineSymbol({
            //线符号颜色
            color: new Color(255, 0, 0, 1),
            //线宽
            width: 1
        })
    },{
        //指定字段值2
        value: "字段值2",
        //匹配到该值后的样式
        symbol: new SimpleLineSymbol({
            //线符号颜色
            color: new Color(1, 255, 0, 1),
            //线宽
            width: 2
        })
    }]
});

单值专题图-区

// ES5引入方式
const { UniqueValueRenderer } = Zondy.Renderer
const { SimpleFillSymbol, SimpleLineSymbol } = Zondy.Symbol
const { Color } = Zondy
// ES6引入方式
import { UniqueValueRenderer, SimpleLineSymbol, Color } from "@mapgis/webclient-common"
//创建单值专题图渲染样式对象，更多样式详见：《SimpleFillSymbol》
let uniqueRender = new UniqueValueRenderer({
    //字段名
    field: '你的字段名',
    // 默认样式
    defaultSymbol: undefined,
    //单值专题图字段样式
    uniqueValueInfos: [{
        //指定字段值1
        value: "字段值1",
        //匹配到该值后的样式
        symbol: new SimpleFillSymbol({
          // 填充颜色
          color: 'rgba(1,1,252,0)',
          // 外边线样式
          outline: new SimpleLineSymbol({
            //线颜色
            color: new Color(255, 1, 0, 1),
            //线宽
            width: 1
          })
        })
    },{
        //指定字段值2
        value: "字段值2",
        //匹配到该值后的样式
        symbol: new SimpleFillSymbol({
          // 填充颜色
          color: 'rgba(1,1,252,0)',
          // 外边线样式
          outline: new SimpleLineSymbol({
            //线颜色
            color: new Color(255, 1, 0, 1),
            //线宽
            width: 1
          })
        })
    }]
});

字段表达式

// 设置字段表达式，表达式更方便用户自定义可视化效果
// 目前能支持简单运算（加、减、乘、除等），支持要素链接符$feature
 const renderer = new UniqueValueRenderer({
          valueExpression:"$feature.FID>10?'样式1':'样式2'",
          //单值专题图字段样式
          uniqueValueInfos: [
            {
              //指定字段值1
              value:'样式1',
              //匹配到该值后的样式
              symbol: new SimpleMarkerSymbol({
                // 填充颜色
                color: "rgba(255,0,255,1)",
                // 点半径
                size: 40,
                // 外边线样式
                outline: new SimpleLineSymbol({
                  //线颜色
                  color: new Color(255, 1, 0, 1),
                  //线宽
                  width: 1,
                }),
                style:'arrow'
              }),
            },
            {
              //指定字段值2
              value: "样式2",
              //匹配到该值后的样式
              symbol: new SimpleFillSymbol({
                // 填充颜色
                color: "rgba(0,0,255,0.2)",
                // 外边线样式
                outline: new SimpleLineSymbol({
                  //线颜色
                  color: new Color(255, 1, 0, 1),
                  //线宽
                  width: 1,
                  style:'dot'
                }),
                style:'cross'
              }),
            },
          ],
          // 默认样式
          defaultSymbol: defaultSymbol,
        });

继承关系

成员变量

成员变量概述

名称 类型 描述
defaultDescription String

默认的渲染器的描述信息
defaultLabel String

默认的渲染器标签
defaultSymbol Symbol

defaultSymbol 默认样式，当分段值未覆盖时，使用默认样式
defaultVisible Boolean

是否可视化默认符号
field String

field 'unique-value'，字段名
type String

type 'unique-value'，单值专题图
uniqueValueInfos Array.<UniqueValueInfo>

uniqueValueInfos 单值专题图字段样式
valueExpression String

字段表达式
valueExpressionTitle String

字段表达式描述
visualVariables Array.<VisualVariable>

视觉变量

成员变量详情

String

# defaultDescription

默认的渲染器的描述信息

String

# defaultLabel

默认的渲染器标签

Symbol

# defaultSymbol

defaultSymbol 默认样式，当分段值未覆盖时，使用默认样式

Boolean

# defaultVisible

是否可视化默认符号

String

# field

field 'unique-value'，字段名

String

# type

type 'unique-value'，单值专题图

Array.<UniqueValueInfo>

# uniqueValueInfos

uniqueValueInfos 单值专题图字段样式

String

# valueExpression

字段表达式

String

# valueExpressionTitle

字段表达式描述

Array.<VisualVariable>

# visualVariables

视觉变量

方法

方法概述

名称 返回值类型 描述
fromJSON UniqueValueRenderer

通过json创造UniqueValueRenderer对象
clone UniqueValueRenderer

克隆renderer对象
fromJSON

将JSON格式的渲染规则转换为JS对象
toJSON Object

导出为json对象

方法详情

# static fromJSON(json)

通过json创造UniqueValueRenderer对象

参数

名称 类型 描述
json Object

新创建的UniqueValueRenderer对象

UniqueValueRenderer
示例

通过json创造UniqueValueRenderer对象

let uniqueValueRenderer = UniqueValueRenderer.fromJSON({
   // 初始化参数
})

# clone()

克隆renderer对象

Overrides:

克隆后的renderer对象

UniqueValueRenderer

# fromJSON(json)

将JSON格式的渲染规则转换为JS对象

参数

名称 类型 描述
json Object

渲染规则的实例化JSON
Inherited From:

# toJSON()

导出为json对象

Overrides:

json对象

Object