前言楼宇自控是指建筑物内的电气设备，如电梯、水泵、风扇、空调等，主要工作性质为强电驱动。通常这些设备处于开放的工作状态，也就是说，它们不形成闭环。只要打开电源，设备就可以工作。至于工作状态、过程、能耗等，无法及时在线获取数据，更谈不上合理使用和节能。现在的楼宇自控是对上述电气设备进行在线监测，通过设置相应的传感器、行程开关、光电控制等检测设备的工作状态，并通过回传到控制室的中央计算机。线，由计算机得到分析结果，然后返回到设备端进行调解。（具体效果可以参考链接：www.hightopo.com/demo/buildi...）代码实现第一步是对整个界面进行基本设置：gv.getSelectWidth=()=>{return0}//隐藏选中的边框gv.setMovableFunc(()=>{returnfalse})//禁止原语移动gv.handleScroll=()=>{}//禁止鼠标缩放gv.handlePinch=()=>{}//禁止触摸下双指缩放gv.setPannable(false)//禁止平移gv.setRectSelectable(false)//禁止框选gv.setScrollBarVisible(false)//隐藏滚动条window.document.oncontextmenu=()=>{returnfalse}//禁用全局设置的右键菜单，然后开始封装面板，实现每个块包含的动画效果。这些动画效果制作简单，能够表现出整个系统的动感。举个例子说明一下：functionchillerPanelAnim(){ letnum=[] letn=[] for(leti=0;i<10;i++){ if(i<8){ num.push(Math.random()*2) } elseif(i===8){ n.push(Math.random()*40+60) } else{ n.push(Math.random()*31) }} letoldNumValue1=chillerPanel.a('l1.l.clipPercentage') letoldNumValue2=chillerPanel.a('l2.l.clipPercentage') letoldNumValue3=chillerPanel.a('l3.l.clipPercentage')?ht.Default.startAnim({ duration:2000, easing:(t)=>{returnt}, action:(v,t)=>{ chillerPanel.a('l1.l.clipPercentage',oldNumValue1+(num[0]-oldNumValue1)*v) chillerPanel.a('l2.l.clipPercentage',oldNumValue2+(num[1]-oldNumValue2)*v) chillerPanel.a('l3.l.clipPercentage',oldNumValue3+(num[2]-oldNumValue3)*v) }, finishFunc:()=>{ setTimeout(()=>{ chillerPanelAnim( },2000) } })}关于动画的方法，可以理解为一些属性从初始值逐渐变化到目标值的过程。HT提供了ht.Default.startAnim，它支持Frame-Based和Time-Based动画，我用的是Time-Based，好处是你只需要指定duration动画周期的毫秒数，HT会在之内完成动画指定时间段，即调用动作函数的帧数或次数取决于系统环境。一般来说，系统配置更好、浏览器效率更高的机器会调用更多的帧，动画过程也会更流畅。控制interval时间间隔，可能会出现动画周期差异较大的问题。还有一个easing属性，可以通过数学公式计算来配置动画的缓动效果。有兴趣的朋友可以自己打开试试看。2.5D设备的流水线部分，我通过调度给大家介绍一下：//流动画letflowTask={ interval:10,action:(data)=>{if(data.getDisplayName()==='flow1'){data.s('shape.dash.offset',data.s('shape.dash.offset')+1)}if(data.getDisplayName()==='flow2'){数据。s('shape.dash.offset',data.s('shape.dash.offset')-1)}if(data.getDisplayName()==='flow3'){data.s('shape.dash.offset',data.s('shape.dash.offset')+5)}}}dm.addScheduleTask(flowTask)这也是一种实现动态效果的方式，主要用于指定时间间隔的函数回调处理，常用于实现图形的流动、闪烁等动画效果。流程是先通过DataModel添加调度任务。当调度任务指定的时间间隔到来时，DataModel会遍历所有原语，回调调度任务的动作函数。您可以修改该函数中传入的Dataprimitives的相应属性来实现Animation效果。更多参数和设置，请参考调度手册。还要注意的是，需要交互的图元的鼠标移入和移出事件最好分别设置view.setCursor('pointer')和view.setCursor('default')，以增强交互体验。同时，制作2.5D图元实际上需要比普通2D图元多几倍的工作量。除了按照真实角度的透视图建模外，每个部分都需要单独制作。这带来了可能滞后的问题。我们在做的时候一定要注意使用缓存规则来优化性能，尽量把每一个细节做到最好。cacheRule相当于使用同一张图片。默认规则是：图标名称+宽度+高度+缩放。如果确定规则一致，则使用相同的纹理。如果还有其他需要影响的，会返回更多的信息，比如data.a('color')，这个会额外判断它们的属性是否一致，只有一致才使用同一个缓存。如果它们不一致，尝试创建一个新的缓存纹理，这更适合静态的。摘要进入21世纪的今天，随着计算机技术和信息技术的飞速发展。建筑物内各种设备的状态监测和测量不再是随机的方法，而是扫描测量。智能建筑（IntelligentBuildings）是建筑技术与互联网技术相结合的产物，是信息社会和经济国际化的需要。我们今天建设的楼宇自动化控制系统（BAS）就属于这一类，它也是由通信自动化系统（CAS）和办公自动化系统（OAS）组成。现已广泛应用于各个领域，大大提高了管理效率、能源有效利用率、设备监控等智能一体化操作系统。还有更多高端智能操作系统等着我们推动社会信息化的进步！HTforWeb:(www.hightopo.com/demos/cn-in...)
