# new IGSVectorTileSubLayer(options)
IGS矢é‡ç“¦ç‰‡å图层
傿•°
åç§° | 类型 | 默认值 | æè¿° |
---|---|---|---|
options |
Object | æž„é€ å‚æ•° |
|
renderer |
BaseRenderer | ä¸“é¢˜å›¾æ¸²æŸ“æ ·å¼å¯¹è±¡ï¼Œæ”¯æŒå¦‚ä¸‹æ¸²æŸ“æ ·å¼ï¼š |
|
id |
String | 矢é‡ç“¦ç‰‡å图层的id |
|
title |
String | 矢é‡ç“¦ç‰‡åå›¾å±‚çš„æ ‡é¢˜ |
|
styleLayers |
Array.<Object> | 矢é‡ç“¦ç‰‡å图层关è”的矢é‡ç“¦ç‰‡æ ·å¼å›¾å±‚数组 |
|
visible |
Boolean | true | 图层å¯è§æ€§ |
layer |
IGSVectorTileLayer | 矢é‡ç“¦ç‰‡çˆ¶å›¾å±‚ |
|
labelingInfo |
Array.<LabelClass> | [] | 仅当IGSVectorTileLayer图层的labelsRenderMode傿•°è®¾ç½®éž'off-screen'属性时生效 |
示例
// ES5引入方å¼
const { LabelClass } = Zondy
const { IGSVectorTileLayer } = Zondy.Layer
// ES6引入方å¼
import { IGSVectorTileLayer, LabelClass } from "@mapgis/webclient-common"
// åˆå§‹åŒ–一个é¢å¤–çš„å›¾æ ‡DOM对象
const iconImage = new Image()
iconImage.src = 'å›¾ç‰‡åœ°å€æˆ–者base64å—符串'
// åˆå§‹åŒ–矢é‡ç“¦ç‰‡å›¾å±‚
const igsVectorTileLayer = new IGSVectorTileLayer({
// 矢é‡ç“¦ç‰‡åŸºåœ°å€
url: '',
// å¼€å¯ä¸‰ç»´æ³¨è®°
labelsRenderMode: 'on-screen',
// 设置è¦åº”用三维主å¥çš„å图层
sublayers: [{
// 矢é‡ç“¦ç‰‡å图层id
id: '矢é‡ç“¦ç‰‡å图层id',
// æ³¨è®°å‚æ•°ï¼Œç›®å‰ä»…用填写一个
labelingInfo: [
new LabelClass({
symbol: {
// 填充颜色 rgba or 16进制颜色
color: 'rgba(255,255,255,1)',
// æè¾¹é¢œè‰²
haloColor: 'rgba(0,0,0,0.5)',
// æè¾¹å®½åº¦
haloSize: 2,
// 行高
lineHeight: 1.1,
// 文本间è·
letterSpacing: 2,
// å—ä½“æ ·å¼ å‚考css
font: {
size: 14,
family: '微软雅黑',
weight: 'normal',
style: 'normal'
},
// é¢å¤–çš„å›¾æ ‡
textExtraIcon: iconImage,
// å›¾æ ‡çš„å¤§å°
textExtraIconSize:20,
// å›¾æ ‡æ–¹ä½
textExtraIconAnchor:'left'
},
// æ¸²æŸ“æ–¹å¼ 1.canvas 2.label 3.ground
renderMode: 'canvas',
// 最大å¯è§èŒƒå›´
minScale: 60000000,
// 最å°å¯è§èŒƒå›´
maxScale: 1,
// 布局ä½ç½® å¯é€‰ 1.above-left 2.above-center 3.above-right 4.center-left 5.center-center 6.center-right 7.below-left 8.below-center 9.below-right
labelPlacement: 'above-center',
// é«˜ç¨‹é‡‡æ ·å‚æ•°
elevationInfo: {
mode: 'OnTheGround',
offset: 0
}
})
]
}]
});
// ES5引入方å¼
const { LabelClass } = Zondy
// ES6引入方å¼
import { LabelClass } from "@mapgis/webclient-common"
// åˆå§‹åŒ–一个é¢å¤–çš„å›¾æ ‡DOM对象
const iconImage = new Image()
iconImage.src = 'å›¾ç‰‡åœ°å€æˆ–者base64å—符串'
// 获å–矢é‡ç“¦ç‰‡å图层
const sublayer = igsVectorTileLayer.findSublayerById('å图层id')
// 设置一个新的矢é‡ç“¦ç‰‡ä¸‰ç»´æ³¨è®°å‚æ•°
sublayer.labelingInfo = [
new LabelClass({
symbol: {
// 填充颜色 rgba or 16进制颜色
color: 'rgba(1,255,1,1)',
// æè¾¹é¢œè‰²
haloColor: 'rgba(0,0,0,0.5)',
// æè¾¹å®½åº¦
haloSize: 2,
// 行高
lineHeight: 1.1,
// 文本间è·
letterSpacing: 2,
// å—ä½“æ ·å¼ å‚考css
font: {
size: 14,
family: '微软雅黑',
weight: 'normal',
style: 'normal'
},
// é¢å¤–çš„å›¾æ ‡
textExtraIcon: iconImage,
// å›¾æ ‡çš„å¤§å°
textExtraIconSize:20,
// å›¾æ ‡æ–¹ä½
textExtraIconAnchor:'left'
},
// æ¸²æŸ“æ–¹å¼ 1.canvas 2.label 3.ground
renderMode: 'canvas',
// 最大å¯è§èŒƒå›´
minScale: 60000000,
// 最å°å¯è§èŒƒå›´
maxScale: 1,
// 布局ä½ç½® å¯é€‰ 1.above-left 2.above-center 3.above-right 4.center-left 5.center-center 6.center-right 7.below-left 8.below-center 9.below-right
labelPlacement: 'above-center',
// é«˜ç¨‹é‡‡æ ·å‚æ•°
elevationInfo: {
mode: 'OnTheGround',
offset: 0
}
})
]
继承关系
æˆå‘˜å˜é‡
æˆå‘˜å˜é‡æ¦‚è¿°
åç§° | 类型 | æè¿° |
---|---|---|
labelingInfo |
Array.<LabelClass>
|
|
renderer |
UniqueValueRenderer
|
ClassBreakRenderer
|
SimpleRenderer
|
|
type |
String
|
|
visible |
Boolean
|
|
æˆå‘˜å˜é‡è¯¦æƒ…
# labelingInfo
ä¸‰ç»´æ³¨è®°å‚æ•°ï¼Œä»…当igs矢é‡ç“¦ç‰‡å›¾å±‚labelsRenderMode设置éž'off-screen'å±žæ€§æ—¶ç”Ÿæ•ˆã€‚ä¸ºæ€§èƒ½è€ƒè™‘ï¼Œå½“å‰æ‰€æœ‰å图层labelingInfo内labelClasså¿…é¡»ä¿è¯renderModeä¸€è‡´ï¼Œä¸æ”¯æŒåŒæ—¶è®¾ç½®label或canvas两ç§å½¢å¼ã€‚
- Inherited From:
# renderer
矢é‡ç“¦ç‰‡åå›¾å±‚ä¸“é¢˜å›¾æ¸²æŸ“æ ·å¼
- Inherited From:
方法
方法概述
åç§° | 返回值类型 | æè¿° |
---|---|---|
fromJSON |
|
|
clone |
IGSVectorTileSubLayer
|
|
toJSON |
Object
|
|
方法详情
# static fromJSON(json)
通过json对象åˆå§‹åŒ–该对象
傿•°
åç§° | 类型 | æè¿° |
---|---|---|
json |
Object | json对象 |
IGSVectorTileSubLayer 新的IGSVectorTileSubLayer图层对象