原本以为这次的机房资产管理项目告一段落，可以歇一歇，哥还是太天真了。我们伟大的甲方又拿下了第二期的项目，誓把哥的才华发挥到极致啊。国庆长假也没正经休息几天，硬是给人折腾出了个demo，加上了容量管理、电源走线、告警巡航这些实用功能，以及温湿度、风向、门禁、视频监控效果。哥这就给大家秀一下成果，收收膝盖，找找存在感。
对了，第一次来看哥的童鞋，这里有前两篇的链接：
第一季：如何从零开始搭建基于HTML5和WebGL的3D机房场景 第二季：场景和功能的丰富，包括机柜、设备、走线、路径规划等功能
甲方虐归虐，思路还是比较清晰的，第一期重点放在三维呈现和静态的资产管理上，第二期着重动环监控，这样基本上一个比较完整的数据中心监控系统就出来了。废话不多说了，这就开始给大家介（嘚）绍（瑟）。
界面美化
这次先是做了一些界面的美化工作，最近跟设计师mm配合得不错，果然界面档次也有所提高。
右键菜单调整
随着demo上堆砌的功能越来越多，右键的按钮也不够使了，加之有朋友反映右键菜单有点隐蔽不容易找到，我把所有的功能效果都改为从工具栏按钮进入，直接纵向显示放在了左侧，效果还不错：
动态客户信息
上次在机柜顶部显示资产编码的方式得到了客户的肯定，这次又尝试在机柜组地板上动态生成客户的信息，这就是3D的好处啊，哪儿有空我贴哪里。
其它装饰性细节
上次随手找的CCTV主播电视画面果断被吐槽了，看来大家还是很严肃地在探讨问题，所以这次我也把电视画面改成了统计图表，另外新增了特别合时宜的海报，给哥点个赞？
资产管理功能
以上都是一些界面上的小改动，下面给大家上几个硬菜。
机架可用空间
当服务器陆续上架后，会对机柜的空间产生占用和分隔。及时了解整个机房中每个机架的占用情况和空闲空间的大小情况，是非常重要的日常工作。通过3d来呈现就再适合不过了：我们把有服务器占用的空间用白色块填充，有空闲的空间根据大小不同用不同的色块填充，就有了下方的效果：
图上的颜色不光是为了好看，上面1-2U的空间用红色、5U以下的用紫色，通过不同颜色来表示连续剩余空间的数量，白色表示已经占用的空间，这样对于机房管理人员来说，可以迅速掌握整个机房的占用情况。当机房要上架一个5U的设备，我们可以一眼看到哪里有紫色的色块，并快速定出在哪里上架。
实现这一效果很简单，简单说一下思路：切换空间视图后，首先把原来的机柜隐藏，然后在同样的地方根据空间和设备情况创建多个不同的立方体进行罗列。立方体的颜色根据立方体的高度进行调整。为了增加视觉效果，可以留意立方块不要完全紧挨一起，可以留一点空隙增加立体感；空闲的方块设置一定的透明度，以和乳白色的占用空间形成一定的差异；设置一定的反光度，增加色块的质感。如下图：
机柜利用率
项目还有个需求是显示机柜的整个空间使用率情况。使用率不用显示具体哪里占用哪里空闲，只要显示一个整体使用比例即可，相对简单一点。先用一个线框把机柜位置显示出来，再把一个高度符合使用比例的立方块显示出来就行了，类似一个柱状图。设置一下颜色、光照等属性，让它看上去更真实：
纯3d的“动画”冒出来的柱状图，还能绑定真实数据，也算是个很棒的应用了。GIF录得不咋滴，想看高清大动画的朋友，还是直接看源程序吧。
告警巡航
上一篇里，已经介绍了设备告警的用法，这里进一步增加了告警巡航的功能，即当一个告警发生后，自动将镜头推向故障点，，并显示故障信息，这是告警巡航的作用。下面的图显示了当一个告警发生后，镜头会在场景中自动进行漫游，寻找机房门，进入，推向故障机柜，打开机柜门，拉出故障设备、板卡，并显示故障详细信息。
动力环境监控
动力环境监控的对象主要是机房动力和环境设备等设备，像配电、UPS、空调、温湿度、漏水、门禁、安防、消防、防雷等等，这些通常会有独立的采集和监控系统，我需要做的是把动环的效果用3D呈现，并且和系统的真实数据进行对接。
温度监控
温度监控是机房中动力环境监控的重要内容。机房里面大量的设备运行产生大量热量，需要及时监控温度的热点，避免温度过高导致设备故障。在我们的项目中，每个机柜都有温度采集器，每个机柜的纵向也有多个温度传感器，可以通过后台接口采集到。有了这些数据，就可以做温度的呈现了。一般传统的方法是显示温度数字，这样并不太直观。新潮一点的玩法是显示温度云图。也就是根据温度采样点动态生成一个渐变的温度场云图，再将图贴在地板上，这样能更直观的观察到温度在空间的变化。
温度云图模拟了热衰减的过程，并在地板上留下痕迹。同样，纵向的设备上也通过温度数值来生成色差不同的温度图贴在机架上，这样一眼就能看到整个机柜的热点在哪里，以便及时查看故障或调整空调气流。
对于没有机柜的位置，可以通过增加一个纵向空间切片来显示温度云图：
没有了爱的语言，所有的文字都是乏味的
