创建海量label
- 支持独立事件绑定
- 可见范围内有30万点有轻微卡顿
例:
typescript
const labels = _3umap.createLabelCollection()
labels.add(option)可配置参数
typescript
type LabelCollectionOptions = {
addOptions: {
id?: string;
position: [number, number, number?] | Point3d;
/** 显示消失 */
show?: boolean;
/** 文字内容 */
text?: string;
/** 文字大小 */
fontSize?: number;
/** 字体颜色 */
fontColor?: MapColor;
/** 背景填充颜色 */
fillColor?: MapColor;
/** 是否显示背景 */
showBackground?: boolean;
/** 内边距 */
padding?: [number, number];
/** 缩放 */
scale?: number;
/** 填充样式 */
style?: 'fill' | 'outline' | 'fill_and_outline';
/** 描边大小 */
outlineWidth?: number;
/** 描边颜色 */
outlineColor?: MapColor;
/** 垂直对齐方式 */
verticalOrigin?: 'center' | 'bottom' | 'top';
/** 水平对齐方式 */
horizontalOrigin?: 'center' | 'left' | 'right';
/** 偏移量 */
offset?: [number, number];
/** 近距离 */
near?: number;
/** 远距离 */
far?: number;
/** 近距离缩放 */
nearScale?: number;
/** 远距离缩放 */
farScale?: number;
/** 是否绝对定位 */
absolute?: boolean;
labelOffset?: [number, number];
property?: Record<string | symbol, any>;
};
};标签
typescript
const label = _3umap.createLabelCollection()
label.label.setHtml('<div>label标签</div>')
label.on('click', (ev, mark, even) => {
if (mark === 'in') {
ev[0].label.show = true
} else {
ev[0].label.show = false
}
})
