Class: SimpleMarkerSymbol

SimpleMarkerSymbol

new SimpleMarkerSymbol(options)

base/symbol/SimpleMarkerSymbol.js, line 6

支持如下方法：
1、克隆并返回新的符号对象
2、导出一个JSON对像
[3、通过json构造并返回一个新的SimpleMarkerSymbol对象]

简单Marker符号，支持点几何对象，参考示例：[简单Marker样式]

[ES5引入方式]：
zondy.symbol.SimpleMarkerSymbol()
[ES6引入方式]：
import { SimpleMarkerSymbol } from "@mapgis/webclient-common"

Name Type Description
options Object

构造参数

Name Type Default Description
color Color | String new Color(255, 255, 255, 1) 可选

填充颜色，默认为白色
outline SimpleLineSymbol new SimpleLineSymbol() 可选

外边线样式。已知的差异，MapView（mapboxgl）上轮廓线是沿着图形区域边线向外绘制轮廓,轮廓，并不是延图形区域边线两侧绘制轮廓
size Number 20 可选

像素块大小(半径)，单位像素
style String 'circle' 可选

marker样式,默认'circle',可选"circle"|"square"|"cross"|"x"|"diamond"|"triangle"
path String '' 可选

svg中path标签的d属性，用于自定义，优先级高于style，不支持过于复杂的d属性，不支持SceneView
xoffset Number 0 可选

marker的x轴偏移，单位像素, xoffset正值表示marker相对于锚点向右偏移
yoffset Number 0 可选

marker的y轴偏移，单位像素, yoffset正值表示marker相对于锚点向上偏移
angle Number 0 可选

Marker图标的旋转角度，单位度，0~360度，顺时针旋转
Examples

简单Marker样式

// 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
  }),
});

符号style和自定义path路径说明

// 不论是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"
 });

Extends

Members

angleNumber

旋转角度

outlineSimpleLineSymbol

外边线样式类型

pathString

svg中path标签的d属性，用于自定义，优先级高于style，不支持过于复杂的d属性，不支持SceneView

sizeNumber

marker大小

styleString

marker样式

typeString

符号类型

xoffsetNumber

marker的x轴偏移，单位像素, xoffset正值表示marker相对于锚点向右偏移

yoffsetNumber

marker的y轴偏移，单位像素, yoffset正值表示marker相对于锚点向上偏移

Methods

SimpleMarkerSymbol.fromJSON(json){SimpleMarkerSymbol}

base/symbol/SimpleMarkerSymbol.js, line 110

通过json构造并返回一个新的SimpleMarkerSymbol对象

Name Type Description
json Object

符号的实例化JSON
Returns:
Type Description
SimpleMarkerSymbol 新的SimpleMarkerSymbol对象
Example
通过json构造并返回一个新的SimpleMarkerSymbol对象

clone(){SimpleMarkerSymbol}

base/symbol/SimpleMarkerSymbol.js, line 119

克隆并返回新的符号对象

Returns:
Type Description
SimpleMarkerSymbol 克隆后的新符号对象

toJSON(){Object}

base/symbol/SimpleMarkerSymbol.js, line 127

导出为JSON对象

Returns:
Type Description
Object JSON对像