管线可视化
管线可视化以单个设备为观察对象(当然也支持以一条链路为观察对象),可以同时展示当前设备的上下游设备以及它们之间的连线关系。一条管线由上游设备 + 下游设备 + 连线 组成,连线具有流向动画,由上游流向下游。根据设备类型的不同,管线可分为两种:
监控设备到监控设备的连线:常用来展示配电线路、制冷链路等。需要实现前置的监控设备可视化功能,会用到监控设备的业务数据。机柜资产设备端口到机柜资产设备端口的连线:用来展示资产设备端口之间的连接关系,该类场景在机房3D可视化项目中应用较多。需要实现前置的资产可视化功能,会用到资产系统业务数据。
注意
上下游设备必须在同一个园区内或者同一个建筑内(可以跨楼层),但不可以跨园区、跨建筑以及园区到楼层。
管线的显示与关闭,主要由管线管理器 PipelineMgr 控制。在 App 对象中有一个管线管理器 pipelineMgr 属性,它是PipelineMgr的实例。
设置管线样式
PipelineMgr有一个只读属性pipelineStyles,用来保存所有管线样式,它是一个PipelineStyle 数组类型,可以将自定义的管线样式添加到该数组中。pipelineStyles有一个默认的值{ name: "默认", radius: 0.008, color1: "#0389fa", color2: "#faeb03" },请勿删除或覆盖。
typescript
//设置管线样式
app.pipelineMgr.pipelineStyles.push({
name: '样式1',
radius: 0.02,
color1: '#ff0000',
color2: '#00ff00'
});设置端点实体查找函数
管线数据 PipelineData 主要用来描述管线上下游端点的业务信息,以 start_为前缀的属性表示上游(开始)端点信息,以 end_为前缀的属性表示下游(结束)端点信息。
这里,start_type 和 end_type 的值必须完全一致,对应管线的两种类型。
当端点类型为
设备时,表示监控设备到监控设备的连线。在DCVM中,字段1表示监控站点ID,字段2表示监控设备ID,字段3忽略。在DCVM中,唯一标识一个设备需要监控站点ID和监控设备ID。不同的业务系统做法可能不一样,比如有的系统可能只需要1个字段就能唯一标识监控设备,那么只需要使用字段1,字段2和字段3可以忽略。当端点类型为
端口时,表示机柜资产设备端口到机柜资产设备端点的连线。字段1表示机柜唯一ID,字段2表示资产ID,字段3表示端口ID。端口ID是资产模型编辑工具中的端口名称,一般用数字命名。
在创建管线前,需要根据端点业务数据找到对应的3D实体对象,实体 类 Entity有一个静态成员customCheckFun就是专门干这件事的。该属性是一个函数,默认返回null,需要根据自身业务系统来覆盖实现具体的查找逻辑。customCheckFun 的参数是一个对象,包含 type 和 fields 两个属性。
注意
customCheckFun 的参数的type属性值为"端口"时,只需要返回机柜对应的3D实体即可,因为资产设备的3D实体只有打开机柜后才会创建。
typescript
//设置端点实体查找函数
GLOW.Entity.customCheckFun = (data: { type: '设备' | '端口', fields: string[] }) => {
if (data.type === '设备') {//以DCVM系统为例
let station_id: string = data.fields[0];//站点ID
let device_id: string = data.fields[1];//设备ID
//查找设备对应的绑定
let binding: DeviceBinding = deviceBindingList.find(item => item.station_id === station_id && item.device_id === device_id)!;
if (binding) return app.getEntityById(binding.entity_id);//返回绑定对应的3D实体
}
else {
let cabinet_id: string = data.fields[0];//机柜ID
for (let component of app.allComponents) {//遍历所有组件
if (component instanceof GLOW.Cabinet) {//过滤机柜组件
if (component.cabinetId === cabinet_id) {//找到对应的机柜组件
return component.entity;//返回对应的3D实体
}
}
}
}
return null!;
};显示/隐藏管线
显示管线:调用 PipelineMgr 的 show 方法。
隐藏管线:调用 PipelineMgr 的 reset 方法。
监控设备到监控设备的连线

typescript
let list: GLOW.PipelineData[] = [//管线列表
{ start_type: '设备', start_field1: 'S001', start_field2: 'UPS001', start_field3: '', start_name: '1号UPS', end_type: '设备', end_field1: 'S001', end_field2: 'KT0001', end_field3: '', end_name: '1号空调', style_name: '样式1', extension: '' },
{ start_type: '设备', start_field1: 'S001', start_field2: 'KT0001', start_field3: '', start_name: '1号空调', end_type: '设备', end_field1: 'S001', end_field2: 'WSD001', end_field3: '', end_name: '1号温湿度', style_name: '', extension: '' }
];
app.pipelineMgr.show(list);机柜资产设备端口到机柜资产设备端口的连线
注意
当显示机柜资产设备端口到机柜资产设备端口的连线时,需要传入资产字典,按需加载关联的资产设备。key为机柜id,value为资产列表。

typescript
let list: GLOW.PipelineData[] = [//管线列表
{ start_type: '端口', start_field1: 'JG1', start_field2: 'ZX007', start_field3: '1', start_name: '网络交换机MS4016P-EI', end_type: '端口', end_field1: 'JG4', end_field2: 'ZX005', end_field3: '2', end_name: 'S7706', style_name: '', extension: '' },
{ start_type: '端口', start_field1: 'JG4', start_field2: 'ZX005', start_field3: '6', start_name: 'S7706', end_type: '端口', end_field1: 'JG5', end_field2: 'ZX006', end_field3: '6', end_name: 'S7706', style_name: '', extension: '' }
];
let assetDic: Map<string, GLOW.AssetData[]> = new Map();//资产字典
assetDic.set('JG1', [assetDataList[6]]);
assetDic.set('JG4', [assetDataList[4]]);
assetDic.set('JG5', [assetDataList[5]]);
app.pipelineMgr.show(list, assetDic);
文档中心