Class: VisualVariable

VisualVariable

new VisualVariable(options)

document/renderer/visualVariable/VisualVariable.js, line 5

视觉变量基类

Name Type Default Description
options Object {} 可选

初始化参数

Name Type Description
field String 可选

视觉变量字段
valueExpression String 可选

字段表达式
valueExpressionTitle String 可选

字段表达式标题
Examples

支持的视觉变量

1、color视觉变量
2、opacity视觉变量
3、size视觉变量

创建视觉变量配置

// ES5引入方式
const { ColorVariable } = zondy.renderer

// ES6引入方式
import { ColorVariable } from '@mapgis/webclient-common'
const colorVariable = new ColorVariable({
  field: 'FID',
  stops: []
})

多个视觉变量叠加

// 从图层上获取renderer
const renderer = layer.renderer
// 设置多个视觉变量。
// 需要注意相同视觉变量作用效果一致，按照加入顺序会覆盖前面的效果。
// 颜色视觉变量和透明度视觉变量同时作用时，需要将颜色视觉变量放于透明度视觉变量之前。
renderer.visualVariables = [
 {
        type: "color",
        valueExpression: "$feature.FID",
        stops: [
          {
            color: "#FFFCD4",
            value: 0,
          },
          {
            color: "#350242",
            value: 200,
          },
        ],
     },
     {
        type: "size",
        valueExpression: "$feature.FID",
        stops:[
          {
            size:5,
            value:0
          },
          {
            size:20,
            value:300
          }
        ]
     },
      {
        type: "opacity",
        valueExpression: "$feature.FID",
        stops: [
          {
            opacity: 0.2,
            value: 0,
          },
          {
            opacity: 1.0,
            value:300,
          }
        ],
      }
]

Members

fieldString

视觉变量字段

typeString

视觉变量默认类型

valueExpressionString

视觉变量字段表达式

valueExpressionTitleString

字段表达式标题

Methods

clone(){VisualVariable}

document/renderer/visualVariable/VisualVariable.js, line 129

克隆对象

Returns:
Type Description
VisualVariable 克隆后的VisualVariable对象

toJSON(){Object}

document/renderer/visualVariable/VisualVariable.js, line 117

导出为 JSON 对象

Returns:
Type Description
Object JSON 对象

VisualVariable.fromJSON(json){VisualVariable}

document/renderer/visualVariable/VisualVariable.js, line 108

通过 JSON 对象构造 VisualVariable 对象

Name Type Description
json Object

JSON 对象
Returns:
Type Description
VisualVariable VisualVariable 对象