emd实现信息隐藏_工业互联网可视化系统风格的抉择：线框模式之 3D 数据中心机房的实现...

前言

3D 可视化，就是把复杂抽象的数据信息，以合适的视觉元素及视角去呈现，方便系统的展示、维护和管理。而在可视化系统的搭建选择上，所呈现的风格样式效果多种多样，各自所突出的适用场合也不尽相同。对于科技风格上的体现，线框模式可能是最具有代表性意义的实现方式之一。机房数据可视化的管控维护的实现上，在工业互联网的推动下，体现的维护数据和系统搭建也越来越多样化，而 Hightopo（以下简称 HT ）的 HT for Web 产品上的有着丰富的组态化可供选择，本文将介绍如何运用 HT 丰富的 2/3D 组态搭建出一个线框楼宇可视化机房的解决方案。

界面简介及效果预览

主页面的呈现上以线框的科技风格为主的大楼设计，大楼环绕着数字飞升的光柱，场外分布着车流穿梭效果和停车场的模拟实现，其中数据中心上有着许多个设备的展示处理以及设备的预警处理，主体办公大楼侧边并列呈现着楼层的分布——办公楼层场景以及机房楼层场景；切换到内场景中的机房场景，展示了机房设备群的排列，单击选中机柜会视角转化到此设备上，并且虚化周围设备，展示出所点击的机柜信息，同时还具备一键切换查看机柜的利用率信息；另外一个内场景办公室，则起到了展示日常办公的应用场景，可以添加维护的信息数据来管理。

系统分析

纵观在工业互联网的推动下，机房可视化系统的发展是极为重要的一环。而3D可视化作为一个可进行交互式、带有多种视觉模拟体验的机房管理平台，其具有机房资产、能源、环境等管理功能，对机房全方面集中监控、统一管理。这是作为机房内部数据监控的重要一环，而整体的风格搭建上，外部建筑和设备采用的是科技风格的线框模式，在效果展示上可以更为的酷炫，交互体验上也可以增值加分。

一、线框模式的科技风格搭建

在千篇一律的场景建筑建模中，大部分都是实景上的搭建，感官上不同于科技风格的数字化展示来的震撼和酷炫，线框模式就很好地诠释了这一风格。

二、3D 可视化数据中心机房监控管理系统的搭建与应用

3D 可视化数据中心机房集中监控管理系统对机房实现远程集中监控管理，实时动态呈现设备告警信息及设备参数，快速定位出故障设备，使维护和管理从人工被动看守的方式向计算机集中控制和管理的模式转变。

代码实现

一、线框风格科技场景

在 3D 场景风格中，有着很多实现的方式选择，而线框风格是最为体现科技感的一种实现方式。场景建筑以及设备主体以线框风格展示，其中数据中心上的设备也会对应处理预警事件的展示。

线框模式是对于模型建模 obj 的一种特殊处理，机制封装在 HT 本身里面，而我们在开启线框模式的同时，可以选定一些建模风格上的限制，例如模型 obj 的四边面或者三边面就会影响到线框里线的绘制方式，这里通过合并三边面，并且开启显示四边面来起到线框风格上的简洁体现：

// 控制是否载入 obj 的四边面，否的话通过算法合并三角面
ht.Style['wf.loadQuadWireframe'] = false; 
// 控制是否显示四边面
ht.Style['wf.combineTriangle'] = true; 

在风格基调确定后，在主体大楼场景做还需要做一些简单的事件机制处理，例如模型选中状态的表现和设备预警信息弹窗的显示。 模型状态的体现是开启了模型选中的外框高