PoiNode 对象

createPoiNode

创建 poiNode 对象。可以插入任何 DOM 元素，并且保留其交互事件。

样例：

定义：

interface PoiNodeInfo extends BaseObject3DInfo {
  type: PoiNodeType;
  element: HTMLElement;
  elementAutoDisplay?: boolean;
  occlude?: boolean | Object3D[] | IVector3;
  occludeThrottle?: number;
  onChange?: (visible: boolean) => void;
  scaleFixed?: ScaleFixed | null;
}

function createPoiNode(poiNodeInfo: PoiNodeInfo): PoiNode;

用法：

const el = document.createElement('div');
el.innerHTML = '一段文字';

ssp.createPoiNode(
  // poiNodeInfo
  {
    type: '3d',
    element: el,
    occlude: false,
    onChange(visible) {
      console.log(visible);
    },
    id: 'xx',
    name: 'xx',
    level: {
      max: 1000,
      min: null,
    },
    position: { x: 0, y: 0, z: 0 },
    rotation: { x: 0, y: 0, z: 0 },
    scale: { x: 2, y: 2, z: 2 },
    userData: {},
  }
);

参数：

poiNodeInfo

• 描述: 实例 PoiNode 对象所需信息
• 类型: PoiNodeInfo
• 必填:

PoiNodeInfo

属性	描述	类型	必填	默认值
type	展示模式	PoiNodeType
element	DOM 元素	HTMLElement
elementAutoDisplay	element 自动显示隐藏	boolean		true
occlude	开启遮挡查询	boolean | Object3D[] | IVector3		false
occludeThrottle	遮挡查询的节流时间(ms)	number		0
onChange	元素可见性变化时的回调	( visible: boolean ) => void
id	唯一ID	string | number
name	名称	string
level	显示层级范围	Level		{ max: null, min: null }
scaleFixed	相机超过设定距离时的固定缩放比例	ScaleFixed
visible	是否可见	boolean		true
position	位置坐标	Position		{ x: 0, y: 0, z: 0 }
rotation	旋转弧度	Rotation		{ x: 0, y: 0, z: 0 }
scale	缩放比例	Scale		{ x: 1, y: 1, z: 1 }
userData	用户数据	any		{}

occlude

import { Vector3 } from 'three';

// 遮挡查询
ssp.createPoiNode({
  type: '3d',
  element: el,
  // 与场景所有对象检测，比较消耗性能
  occlude: true,
  // 只与指定对象检测，提高性能
  // occlude: [model],
  // 与指定方向检测，提高性能
  // 表示朝向正z轴，当相机在背面时，不显示
  // occlude: new Vector3(0, 0, 1),
  // occlude: {x:0, y:0, z:1},
  occludeThrottle: 300,
});

scaleFixed

属性	描述	类型	必填	默认值
originScale	小于 distance 时的 scale	number
fixedScale	大于 distance 时的固定 scale	number
distance	距离阈值	number

提示

使用 scaleFixed 需要开启 scaleFixedEnabled 配置

getPoiNodeById

通过 id 查找

定义：

function getPoiNodeById(id: PoiNodeInfo['id']): PoiNode | null;

用法：

const poiNode = ssp.getPoiNodeById('xxx');

弃用警告

请使用 getObjectById 替代

getPoiNodeByName

通过 name 查找

定义：

function getPoiNodeByName(name: string): PoiNode[];

用法：

const poiNodeList = ssp.getPoiNodeByName('xxx');

弃用警告

请使用 getObjectByName 替代

getAllPoiNode

获取所有 PoiNode 对象

定义：

function getAllPoiNode(): PoiNode[];

用法：

const allPoiNodeList = ssp.getAllPoiNode();

getPoiNodeByUserDataProperty

通过 userData 属性查找

定义：

function getPoiNodeByUserDataProperty(propNameOrFindFunc: string | UserDataPropertyFindFunc, value?: any): PoiNode[];

用法：

const poiNodeList = ssp.getPoiNodeByUserDataProperty('propKey'， 'propVal')
// or
const poiNodeList = ssp.getPoiNodeByUserDataProperty(item => item['itemPropKey'] === 'itemPropVal')

参数：

propNameOrFindFunc

• 描述: userData 内属性名 或 find 函数
• 类型: string | function
• 必填:

propValue

• 描述: userData 内属性值。
• 类型: any
• 必填:

find 函数使用场景

poiNode.userData = {
  people: {
    name: 'xiaoming',
    age: 18,
  },
};
const poiNodeList = ssp.getPoiNodeByUserDataProperty((userData) => userData?.people?.name === 'xiaoming');

弃用警告

请使用 getObjectByUserDataProperty 替代

removePoiNodeById

通过 id 移除

定义：

function removePoiNodeById(id: PoiNodeInfo['id']): boolean;

用法：

ssp.removePoiNodeById('xxx');

弃用警告

请使用 removeObjectById 替代

createPoiNodeToGroup

创建 poiNode 到一个组内。

定义：

function createPoiNodeToGroup(groupInfo: GroupInfo, poiNodeInfoList: PoiNodeInfo[]): Group;

用法：

ssp.createPoiNodeToGroup(
  // groupInfo
  {
    id: 'firstPoiNodeGroup',
    name: 'name_firstPoiNodeGroup',
    // ...
  },
  // poiNodeInfoList
  [poiNodeInfo1, poiNodeInfo2, poiNodeInfo3]
);

参数

groupInfo

• 描述: 实例组对象所需信息
• 类型: GroupInfo
• 必填:

poiNodeInfoList

• 描述: poiNodeInfo 集合
• 类型: poiNodeinfo[]
• 必填:

createGroupForPoiNode

为 poiNode 提前创建一个空组。

使用场景

与 createPoiNodeToGroup 不同，有些时候可能你还没有具体的 poiNodeInfo 数据，但你想提前创建一个批量管理的空组，当有数据时再使用 addPoiNodeForGroup 插入。

定义：

function createGroupForPoiNode(groupInfo: GroupInfo): Group;

用法：

ssp.createGroupForPoiNode({
  id: 'firstPoiNodeGroup',
  name: 'name_firstPoiNodeGroup',
  // ...
});

参数

groupInfo

• 描述: 实例组对象所需信息
• 类型: GroupInfo
• 必填:

弃用警告

请使用 createGroup 替代

addPoiNodeForGroup

向一个已经存在的组内添加 poiNode 对象。

定义：

function addPoiNodeForGroup(groupId: GroupInfo['id'], poiNodeInfoList: PoiNodeInfo[]): Group | null;

用法：

ssp.addPoiNodeForGroup(
  // groupId
  'firstPoiNodeGroup',
  // poiNodeInfoList
  [poiNodeInfo4, poiNodeInfo5]
);

参数

groupId

• 描述: 组 id
• 类型: GroupInfo[‘id’]
• 必填:

poiNodeInfoList

• 描述: poiNodeInfo 集合
• 类型: poiNodeinfo[]
• 必填:

getPoiNodeGroupById

通过 id 查找 poiNode 组

定义：

function getPoiNodeGroupById(id: GroupInfo['id']): Group | null;

用法：

const group = ssp.getPoiNodeGroupById('firstPoiNodeGroup');

弃用警告

请使用 getObjectById 替代

getPoiNodeGroupByName

通过 name 查找 poiNode 组

定义：

function getPoiNodeGroupByName(name: string): Group[];

用法：

const groupList = ssp.getPoiNodeGroupByName('name_firstPoiNodeGroup');

弃用警告

请使用 getObjectByName 替代

getAllPoiNodeGroup

获取所有 PoiNode 对象组

定义：

function getAllPoiNodeGroup(): Group[];

用法：

const allPoiNodeGroupList = ssp.getAllPoiNodeGroup();

弃用警告

请使用 getAllGroup 替代

removePoiNodeGroupById

通过 id 移除 poiNode 组

定义：

function removePoiNodeGroupById(id: GroupInfo['id']): boolean;

用法：

const isRemoveSuccess = ssp.removePoiNodeGroupById('firstPoiNodeGroup');

弃用警告

请使用 removeObjectById 替代

clearPoiNode

清除当前场景内所有 poiNode 对象。

定义：

function clearPoiNode(): void;

用法：

ssp.clearPoiNode();

showAllPoiNode

显示当前场景内所有 poiNode 对象。

定义：

function showAllPoiNode(): void;

用法：

ssp.showAllPoiNode();

hideAllPoiNode

隐藏当前场景内所有 poiNode 对象。

定义：

function hideAllPoiNode(): void;

用法：

ssp.hideAllPoiNode();