序：

　　目前市面上的数据中心主要分两大类，一类属于普通数据中心，机柜按照XY轴 有序排放，一类属于微模块集合的数据中心，多个机柜组合而成的微模块。

　　 本节课主要详细讲解普通数据中心的可视化展示，浏览器直接查看机房实时3D数据。

　　 功能简述：普通3D机房搭建，机柜、服务器、端口实时监控 数据联动展示，机柜动态添加、服务器上下架，动力环境数据可视化展示（温湿度云图，防盗门禁，配店，管线控制）、告警展示；

　　技术难点：

　　　　一、如何有效快速根据实际场景搭建机房模型

　　　　　　解决方案：封装各代码模型，复用代码模型，争取快速有效搭建机房

　　　　二、如何接入实时数据

　　　　　　解决方案：使用一次请求，变化更新，订阅通知机制

　　　　三、如何有效控制各场景间的切换平滑过渡，无卡顿，无延迟

　　　　　　解决方案：使用 状态机 策略，有效控制状态变更与回滚，及时把控各状态之间的切换

　　　　四、如何控制加载速度、浏览器内存、上万台服务器场景，如何有效控制帧率与处理速度

　　　　　　解决方案：使用代码模型，降低模型占中空间，使用瓦片策略，实现所见即所载，减少提笔浏览器提笔次数，保证帧率与速度。

　　 三维数据可视化执行的意义：

　　　　为什么需要可视化展示，我总结如下几点：

　　　　a、实用性：直观快速的展示数据，提示告警，快速定位问题，为解决问题节省大量时间，

　　　　b、成本管理：成本对于企业来讲是至关重要的，三维可视化可以为高层领导者，执行者提供最快捷的管理方案

　　　　c、去专业化：本着代码改变世界的愿望，可视化操控就是为了让更多人的能够看懂、操作所谓专业的东西，

　　　　d、科技：越是科技的东西，越需要直观的展示，越是复杂的东西越需要简单的描述。可视化恰恰解决了这个痛点。

　　　　e、体面：企业的数据大屏是企业的形象，三维可视化可快速提示企业高大上的企业形象，向客户展示企业的实力与精致，

　　　　d、轻便：这是技术的实现方式，使用电脑浏览器 或者手机浏览器直接查看三维机房，方便快捷

　　如有不妥之处，还望指出 交流邮箱：1203193731@qq.com

效果与功能展示：

一、机房建模

a、普通机房

数据中心代码模型：

  1.   var models = [{  // 地板
  2.         "show": true,
  3.         "uuid": "",
  4.         "name": "DCR01_floor",
  5.         "objType": "cube2",
  6.         "length": 2350+400,
  7.         "width": 2000+400,
  8.         "height": 10,
  9.         "x": 0,
  10.         "y": 0,
  11.         "z": 0,
  12.         "style": {
  13.             "skinColor": 16777215,
  14.             "skin": {
  15.                 "skin_up": {
  16.                     "skinColor": 16777215,
  17.                     "side": 1,
  18.                     "opacity": 1,
  19.                     //"imgurl": "../../img/3dImg/proj/DCR01.png",
  20.                     "imgurl": "../img/3dImg/wall/floor5.jpg",
  21.                     "repeatx": true,
  22.                     "width": 20,
  23.                     "repeaty": true,
  24.                     "height": 30
  25.                 },
  26.                 "skin_down": {
  27.                     "skinColor": 16777215,
  28.                     "side": 1,
  29.                     "opacity": 1
  30.                 },
  31.                 "skin_fore": {
  32.                     "skinColor": 16777215,
  33.                     "side": 1,
  34.                     "opacity": 1
  35.                 },
  36.                 "skin_behind": {
  37.                     "skinColor": 16777215,
  38.                     "side": 1,
  39.                     "opacity": 1
  40.                 },
  41.                 "skin_left": {
  42.                     "skinColor": 16777215,
  43.                     "side": 1,
  44.                     "opacity": 1
  45.                 },
  46.                 "skin_right": {
  47.                     "skinColor": 16777215,
  48.                     "side": 1,
  49.                     "opacity": 1
  50.                 }
  51.             }
  52.         },
  53.         "showSortNub": 1,
  54.         "customType1": "",
  55.         "customType2": "",
  56.         "animation": null,
  57.         "dbclickEvents": null,
  58.         "rotation": [{
  59.             "direction": "x",
  60.             "degree": 0
  61.         }, {
  62.             "direction": "y",
  63.             "degree": 0
  64.         }, {
  65.             "direction": "z",
  66.             "degree": 0
  67.         }],
  68.         "thick": null,
  69.         "scale": {
  70.             "x": 1,
  71.             "y": 1,
  72.             "z": 1
  73.         },
  74.         "BindDevId": null,
  75.         "BindDevName": null,
  76.         "devInfo": null,
  77.         "BindMeteId": null,
  78.         "BindMeteName": null
  79.     },/*空调开始*/
  80.     {
  81.         "show": true,
  82.         "uuid": "",
  83.         "name": "DCR01_airConditionMain_1",
  84.         "objType": "cube2",
  85.         "length": 450,
  86.         "width": 150,
  87.         "height": 400,
  88.         "x": 0,
  89.         "y": 210,
  90.         "z": -680,
  91.         "style": {
  92.             "skinColor": 16777215,
  93.             "skin": {
  94.                 "skin_up": {
  95.                     "skinColor": 16777215,
  96.                     "side": 1,
  97.                     "opacity": 1,
  98.                     "imgurl": "../img/3dImg/airconfigTop.jpg"
  99.                 },
  100.                 "skin_down": {
  101.                     "skinColor": 16777215,
  102.                     "side": 1,
  103.                     "opacity": 1,
  104.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  105.                 },
  106.                 "skin_fore": {
  107.                     "skinColor": 16777215,
  108.                     "side": 1,
  109.                     "opacity": 1,
  110.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  111.                 },
  112.                 "skin_behind": {
  113.                     "skinColor": 16777215,
  114.                     "side": 1,
  115.                     "opacity": 1,
  116.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  117.                 },
  118.                 "skin_left": {
  119.                     "skinColor": 16777215,
  120.                     "side": 1,
  121.                     "opacity": 1,
  122.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  123.                 },
  124.                 "skin_right": {
  125.                     "skinColor": 11579568,
  126.                     "side": 1,
  127.                     "opacity": 1,
  128.                     "imgurl": "../img/3dImg/airconfig.jpg"
  129.                 }
  130.             }
  131.         },
  132.         "showSortNub": 31,
  133.         "customType1": "",
  134.         "customType2": "",
  135.         "animation": null,
  136.         "dbclickEvents": null,
  137.         "rotation": [{
  138.             "direction": "x",
  139.             "degree": 0
  140.         }, {
  141.             "direction": "y",
  142.             "degree": 0
  143.         }, {
  144.             "direction": "z",
  145.             "degree": 0
  146.         }],
  147.         "thick": null,
  148.         "scale": {
  149.             "x": 1,
  150.             "y": 1,
  151.             "z": 1
  152.         },
  153.         "BindDevId": null,
  154.         "BindDevName": null,
  155.         "devInfo": null,
  156.         "BindMeteId": null,
  157.         "BindMeteName": null
  158.     }, {
  159.         "show": true,
  160.         "uuid": "",
  161.         "name": "DCR01_airConditionLogo_1",
  162.         "objType": "cube2",
  163.         "length": 70,
  164.         "width": 20,
  165.         "height": 150,
  166.         "x": 165.066,
  167.         "y": 339.192,
  168.         "z": -605.478,
  169.         "style": {
  170.             "skinColor": 16777215,
  171.             "skin": {
  172.                 "skin_up": {
  173.                     "skinColor": 16777215,
  174.                     "side": 1,
  175.                     "opacity": 1,
  176.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  177.                 },
  178.                 "skin_down": {
  179.                     "skinColor": 16777215,
  180.                     "side": 1,
  181.                     "opacity": 1,
  182.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  183.                 },
  184.                 "skin_fore": {
  185.                     "skinColor": 16777215,
  186.                     "side": 1,
  187.                     "opacity": 1,
  188.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  189.                 },
  190.                 "skin_behind": {
  191.                     "skinColor": 16777215,
  192.                     "side": 1,
  193.                     "opacity": 1,
  194.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  195.                 },
  196.                 "skin_left": {
  197.                     "skinColor": 16777215,
  198.                     "side": 1,
  199.                     "opacity": 1,
  200.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  201.                 },
  202.                 "skin_right": {
  203.                     "skinColor": 11579568,
  204.                     "side": 1,
  205.                     "opacity": 1,
  206.                     "imgurl": "../img/3dImg/airconfigLogo.jpg"
  207.                 }
  208.             }
  209.         },
  210.         "showSortNub": 31,
  211.         "customType1": "",
  212.         "customType2": "",
  213.         "animation": null,
  214.         "dbclickEvents": null,
  215.         "rotation": [{
  216.             "direction": "x",
  217.             "degree": 0
  218.         }, {
  219.             "direction": "y",
  220.             "degree": 0
  221.         }, {
  222.             "direction": "z",
  223.             "degree": 0
  224.         }],
  225.         "thick": null,
  226.         "scale": {
  227.             "x": 1,
  228.             "y": 1,
  229.             "z": 1
  230.         },
  231.         "BindDevId": null,
  232.         "BindDevName": null,
  233.         "devInfo": null,
  234.         "BindMeteId": null,
  235.         "BindMeteName": null
  236.     },
  237.     {
  238.         "show": true,
  239.         "uuid": "",
  240.         "name": "DCR01_airConditionMain_2",
  241.         "objType": "cube2",
  242.         "length": 450,
  243.         "width": 150,
  244.         "height": 400,
  245.         "x": 1045,
  246.         "y": 210,
  247.         "z": -270,
  248.         "style": {
  249.             "skinColor": 16777215,
  250.             "skin": {
  251.                 "skin_up": {
  252.                     "skinColor": 16777215,
  253.                     "side": 1,
  254.                     "opacity": 1,
  255.                     "imgurl": "../img/3dImg/airconfigTop.jpg"
  256.                 },
  257.                 "skin_down": {
  258.                     "skinColor": 16777215,
  259.                     "side": 1,
  260.                     "opacity": 1,
  261.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  262.                 },
  263.                 "skin_fore": {
  264.                     "skinColor": 16777215,
  265.                     "side": 1,
  266.                     "opacity": 1,
  267.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  268.                 },
  269.                 "skin_behind": {
  270.                     "skinColor": 16777215,
  271.                     "side": 1,
  272.                     "opacity": 1,
  273.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  274.                 },
  275.                 "skin_left": {
  276.                     "skinColor": 16777215,
  277.                     "side": 1,
  278.                     "opacity": 1,
  279.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  280.                 },
  281.                 "skin_right": {
  282.                     "skinColor": 11579568,
  283.                     "side": 1,
  284.                     "opacity": 1,
  285.                     "imgurl": "../img/3dImg/airconfig.jpg"
  286.                 }
  287.             }
  288.         },
  289.         "showSortNub": 31,
  290.         "customType1": "",
  291.         "customType2": "",
  292.         "animation": null,
  293.         "dbclickEvents": null,
  294.         "rotation": [{
  295.             "direction": "x",
  296.             "degree": 0
  297.         }, {
  298.             "direction": "y",
  299.             "degree": -Math.PI / 2
  300.         }, {
  301.             "direction": "z",
  302.             "degree": 0
  303.         }],
  304.         "thick": null,
  305.         "scale": {
  306.             "x": 1,
  307.             "y": 1,
  308.             "z": 1
  309.         },
  310.         "BindDevId": null,
  311.         "BindDevName": null,
  312.         "devInfo": null,
  313.         "BindMeteId": null,
  314.         "BindMeteName": null
  315.     }, {
  316.         "show": true,
  317.         "uuid": "",
  318.         "name": "DCR01_airConditionLogo_2",
  319.         "objType": "cube2",
  320.         "length": 70,
  321.         "width": 20,
  322.         "height": 150,
  323.         "x": 975.066,
  324.         "y": 339.192,
  325.         "z": -110.478,
  326.         "style": {
  327.             "skinColor": 16777215,
  328.             "skin": {
  329.                 "skin_up": {
  330.                     "skinColor": 16777215,
  331.                     "side": 1,
  332.                     "opacity": 1,
  333.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  334.                 },
  335.                 "skin_down": {
  336.                     "skinColor": 16777215,
  337.                     "side": 1,
  338.                     "opacity": 1,
  339.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  340.                 },
  341.                 "skin_fore": {
  342.                     "skinColor": 16777215,
  343.                     "side": 1,
  344.                     "opacity": 1,
  345.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  346.                 },
  347.                 "skin_behind": {
  348.                     "skinColor": 16777215,
  349.                     "side": 1,
  350.                     "opacity": 1,
  351.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  352.                 },
  353.                 "skin_left": {
  354.                     "skinColor": 16777215,
  355.                     "side": 1,
  356.                     "opacity": 1,
  357.                     "imgurl": "../img/3dImg/airconfigLogoTop.jpg"
  358.                 },
  359.                 "skin_right": {
  360.                     "skinColor": 11579568,
  361.                     "side": 1,
  362.                     "opacity": 1,
  363.                     "imgurl": "../img/3dImg/airconfigLogo.jpg"
  364.                 }
  365.             }
  366.         },
  367.         "showSortNub": 31,
  368.         "customType1": "",
  369.         "customType2": "",
  370.         "animation": null,
  371.         "dbclickEvents": null,
  372.         "rotation": [{
  373.             "direction": "x",
  374.             "degree": 0
  375.         }, {
  376.             "direction": "y",
  377.             "degree": -Math.PI / 2
  378.         }, {
  379.             "direction": "z",
  380.             "degree": 0
  381.         }],
  382.         "thick": null,
  383.         "scale": {
  384.             "x": 1,
  385.             "y": 1,
  386.             "z": 1
  387.         },
  388.         "BindDevId": null,
  389.         "BindDevName": null,
  390.         "devInfo": null,
  391.         "BindMeteId": null,
  392.         "BindMeteName": null
  393.     },  /*空调结束*/
  394.     {  /*墙面开始*/
  395.         "show": true,
  396.         "uuid": "",
  397.         "name": "DCR01_wall_1",
  398.         "objType": "cube2",
  399.         "length": 20,
  400.         "width": 1555, //
  401.         "height": 500,
  402.         "x": -398,
  403.         "y": 250,
  404.         "z": -780,
  405.         "style": {
  406.             "skinColor": 16777215,
  407.             "skin": {
  408.                 "skin_up": {
  409.                     "skinColor": 16777215,
  410.                     "side": 1,
  411.                     "opacity": 1
  412.                 },
  413.                 "skin_down": {
  414.                     "skinColor": 16777215,
  415.                     "side": 1,
  416.                     "opacity": 1
  417.                 },
  418.                 "skin_fore": {
  419.                     "skinColor": 16777215,
  420.                     "side": 1,
  421.                     "opacity": 1,
  422.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  423.                     "repeatx": true,
  424.                     "width": 10,
  425.                     "repeaty": true,
  426.                     "height": 1
  427.                 },
  428.                 "skin_behind": {
  429.                     "skinColor": 16777215,
  430.                     "side": 1,
  431.                     "opacity": 1,
  432.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  433.                     "repeatx": true,
  434.                     "width": 10,
  435.                     "repeaty": true,
  436.                     "height": 1
  437.                 },
  438.                 "skin_left": {
  439.                     "skinColor": 16777215,
  440.                     "side": 1,
  441.                     "opacity": 1
  442.                 },
  443.                 "skin_right": {
  444.                     "skinColor": 16777215,
  445.                     "side": 1,
  446.                     "opacity": 1
  447.                 }
  448.             }
  449.         },
  450.         "showSortNub": 447,
  451.         "customType1": "",
  452.         "customType2": "",
  453.         "animation": null,
  454.         "dbclickEvents": null,
  455.         "rotation": [{
  456.             "direction": "x",
  457.             "degree": 0
  458.         }, {
  459.             "direction": "y",
  460.             "degree": Math.PI / 2
  461.         }, {
  462.             "direction": "z",
  463.             "degree": 0
  464.         }],
  465.         "thick": null,
  466.         "scale": {
  467.             "x": 1,
  468.             "y": 1,
  469.             "z": 1
  470.         },
  471.         "BindDevId": null,
  472.         "BindDevName": null,
  473.         "devInfo": null,
  474.         "BindMeteId": null,
  475.         "BindMeteName": null
  476.     },
  477.     {
  478.         "show": true,
  479.         "uuid": "",
  480.         "name": "DCR01_wall_5",
  481.         "objType": "cube2",
  482.         "length": 20,
  483.         "width": 395,
  484.         "height": 500,
  485.         "x": 985,
  486.         "y": 250,
  487.         "z": -780,
  488.         "style": {
  489.             "skinColor": 16777215,
  490.             "skin": {
  491.                 "skin_up": {
  492.                     "skinColor": 16777215,
  493.                     "side": 1,
  494.                     "opacity": 1
  495.                 },
  496.                 "skin_down": {
  497.                     "skinColor": 16777215,
  498.                     "side": 1,
  499.                     "opacity": 1
  500.                 },
  501.                 "skin_fore": {
  502.                     "skinColor": 16777215,
  503.                     "side": 1,
  504.                     "opacity": 1,
  505.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  506.                     "repeatx": true,
  507.                     "width": 10,
  508.                     "repeaty": true,
  509.                     "height": 1
  510.                 },
  511.                 "skin_behind": {
  512.                     "skinColor": 16777215,
  513.                     "side": 1,
  514.                     "opacity": 1,
  515.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  516.                     "repeatx": true,
  517.                     "width": 10,
  518.                     "repeaty": true,
  519.                     "height": 1
  520.                 },
  521.                 "skin_left": {
  522.                     "skinColor": 16777215,
  523.                     "side": 1,
  524.                     "opacity": 1
  525.                 },
  526.                 "skin_right": {
  527.                     "skinColor": 16777215,
  528.                     "side": 1,
  529.                     "opacity": 1
  530.                 }
  531.             }
  532.         },
  533.         "showSortNub": 447,
  534.         "customType1": "",
  535.         "customType2": "",
  536.         "animation": null,
  537.         "dbclickEvents": null,
  538.         "rotation": [{
  539.             "direction": "x",
  540.             "degree": 0
  541.         }, {
  542.             "direction": "y",
  543.             "degree": Math.PI / 2
  544.         }, {
  545.             "direction": "z",
  546.             "degree": 0
  547.         }],
  548.         "thick": null,
  549.         "scale": {
  550.             "x": 1,
  551.             "y": 1,
  552.             "z": 1
  553.         },
  554.         "BindDevId": null,
  555.         "BindDevName": null,
  556.         "devInfo": null,
  557.         "BindMeteId": null,
  558.         "BindMeteName": null
  559.     },
  560.     {
  561.         "show": true,
  562.         "uuid": "",
  563.         "name": "DCR01_wall_6", // 门上墙
  564.         "objType": "cube2",
  565.         "length": 20,
  566.         "width": 416,
  567.         "height": 90,
  568.         "x": 584.406,
  569.         "y": 454.771,
  570.         "z": -780.278,
  571.         "style": {
  572.             "skinColor": 16777215,
  573.             "skin": {
  574.                 "skin_up": {
  575.                     "skinColor": 16777215,
  576.                     "side": 1,
  577.                     "opacity": 1
  578.                 },
  579.                 "skin_down": {
  580.                     "skinColor": 16777215,
  581.                     "side": 1,
  582.                     "opacity": 1
  583.                 },
  584.                 "skin_fore": {
  585.                     "skinColor": 16777215,
  586.                     "side": 1,
  587.                     "opacity": 1,
  588.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  589.                     "repeatx": true,
  590.                     "width": 1,
  591.                     "repeaty": true,
  592.                     "height": 1
  593.                 },
  594.                 "skin_behind": {
  595.                     "skinColor": 16777215,
  596.                     "side": 1,
  597.                     "opacity": 1,
  598.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  599.                     "repeatx": true,
  600.                     "width": 1,
  601.                     "repeaty": true,
  602.                     "height": 1
  603.                 },
  604.                 "skin_left": {
  605.                     "skinColor": 16777215,
  606.                     "side": 1,
  607.                     "opacity": 1
  608.                 },
  609.                 "skin_right": {
  610.                     "skinColor": 16777215,
  611.                     "side": 1,
  612.                     "opacity": 1
  613.                 }
  614.             }
  615.         },
  616.         "showSortNub": 467,
  617.         "customType1": "",
  618.         "customType2": "",
  619.         "animation": null,
  620.         "dbclickEvents": null,
  621.         "rotation": [{
  622.             "direction": "x",
  623.             "degree": 0
  624.         }, {
  625.             "direction": "y",
  626.             "degree": -Math.PI / 2
  627.         }, {
  628.             "direction": "z",
  629.             "degree": 0
  630.         }],
  631.         "thick": null,
  632.         "scale": {
  633.             "x": 1,
  634.             "y": 1,
  635.             "z": 1
  636.         },
  637.         "BindDevId": null,
  638.         "BindDevName": null,
  639.         "devInfo": null,
  640.         "BindMeteId": null,
  641.         "BindMeteName": null
  642.     },
  643.     {
  644.         "show": true,
  645.         "uuid": "",
  646.         "name": "DCR01_wall_2",
  647.         "objType": "cube2",
  648.         "length": 20,
  649.         "width": 2350,
  650.         "height": 500,
  651.         "x": 0,
  652.         "y": 250,
  653.         "z": 1000,
  654.         "style": {
  655.             "skinColor": 16777215,
  656.             "skin": {
  657.                 "skin_up": {
  658.                     "skinColor": 16777215,
  659.                     "side": 1,
  660.                     "opacity": 1
  661.                 },
  662.                 "skin_down": {
  663.                     "skinColor": 16777215,
  664.                     "side": 1,
  665.                     "opacity": 1
  666.                 },
  667.                 "skin_fore": {
  668.                     "skinColor": 16777215,
  669.                     "side": 1,
  670.                     "opacity": 1,
  671.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  672.                     "repeatx": true,
  673.                     "width": 10,
  674.                     "repeaty": true,
  675.                     "height": 1
  676.                 },
  677.                 "skin_behind": {
  678.                     "skinColor": 16777215,
  679.                     "side": 1,
  680.                     "opacity": 1,
  681.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  682.                     "repeatx": true,
  683.                     "width": 10,
  684.                     "repeaty": true,
  685.                     "height": 1
  686.                 },
  687.                 "skin_left": {
  688.                     "skinColor": 16777215,
  689.                     "side": 1,
  690.                     "opacity": 1
  691.                 },
  692.                 "skin_right": {
  693.                     "skinColor": 16777215,
  694.                     "side": 1,
  695.                     "opacity": 1
  696.                 }
  697.             }
  698.         },
  699.         "showSortNub": 447,
  700.         "customType1": "",
  701.         "customType2": "",
  702.         "animation": null,
  703.         "dbclickEvents": null,
  704.         "rotation": [{
  705.             "direction": "x",
  706.             "degree": 0
  707.         }, {
  708.             "direction": "y",
  709.             "degree": Math.PI / 2
  710.         }, {
  711.             "direction": "z",
  712.             "degree": 0
  713.         }],
  714.         "thick": null,
  715.         "scale": {
  716.             "x": 1,
  717.             "y": 1,
  718.             "z": 1
  719.         },
  720.         "BindDevId": null,
  721.         "BindDevName": null,
  722.         "devInfo": null,
  723.         "BindMeteId": null,
  724.         "BindMeteName": null
  725.     }, {
  726.         "show": true,
  727.         "uuid": "",
  728.         "name": "DCR01_wall_3",
  729.         "objType": "cube2",
  730.         "length": 20,
  731.         "width": 1795,
  732.         "height": 500,
  733.         "x": 1175,
  734.         "y": 250,
  735.         "z": 110,
  736.         "style": {
  737.             "skinColor": 16777215,
  738.             "skin": {
  739.                 "skin_up": {
  740.                     "skinColor": 16777215,
  741.                     "side": 1,
  742.                     "opacity": 1
  743.                 },
  744.                 "skin_down": {
  745.                     "skinColor": 16777215,
  746.                     "side": 1,
  747.                     "opacity": 1
  748.                 },
  749.                 "skin_fore": {
  750.                     "skinColor": 16777215,
  751.                     "side": 1,
  752.                     "opacity": 1,
  753.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  754.                     "repeatx": true,
  755.                     "width": 10,
  756.                     "repeaty": true,
  757.                     "height": 1
  758.                 },
  759.                 "skin_behind": {
  760.                     "skinColor": 16777215,
  761.                     "side": 1,
  762.                     "opacity": 1,
  763.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  764.                     "repeatx": true,
  765.                     "width": 10,
  766.                     "repeaty": true,
  767.                     "height": 1
  768.                 },
  769.                 "skin_left": {
  770.                     "skinColor": 16777215,
  771.                     "side": 1,
  772.                     "opacity": 1
  773.                 },
  774.                 "skin_right": {
  775.                     "skinColor": 16777215,
  776.                     "side": 1,
  777.                     "opacity": 1
  778.                 }
  779.             }
  780.         },
  781.         "showSortNub": 447,
  782.         "customType1": "",
  783.         "customType2": "",
  784.         "animation": null,
  785.         "dbclickEvents": null,
  786.         "rotation": [{
  787.             "direction": "x",
  788.             "degree": 0
  789.         }, {
  790.             "direction": "y",
  791.             "degree": 0
  792.         }, {
  793.             "direction": "z",
  794.             "degree": 0
  795.         }],
  796.         "thick": null,
  797.         "scale": {
  798.             "x": 1,
  799.             "y": 1,
  800.             "z": 1
  801.         },
  802.         "BindDevId": null,
  803.         "BindDevName": null,
  804.         "devInfo": null,
  805.         "BindMeteId": null,
  806.         "BindMeteName": null
  807.     }, {
  808.         "show": true,
  809.         "uuid": "",
  810.         "name": "DCR01_wall_4",
  811.         "objType": "cube2",
  812.         "length": 20,
  813.         "width": 1795,
  814.         "height": 500,
  815.         "x": -1175,
  816.         "y": 250,
  817.         "z": 110,
  818.         "style": {
  819.             "skinColor": 16777215,
  820.             "skin": {
  821.                 "skin_up": {
  822.                     "skinColor": 16777215,
  823.                     "side": 1,
  824.                     "opacity": 1
  825.                 },
  826.                 "skin_down": {
  827.                     "skinColor": 16777215,
  828.                     "side": 1,
  829.                     "opacity": 1
  830.                 },
  831.                 "skin_fore": {
  832.                     "skinColor": 16777215,
  833.                     "side": 1,
  834.                     "opacity": 1,
  835.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  836.                     "repeatx": true,
  837.                     "width": 10,
  838.                     "repeaty": true,
  839.                     "height": 1
  840.                 },
  841.                 "skin_behind": {
  842.                     "skinColor": 16777215,
  843.                     "side": 1,
  844.                     "opacity": 1,
  845.                     "imgurl": "../img/3dImg/wall/wall16.jpg",
  846.                     "repeatx": true,
  847.                     "width": 10,
  848.                     "repeaty": true,
  849.                     "height": 1
  850.                 },
  851.                 "skin_left": {
  852.                     "skinColor": 16777215,
  853.                     "side": 1,
  854.                     "opacity": 1
  855.                 },
  856.                 "skin_right": {
  857.                     "skinColor": 16777215,
  858.                     "side": 1,
  859.                     "opacity": 1
  860.                 }
  861.             }
  862.         },
  863.         "showSortNub": 447,
  864.         "customType1": "",
  865.         "customType2": "",
  866.         "animation": null,
  867.         "dbclickEvents": null,
  868.         "rotation": [{
  869.             "direction": "x",
  870.             "degree": 0
  871.         }, {
  872.             "direction": "y",
  873.             "degree": 0
  874.         }, {
  875.             "direction": "z",
  876.             "degree": 0
  877.         }],
  878.         "thick": null,
  879.         "scale": {
  880.             "x": 1,
  881.             "y": 1,
  882.             "z": 1
  883.         },
  884.         "BindDevId": null,
  885.         "BindDevName": null,
  886.         "devInfo": null,
  887.         "BindMeteId": null,
  888.         "BindMeteName": null
  889.     }, /*墙结束*/
  890.     {
  891.         "show": true,
  892.         "uuid": "",
  893.         "name": "DCR01_door_1",
  894.         "objType": "cube2",
  895.         "length": 8,
  896.         "width": 208,
  897.         "height": 410,
  898.         "x": 480,
  899.         "y": 210,
  900.         "z": -780.213,
  901.         "style": {
  902.             "skinColor": 16777215,
  903.             "skin": {
  904.                 "skin_up": {
  905.                     "skinColor": 16777215,
  906.                     "side": 1,
  907.                     "opacity": 1,
  908.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  909.                 },
  910.                 "skin_down": {
  911.                     "skinColor": 16777215,
  912.                     "side": 1,
  913.                     "opacity": 1
  914.                 },
  915.                 "skin_fore": {
  916.                     "skinColor": 16777215,
  917.                     "side": 1,
  918.                     "opacity": 1,
  919.                     "imgurl": "../img/3dImg/door_right.png"
  920.                 },
  921.                 "skin_behind": {
  922.                     "skinColor": 16777215,
  923.                     "side": 1,
  924.                     "opacity": 1,
  925.                     "imgurl": "../img/3dImg/door_left.png"
  926.                 },
  927.                 "skin_left": {
  928.                     "skinColor": 16777215,
  929.                     "side": 1,
  930.                     "opacity": 1,
  931.                     "imgurl": "../img/3dImg/door_right.png"
  932.                 },
  933.                 "skin_right": {
  934.                     "skinColor": 16777215,
  935.                     "side": 1,
  936.                     "opacity": 1,
  937.                     "imgurl": "../img/3dImg/door_right.png"
  938.                 }
  939.             }
  940.         },
  941.         "showSortNub": 1,
  942.         "customType1": "",
  943.         "customType2": "",
  944.         "animation": null,
  945.         "dbclickEvents": null,
  946.         "rotation": [{
  947.             "direction": "x",
  948.             "degree": 0
  949.         }, {
  950.             "direction": "y",
  951.             "degree": Math.PI / 2
  952.         }, {
  953.             "direction": "z",
  954.             "degree": 0
  955.         }],
  956.         "thick": null,
  957.         "scale": {
  958.             "x": 1,
  959.             "y": 1,
  960.             "z": 1
  961.         },
  962.         "BindDevId": null,
  963.         "BindDevName": null,
  964.         "devInfo": null,
  965.         "BindMeteId": null,
  966.         "BindMeteName": null
  967.     },
  968.     {
  969.         "show": true,
  970.         "uuid": "",
  971.         "name": "DCR01_door_2",
  972.         "objType": "cube2",
  973.         "length": 8,
  974.         "width": 208,
  975.         "height": 410,
  976.         "x": 680,
  977.         "y": 210,
  978.         "z": -780.213,
  979.         "style": {
  980.             "skinColor": 16777215,
  981.             "skin": {
  982.                 "skin_up": {
  983.                     "skinColor": 16777215,
  984.                     "side": 1,
  985.                     "opacity": 1,
  986.                     "imgurl": "../img/3dImg/rack_inside.jpg"
  987.                 },
  988.                 "skin_down": {
  989.                     "skinColor": 16777215,
  990.                     "side": 1,
  991.                     "opacity": 1
  992.                 },
  993.                 "skin_fore": {
  994.                     "skinColor": 16777215,
  995.                     "side": 1,
  996.                     "opacity": 1,
  997.                     "imgurl": "../img/3dImg/door_left.png"
  998.                 },
  999.                 "skin_behind": {
  1000.                     "skinColor": 16777215,
  1001.                     "side": 1,
  1002.                     "opacity": 1,
  1003.                     "imgurl": "../img/3dImg/door_right.png"
  1004.                 },
  1005.                 "skin_left": {
  1006.                     "skinColor": 16777215,
  1007.                     "side": 1,
  1008.                     "opacity": 1
  1009.                 },
  1010.                 "skin_right": {
  1011.                     "skinColor": 16777215,
  1012.                     "side": 1,
  1013.                     "opacity": 1
  1014.                 }
  1015.             }
  1016.         },
  1017.         "showSortNub": 1,
  1018.         "customType1": "",
  1019.         "customType2": "",
  1020.         "animation": null,
  1021.         "dbclickEvents": null,
  1022.         "rotation": [{
  1023.             "direction": "x",
  1024.             "degree": 0
  1025.         }, {
  1026.             "direction": "y",
  1027.             "degree": Math.PI / 2
  1028.         }, {
  1029.             "direction": "z",
  1030.             "degree": 0
  1031.         }],
  1032.         "thick": null,
  1033.         "scale": {
  1034.             "x": 1,
  1035.             "y": 1,
  1036.             "z": 1
  1037.         },
  1038.         "BindDevId": null,
  1039.         "BindDevName": null,
  1040.         "devInfo": null,
  1041.         "BindMeteId": null,
  1042.         "BindMeteName": null
  1043.     }, {
  1044.         "objType": "jsonobj",
  1045.         "fileurl": "../img/3dImg/OBJS/FireExtinguisher.json",  // 灭火器
  1046.         "name": "TCL_mhq_1",
  1047.         "scale": {
  1048.             "x": 20,
  1049.             "y": 15,
  1050.             "z": 20
  1051.         },
  1052.         "position": {
  1053.             "x": 1045,
  1054.             "y": 9,
  1055.             "z": 400,
  1056.         },
  1057.         "rotation": [{
  1058.             "direction": "x",
  1059.             "degree": 0
  1060.         }, {
  1061.             "direction": "y",
  1062.             "degree": 0.3141592653589793
  1063.         }, {
  1064.             "direction": "z",
  1065.             "degree": 0
  1066.         }],
  1067.         "showSortNub": 146,
  1068.         "show": true,
  1069.         "customType1": "",
  1070.         "customType2": "",
  1071.         "animation": null,
  1072.         "dbclickEvents": null,
  1073.         "BindDevId": null,
  1074.         "BindDevName": null,
  1075.         "devInfo": null,
  1076.         "BindMeteId": null,
  1077.         "BindMeteName": null
  1078.     }, {
  1079.         "objType": "jsonobj",
  1080.         "fileurl": "../img/3dImg/OBJS/FireExtinguisher.json",  // 灭火器
  1081.         "name": "TCL_mhq_2",
  1082.         "scale": {
  1083.             "x": 20,
  1084.             "y": 15,
  1085.             "z": 20
  1086.         },
  1087.         "position": {
  1088.             "x": 1045,
  1089.             "y": 9,
  1090.             "z": 420,
  1091.         },
  1092.         "rotation": [{
  1093.             "direction": "x",
  1094.             "degree": 0
  1095.         }, {
  1096.             "direction": "y",
  1097.             "degree": 0.3141592653589793
  1098.         }, {
  1099.             "direction": "z",
  1100.             "degree": 0
  1101.         }],
  1102.         "showSortNub": 146,
  1103.         "show": true,
  1104.         "customType1": "",
  1105.         "customType2": "",
  1106.         "animation": null,
  1107.         "dbclickEvents": null,
  1108.         "BindDevId": null,
  1109.         "BindDevName": null,
  1110.         "devInfo": null,
  1111.         "BindMeteId": null,
  1112.         "BindMeteName": null
  1113.     },
  1114.     {
  1115.         "show": false,
  1116.         "uuid": "",
  1117.         "name": "DCR01_airConditionMain_1_wind",  // 风
  1118.         "objType": "flowTube",
  1119.         "points": [{
  1120.             "x": 0,
  1121.             "y": 0,
  1122.             "z": 0
  1123.         }, {
  1124.             "x": 0,
  1125.             "y": 50,
  1126.             "z": 100
  1127.         }, {
  1128.             "x": 0,
  1129.             "y": 50,
  1130.             "z": 400
  1131.         }],
  1132.         "position": {
  1133.             "x": 0.791,
  1134.             "y": 378.066,
  1135.             "z": -680.816
  1136.         },
  1137.         "scale": {
  1138.             "x": 1,
  1139.             "y": 1,
  1140.             "z": 1
  1141.         },
  1142.         "rotation": [{
  1143.             "direction": "x",
  1144.             "degree": 0
  1145.         }, {
  1146.             "direction": "y",
  1147.             "degree": 0
  1148.         }, {
  1149.             "direction": "z",
  1150.             "degree": 0
  1151.         }],
  1152.         "style": {
  1153.             "skinColor": 16772846,
  1154.             "imgurl": "../img/3dImg/right1.png",
  1155.             "opacity": 1,
  1156.             "canvasSkin": {
  1157.                 "cwidth": 1024,
  1158.                 "cheight": 128,
  1159.                 "cwNub": 16,
  1160.                 "chNub": 16,
  1161.                 "cMarginW": 0.2,
  1162.                 "cMarginH": 0.2,
  1163.                 "speed": 4,
  1164.                 "fps": 40,
  1165.                 "direction": "w",
  1166.                 "forward": "f",
  1167.                 "side": 2,
  1168.                 "run": true,
  1169.                 "bgcolor": "rgba(0, 108, 249, 0.12)"
  1170.             }
  1171.         },
  1172.         "segments": 5,
  1173.         "radialSegments": 2,
  1174.         "closed": false,
  1175.         "radius": 200,
  1176.         "showSortNub": 20000,
  1177.         "customType1": "",
  1178.         "customType2": "",
  1179.         "animation": null,
  1180.         "dbclickEvents": null,
  1181.         "BindDevId": null,
  1182.         "BindDevName": null,
  1183.         "devInfo": null,
  1184.         "BindMeteId": null,
  1185.         "BindMeteName": null
  1186.     },
  1187.     {
  1188.         "show": false,
  1189.         "uuid": "",
  1190.         "name": "DCR01_airConditionMain_2_wind",  // 风
  1191.         "objType": "flowTube",
  1192.         "points": [{
  1193.             "x": 0,
  1194.             "y": 0,
  1195.             "z": 0
  1196.         }, {
  1197.             "x": 0,
  1198.             "y": 50,
  1199.             "z": 100
  1200.         }, {
  1201.             "x": 0,
  1202.             "y": 50,
  1203.             "z": 400
  1204.         }],
  1205.         "position": {
  1206.             "x": 1045.791,
  1207.             "y": 378.066,
  1208.             "z": -270.816
  1209.         },
  1210.         "scale": {
  1211.             "x": 1,
  1212.             "y": 1,
  1213.             "z": 1
  1214.         },
  1215.         "rotation": [{
  1216.             "direction": "x",
  1217.             "degree": 0
  1218.         }, {
  1219.             "direction": "y",
  1220.             "degree": -Math.PI / 2
  1221.         }, {
  1222.             "direction": "z",
  1223.             "degree": 0
  1224.         }],
  1225.         "style": {
  1226.             "skinColor": 16772846,
  1227.             "imgurl": "../img/3dImg/right1.png",
  1228.             "opacity": 1,
  1229.             "canvasSkin": {
  1230.                 "cwidth": 1024,
  1231.                 "cheight": 128,
  1232.                 "cwNub": 16,
  1233.                 "chNub": 16,
  1234.                 "cMarginW": 0.2,
  1235.                 "cMarginH": 0.2,
  1236.                 "speed": 4,
  1237.                 "fps": 40,
  1238.                 "direction": "w",
  1239.                 "forward": "f",
  1240.                 "side": 2,
  1241.                 "run": true,
  1242.                 "bgcolor": "rgba(0, 108, 249, 0.12)"
  1243.             }
  1244.         },
  1245.         "segments": 5,
  1246.         "radialSegments": 2,
  1247.         "closed": false,
  1248.         "radius": 200,
  1249.         "showSortNub": 20000,
  1250.         "customType1": "",
  1251.         "customType2": "",
  1252.         "animation": null,
  1253.         "dbclickEvents": null,
  1254.         "BindDevId": null,
  1255.         "BindDevName": null,
  1256.         "devInfo": null,
  1257.         "BindMeteId": null,
  1258.         "BindMeteName": null
  1259.     }, {
  1260.         "show": false,
  1261.         "uuid": "",
  1262.         "name": "TCL_line_cube_1", // 机柜排线管理
  1263.         "objType": "cube2",
  1264.         "length": 120,
  1265.         "width": 1105,
  1266.         "height": 20,
  1267.         "x": 475,
  1268.         "y": 420,
  1269.         "z": 250,
  1270.         "style": {
  1271.             "skinColor": 16777215,
  1272.             "skin": {
  1273.                 "skin_up": {
  1274.                     "skinColor": 16777215,
  1275.                     "side": 0,
  1276.                     "opacity": 1
  1277.                 },
  1278.                 "skin_down": {
  1279.                     "skinColor": 2580374,
  1280.                     "side": 0,
  1281.                     "opacity": 1,
  1282.                     "imgurl": "../img/3dImg/back.png",
  1283.                     "repeatx": true,
  1284.                     "width": 1,
  1285.                     "repeaty": true,
  1286.                     "height": 10
  1287.                 },
  1288.                 "skin_fore": {
  1289.                     "skinColor": 3374847,
  1290.                     "side": 2,
  1291.                     "opacity": 1
  1292.                 },
  1293.                 "skin_behind": {
  1294.                     "skinColor": 3374847,
  1295.                     "side": 2,
  1296.                     "opacity": 1
  1297.                 },
  1298.                 "skin_left": {
  1299.                     "skinColor": 3374847,
  1300.                     "side": 0,
  1301.                     "opacity": 1
  1302.                 },
  1303.                 "skin_right": {
  1304.                     "skinColor": 3374847,
  1305.                     "side": 0,
  1306.                     "opacity": 1
  1307.                 }
  1308.             }
  1309.         },
  1310.         "showSortNub": 20005,
  1311.         "customType1": "",
  1312.         "customType2": "",
  1313.         "animation": null,
  1314.         "dbclickEvents": null,
  1315.         "rotation": [{
  1316.             "direction": "x",
  1317.             "degree": 0
  1318.         }, {
  1319.             "direction": "y",
  1320.             "degree": 0
  1321.         }, {
  1322.             "direction": "z",
  1323.             "degree": 0
  1324.         }],
  1325.         "thick": null,
  1326.         "scale": {
  1327.             "x": 1,
  1328.             "y": 1,
  1329.             "z": 1
  1330.         },
  1331.         "BindDevId": null,
  1332.         "BindDevName": null,
  1333.         "devInfo": null,
  1334.         "BindMeteId": null,
  1335.         "BindMeteName": null
  1336.     }, {
  1337.         "show": false,
  1338.         "uuid": "",
  1339.         "name": "TCL_line_cube_2", // 机柜排线管理
  1340.         "objType": "cube2",
  1341.         "length": 120,
  1342.         "width": 1105,
  1343.         "height": 20,
  1344.         "x": 25,
  1345.         "y": 420,
  1346.         "z": 250,
  1347.         "style": {
  1348.             "skinColor": 16777215,
  1349.             "skin": {
  1350.                 "skin_up": {
  1351.                     "skinColor": 16777215,
  1352.                     "side": 0,
  1353.                     "opacity": 1
  1354.                 },
  1355.                 "skin_down": {
  1356.                     "skinColor": 2580374,
  1357.                     "side": 0,
  1358.                     "opacity": 1,
  1359.                     "imgurl": "../img/3dImg/back.png",
  1360.                     "repeatx": true,
  1361.                     "width": 1,
  1362.                     "repeaty": true,
  1363.                     "height": 10
  1364.                 },
  1365.                 "skin_fore": {
  1366.                     "skinColor": 3374847,
  1367.                     "side": 2,
  1368.                     "opacity": 1
  1369.                 },
  1370.                 "skin_behind": {
  1371.                     "skinColor": 3374847,
  1372.                     "side": 2,
  1373.                     "opacity": 1
  1374.                 },
  1375.                 "skin_left": {
  1376.                     "skinColor": 3374847,
  1377.                     "side": 0,
  1378.                     "opacity": 1
  1379.                 },
  1380.                 "skin_right": {
  1381.                     "skinColor": 3374847,
  1382.                     "side": 0,
  1383.                     "opacity": 1
  1384.                 }
  1385.             }
  1386.         },
  1387.         "showSortNub": 20005,
  1388.         "customType1": "",
  1389.         "customType2": "",
  1390.         "animation": null,
  1391.         "dbclickEvents": null,
  1392.         "rotation": [{
  1393.             "direction": "x",
  1394.             "degree": 0
  1395.         }, {
  1396.             "direction": "y",
  1397.             "degree": 0
  1398.         }, {
  1399.             "direction": "z",
  1400.             "degree": 0
  1401.         }],
  1402.         "thick": null,
  1403.         "scale": {
  1404.             "x": 1,
  1405.             "y": 1,
  1406.             "z": 1
  1407.         },
  1408.         "BindDevId": null,
  1409.         "BindDevName": null,
  1410.         "devInfo": null,
  1411.         "BindMeteId": null,
  1412.         "BindMeteName": null
  1413.     }, {
  1414.         "show": false,
  1415.         "uuid": "",
  1416.         "name": "TCL_line_cube_3", // 机柜排线管理
  1417.         "objType": "cube2",
  1418.         "length": 120,
  1419.         "width": 1105,
  1420.         "height": 20,
  1421.         "x": -425,
  1422.         "y": 420,
  1423.         "z": 250,
  1424.         "style": {
  1425.             "skinColor": 16777215,
  1426.             "skin": {
  1427.                 "skin_up": {
  1428.                     "skinColor": 16777215,
  1429.                     "side": 0,
  1430.                     "opacity": 1
  1431.                 },
  1432.                 "skin_down": {
  1433.                     "skinColor": 2580374,
  1434.                     "side": 0,
  1435.                     "opacity": 1,
  1436.                     "imgurl": "../img/3dImg/back.png",
  1437.                     "repeatx": true,
  1438.                     "width": 1,
  1439.                     "repeaty": true,
  1440.                     "height": 10
  1441.                 },
  1442.                 "skin_fore": {
  1443.                     "skinColor": 3374847,
  1444.                     "side": 2,
  1445.                     "opacity": 1
  1446.                 },
  1447.                 "skin_behind": {
  1448.                     "skinColor": 3374847,
  1449.                     "side": 2,
  1450.                     "opacity": 1
  1451.                 },
  1452.                 "skin_left": {
  1453.                     "skinColor": 3374847,
  1454.                     "side": 0,
  1455.                     "opacity": 1
  1456.                 },
  1457.                 "skin_right": {
  1458.                     "skinColor": 3374847,
  1459.                     "side": 0,
  1460.                     "opacity": 1
  1461.                 }
  1462.             }
  1463.         },
  1464.         "showSortNub": 20005,
  1465.         "customType1": "",
  1466.         "customType2": "",
  1467.         "animation": null,
  1468.         "dbclickEvents": null,
  1469.         "rotation": [{
  1470.             "direction": "x",
  1471.             "degree": 0
  1472.         }, {
  1473.             "direction": "y",
  1474.             "degree": 0
  1475.         }, {
  1476.             "direction": "z",
  1477.             "degree": 0
  1478.         }],
  1479.         "thick": null,
  1480.         "scale": {
  1481.             "x": 1,
  1482.             "y": 1,
  1483.             "z": 1
  1484.         },
  1485.         "BindDevId": null,
  1486.         "BindDevName": null,
  1487.         "devInfo": null,
  1488.         "BindMeteId": null,
  1489.         "BindMeteName": null
  1490.     }, {
  1491.         "show": false,
  1492.         "uuid": "",
  1493.         "name": "TCL_line_cube_4", // 机柜排线管理
  1494.         "objType": "cube2",
  1495.         "length": 120,
  1496.         "width": 1105,
  1497.         "height": 20,
  1498.         "x": -875,
  1499.         "y": 420,
  1500.         "z": 250,
  1501.         "style": {
  1502.             "skinColor": 16777215,
  1503.             "skin": {
  1504.                 "skin_up": {
  1505.                     "skinColor": 16777215,
  1506.                     "side": 0,
  1507.                     "opacity": 1
  1508.                 },
  1509.                 "skin_down": {
  1510.                     "skinColor": 2580374,
  1511.                     "side": 0,
  1512.                     "opacity": 1,
  1513.                     "imgurl": "../img/3dImg/back.png",
  1514.                     "repeatx": true,
  1515.                     "width": 1,
  1516.                     "repeaty": true,
  1517.                     "height": 10
  1518.                 },
  1519.                 "skin_fore": {
  1520.                     "skinColor": 3374847,
  1521.                     "side": 2,
  1522.                     "opacity": 1
  1523.                 },
  1524.                 "skin_behind": {
  1525.                     "skinColor": 3374847,
  1526.                     "side": 2,
  1527.                     "opacity": 1
  1528.                 },
  1529.                 "skin_left": {
  1530.                     "skinColor": 3374847,
  1531.                     "side": 0,
  1532.                     "opacity": 1
  1533.                 },
  1534.                 "skin_right": {
  1535.                     "skinColor": 3374847,
  1536.                     "side": 0,
  1537.                     "opacity": 1
  1538.                 }
  1539.             }
  1540.         },
  1541.         "showSortNub": 20005,
  1542.         "customType1": "",
  1543.         "customType2": "",
  1544.         "animation": null,
  1545.         "dbclickEvents": null,
  1546.         "rotation": [{
  1547.             "direction": "x",
  1548.             "degree": 0
  1549.         }, {
  1550.             "direction": "y",
  1551.             "degree": 0
  1552.         }, {
  1553.             "direction": "z",
  1554.             "degree": 0
  1555.         }],
  1556.         "thick": null,
  1557.         "scale": {
  1558.             "x": 1,
  1559.             "y": 1,
  1560.             "z": 1
  1561.         },
  1562.         "BindDevId": null,
  1563.         "BindDevName": null,
  1564.         "devInfo": null,
  1565.         "BindMeteId": null,
  1566.         "BindMeteName": null
  1567.     }, {
  1568.         "show": false,
  1569.         "uuid": "",
  1570.         "name": "TCL_line_1_1",
  1571.         "objType": "tube",
  1572.         "points": [{
  1573.             "x": 0,
  1574.             "y": 0,
  1575.             "z": -544
  1576.         }, {
  1577.             "x": 0,
  1578.             "y": 0,
  1579.             "z": 202
  1580.         }, {
  1581.             "x": 0,
  1582.             "y": 0,
  1583.             "z": 560
  1584.         }],
  1585.         "position": {
  1586.             "x": 475.179,
  1587.             "y": 420.485,
  1588.             "z": 250
  1589.         },
  1590.         "scale": {
  1591.             "x": 1,
  1592.             "y": 1,
  1593.             "z": 1
  1594.         },
  1595.         "rotation": [{
  1596.             "direction": "x",
  1597.             "degree": 0
  1598.         }, {
  1599.             "direction": "y",
  1600.             "degree": 0
  1601.         }, {
  1602.             "direction": "z",
  1603.             "degree": 0
  1604.         }],
  1605.         "style": {
  1606.             "skinColor": 3407796,
  1607.             "imgurl": "../img/3dImg/water.jpg",
  1608.             "side": 2,
  1609.             "opacity": 1
  1610.         },
  1611.         "segments": 5,
  1612.         "radialSegments": 8,
  1613.         "closed": false,
  1614.         "radius": 5,
  1615.         "showSortNub": 58,
  1616.         "customType1": "",
  1617.         "customType2": "",
  1618.         "animation": null,
  1619.         "dbclickEvents": null,
  1620.         "BindDevId": null,
  1621.         "BindDevName": null,
  1622.         "devInfo": null,
  1623.         "BindMeteId": null,
  1624.         "BindMeteName": null
  1625.     }, {
  1626.         "show": false,
  1627.         "uuid": "",
  1628.         "name": "TCL_line_1_2",
  1629.         "objType": "tube",
  1630.         "points": [{
  1631.             "x": 0,
  1632.             "y": 0,
  1633.             "z": -544
  1634.         }, {
  1635.             "x": 0,
  1636.             "y": 0,
  1637.             "z": 202
  1638.         }, {
  1639.             "x": 0,
  1640.             "y": 0,
  1641.             "z": 560
  1642.         }],
  1643.         "position": {
  1644.             "x": 450.179,
  1645.             "y": 420.485,
  1646.             "z": 250
  1647.         },
  1648.         "scale": {
  1649.             "x": 1,
  1650.             "y": 1,
  1651.             "z": 1
  1652.         },
  1653.         "rotation": [{
  1654.             "direction": "x",
  1655.             "degree": 0
  1656.         }, {
  1657.             "direction": "y",
  1658.             "degree": 0
  1659.         }, {
  1660.             "direction": "z",
  1661.             "degree": 0
  1662.         }],
  1663.         "style": {
  1664.             "skinColor": 16774912,
  1665.             "imgurl": "../img/3dImg/water.jpg",
  1666.             "side": 2,
  1667.             "opacity": 1
  1668.         },
  1669.         "segments": 5,
  1670.         "radialSegments": 8,
  1671.         "closed": false,
  1672.         "radius": 5,
  1673.         "showSortNub": 58,
  1674.         "customType1": "",
  1675.         "customType2": "",
  1676.         "animation": null,
  1677.         "dbclickEvents": null,
  1678.         "BindDevId": null,
  1679.         "BindDevName": null,
  1680.         "devInfo": null,
  1681.         "BindMeteId": null,
  1682.         "BindMeteName": null
  1683.     }, {
  1684.         "show": false,
  1685.         "uuid": "",
  1686.         "name": "TCL_line_1_3",
  1687.         "objType": "tube",
  1688.         "points": [{
  1689.             "x": 0,
  1690.             "y": 0,
  1691.             "z": -544
  1692.         }, {
  1693.             "x": 0,
  1694.             "y": 0,
  1695.             "z": 202
  1696.         }, {
  1697.             "x": 0,
  1698.             "y": 0,
  1699.             "z": 560
  1700.         }],
  1701.         "position": {
  1702.             "x": 500.179,
  1703.             "y": 420.485,
  1704.             "z": 250
  1705.         },
  1706.         "scale": {
  1707.             "x": 1,
  1708.             "y": 1,
  1709.             "z": 1
  1710.         },
  1711.         "rotation": [{
  1712.             "direction": "x",
  1713.             "degree": 0
  1714.         }, {
  1715.             "direction": "y",
  1716.             "degree": 0
  1717.         }, {
  1718.             "direction": "z",
  1719.             "degree": 0
  1720.         }],
  1721.         "style": {
  1722.             "skinColor": 10879490,
  1723.             "imgurl": "../img/3dImg/water.jpg",
  1724.             "side": 2,
  1725.             "opacity": 1
  1726.         },
  1727.         "segments": 5,
  1728.         "radialSegments": 8,
  1729.         "closed": false,
  1730.         "radius": 5,
  1731.         "showSortNub": 58,
  1732.         "customType1": "",
  1733.         "customType2": "",
  1734.         "animation": null,
  1735.         "dbclickEvents": null,
  1736.         "BindDevId": null,
  1737.         "BindDevName": null,
  1738.         "devInfo": null,
  1739.         "BindMeteId": null,
  1740.         "BindMeteName": null
  1741.     },
  1742.     {
  1743.         "show": false,
  1744.         "uuid": "",
  1745.         "name": "TCL_line_2_1",
  1746.         "objType": "tube",
  1747.         "points": [{
  1748.             "x": 0,
  1749.             "y": 0,
  1750.             "z": -544
  1751.         }, {
  1752.             "x": 0,
  1753.             "y": 0,
  1754.             "z": 202
  1755.         }, {
  1756.             "x": 0,
  1757.             "y": 0,
  1758.             "z": 560
  1759.         }],
  1760.         "position": {
  1761.             "x": 25.179,
  1762.             "y": 420.485,
  1763.             "z": 250
  1764.         },
  1765.         "scale": {
  1766.             "x": 1,
  1767.             "y": 1,
  1768.             "z": 1
  1769.         },
  1770.         "rotation": [{
  1771.             "direction": "x",
  1772.             "degree": 0
  1773.         }, {
  1774.             "direction": "y",
  1775.             "degree": 0
  1776.         }, {
  1777.             "direction": "z",
  1778.             "degree": 0
  1779.         }],
  1780.         "style": {
  1781.             "skinColor": 3407796,
  1782.             "imgurl": "../img/3dImg/water.jpg",
  1783.             "side": 2,
  1784.             "opacity": 1
  1785.         },
  1786.         "segments": 5,
  1787.         "radialSegments": 8,
  1788.         "closed": false,
  1789.         "radius": 5,
  1790.         "showSortNub": 58,
  1791.         "customType1": "",
  1792.         "customType2": "",
  1793.         "animation": null,
  1794.         "dbclickEvents": null,
  1795.         "BindDevId": null,
  1796.         "BindDevName": null,
  1797.         "devInfo": null,
  1798.         "BindMeteId": null,
  1799.         "BindMeteName": null
  1800.     }, {
  1801.         "show": false,
  1802.         "uuid": "",
  1803.         "name": "TCL_line_2_2",
  1804.         "objType": "tube",
  1805.         "points": [{
  1806.             "x": 0,
  1807.             "y": 0,
  1808.             "z": -544
  1809.         }, {
  1810.             "x": 0,
  1811.             "y": 0,
  1812.             "z": 202
  1813.         }, {
  1814.             "x": 0,
  1815.             "y": 0,
  1816.             "z": 560
  1817.         }],
  1818.         "position": {
  1819.             "x": 0.179,
  1820.             "y": 420.485,
  1821.             "z": 250
  1822.         },
  1823.         "scale": {
  1824.             "x": 1,
  1825.             "y": 1,
  1826.             "z": 1
  1827.         },
  1828.         "rotation": [{
  1829.             "direction": "x",
  1830.             "degree": 0
  1831.         }, {
  1832.             "direction": "y",
  1833.             "degree": 0
  1834.         }, {
  1835.             "direction": "z",
  1836.             "degree": 0
  1837.         }],
  1838.         "style": {
  1839.             "skinColor": 16774912,
  1840.             "imgurl": "../img/3dImg/water.jpg",
  1841.             "side": 2,
  1842.             "opacity": 1
  1843.         },
  1844.         "segments": 5,
  1845.         "radialSegments": 8,
  1846.         "closed": false,
  1847.         "radius": 5,
  1848.         "showSortNub": 58,
  1849.         "customType1": "",
  1850.         "customType2": "",
  1851.         "animation": null,
  1852.         "dbclickEvents": null,
  1853.         "BindDevId": null,
  1854.         "BindDevName": null,
  1855.         "devInfo": null,
  1856.         "BindMeteId": null,
  1857.         "BindMeteName": null
  1858.     }, {
  1859.         "show": false,
  1860.         "uuid": "",
  1861.         "name": "TCL_line_2_3",
  1862.         "objType": "tube",
  1863.         "points": [{
  1864.             "x": 0,
  1865.             "y": 0,
  1866.             "z": -544
  1867.         }, {
  1868.             "x": 0,
  1869.             "y": 0,
  1870.             "z": 202
  1871.         }, {
  1872.             "x": 0,
  1873.             "y": 0,
  1874.             "z": 560
  1875.         }],
  1876.         "position": {
  1877.             "x": 50.179,
  1878.             "y": 420.485,
  1879.             "z": 250
  1880.         },
  1881.         "scale": {
  1882.             "x": 1,
  1883.             "y": 1,
  1884.             "z": 1
  1885.         },
  1886.         "rotation": [{
  1887.             "direction": "x",
  1888.             "degree": 0
  1889.         }, {
  1890.             "direction": "y",
  1891.             "degree": 0
  1892.         }, {
  1893.             "direction": "z",
  1894.             "degree": 0
  1895.         }],
  1896.         "style": {
  1897.             "skinColor": 10879490,
  1898.             "imgurl": "../img/3dImg/water.jpg",
  1899.             "side": 2,
  1900.             "opacity": 1
  1901.         },
  1902.         "segments": 5,
  1903.         "radialSegments": 8,
  1904.         "closed": false,
  1905.         "radius": 5,
  1906.         "showSortNub": 58,
  1907.         "customType1": "",
  1908.         "customType2": "",
  1909.         "animation": null,
  1910.         "dbclickEvents": null,
  1911.         "BindDevId": null,
  1912.         "BindDevName": null,
  1913.         "devInfo": null,
  1914.         "BindMeteId": null,
  1915.         "BindMeteName": null
  1916.     },
  1917.     {
  1918.         "show": false,
  1919.         "uuid": "",
  1920.         "name": "TCL_line_3_1",
  1921.         "objType": "tube",
  1922.         "points": [{
  1923.             "x": 0,
  1924.             "y": 0,
  1925.             "z": -544
  1926.         }, {
  1927.             "x": 0,
  1928.             "y": 0,
  1929.             "z": 202
  1930.         }, {
  1931.             "x": 0,
  1932.             "y": 0,
  1933.             "z": 560
  1934.         }],
  1935.         "position": {
  1936.             "x": -425.179,
  1937.             "y": 420.485,
  1938.             "z": 250
  1939.         },
  1940.         "scale": {
  1941.             "x": 1,
  1942.             "y": 1,
  1943.             "z": 1
  1944.         },
  1945.         "rotation": [{
  1946.             "direction": "x",
  1947.             "degree": 0
  1948.         }, {
  1949.             "direction": "y",
  1950.             "degree": 0
  1951.         }, {
  1952.             "direction": "z",
  1953.             "degree": 0
  1954.         }],
  1955.         "style": {
  1956.             "skinColor": 3407796,
  1957.             "imgurl": "../img/3dImg/water.jpg",
  1958.             "side": 2,
  1959.             "opacity": 1
  1960.         },
  1961.         "segments": 5,
  1962.         "radialSegments": 8,
  1963.         "closed": false,
  1964.         "radius": 5,
  1965.         "showSortNub": 58,
  1966.         "customType1": "",
  1967.         "customType2": "",
  1968.         "animation": null,
  1969.         "dbclickEvents": null,
  1970.         "BindDevId": null,
  1971.         "BindDevName": null,
  1972.         "devInfo": null,
  1973.         "BindMeteId": null,
  1974.         "BindMeteName": null
  1975.     }, {
  1976.         "show": false,
  1977.         "uuid": "",
  1978.         "name": "TCL_line_3_2",
  1979.         "objType": "tube",
  1980.         "points": [{
  1981.             "x": 0,
  1982.             "y": 0,
  1983.             "z": -544
  1984.         }, {
  1985.             "x": 0,
  1986.             "y": 0,
  1987.             "z": 202
  1988.         }, {
  1989.             "x": 0,
  1990.             "y": 0,
  1991.             "z": 560
  1992.         }],
  1993.         "position": {
  1994.             "x": -450.179,
  1995.             "y": 420.485,
  1996.             "z": 250
  1997.         },
  1998.         "scale": {
  1999.             "x": 1,
  2000.             "y": 1,
  2001.             "z": 1
  2002.         },
  2003.         "rotation": [{
  2004.             "direction": "x",
  2005.             "degree": 0
  2006.         }, {
  2007.             "direction": "y",
  2008.             "degree": 0
  2009.         }, {
  2010.             "direction": "z",
  2011.             "degree": 0
  2012.         }],
  2013.         "style": {
  2014.             "skinColor": 16774912,
  2015.             "imgurl": "../img/3dImg/water.jpg",
  2016.             "side": 2,
  2017.             "opacity": 1
  2018.         },
  2019.         "segments": 5,
  2020.         "radialSegments": 8,
  2021.         "closed": false,
  2022.         "radius": 5,
  2023.         "showSortNub": 58,
  2024.         "customType1": "",
  2025.         "customType2": "",
  2026.         "animation": null,
  2027.         "dbclickEvents": null,
  2028.         "BindDevId": null,
  2029.         "BindDevName": null,
  2030.         "devInfo": null,
  2031.         "BindMeteId": null,
  2032.         "BindMeteName": null
  2033.     }, {
  2034.         "show": false,
  2035.         "uuid": "",
  2036.         "name": "TCL_line_3_3",
  2037.         "objType": "tube",
  2038.         "points": [{
  2039.             "x": 0,
  2040.             "y": 0,
  2041.             "z": -544
  2042.         }, {
  2043.             "x": 0,
  2044.             "y": 0,
  2045.             "z": 202
  2046.         }, {
  2047.             "x": 0,
  2048.             "y": 0,
  2049.             "z": 560
  2050.         }],
  2051.         "position": {
  2052.             "x": -400.179,
  2053.             "y": 420.485,
  2054.             "z": 250
  2055.         },
  2056.         "scale": {
  2057.             "x": 1,
  2058.             "y": 1,
  2059.             "z": 1
  2060.         },
  2061.         "rotation": [{
  2062.             "direction": "x",
  2063.             "degree": 0
  2064.         }, {
  2065.             "direction": "y",
  2066.             "degree": 0
  2067.         }, {
  2068.             "direction": "z",
  2069.             "degree": 0
  2070.         }],
  2071.         "style": {
  2072.             "skinColor": 10879490,
  2073.             "imgurl": "../img/3dImg/water.jpg",
  2074.             "side": 2,
  2075.             "opacity": 1
  2076.         },
  2077.         "segments": 5,
  2078.         "radialSegments": 8,
  2079.         "closed": false,
  2080.         "radius": 5,
  2081.         "showSortNub": 58,
  2082.         "customType1": "",
  2083.         "customType2": "",
  2084.         "animation": null,
  2085.         "dbclickEvents": null,
  2086.         "BindDevId": null,
  2087.         "BindDevName": null,
  2088.         "devInfo": null,
  2089.         "BindMeteId": null,
  2090.         "BindMeteName": null
  2091.     },
  2092.     {
  2093.         "show": false,
  2094.         "uuid": "",
  2095.         "name": "TCL_line_4_1",
  2096.         "objType": "tube",
  2097.         "points": [{
  2098.             "x": 0,
  2099.             "y": 0,
  2100.             "z": -544
  2101.         }, {
  2102.             "x": 0,
  2103.             "y": 0,
  2104.             "z": 202
  2105.         }, {
  2106.             "x": 0,
  2107.             "y": 0,
  2108.             "z": 560
  2109.         }],
  2110.         "position": {
  2111.             "x": -875.179,
  2112.             "y": 420.485,
  2113.             "z": 250
  2114.         },
  2115.         "scale": {
  2116.             "x": 1,
  2117.             "y": 1,
  2118.             "z": 1
  2119.         },
  2120.         "rotation": [{
  2121.             "direction": "x",
  2122.             "degree": 0
  2123.         }, {
  2124.             "direction": "y",
  2125.             "degree": 0
  2126.         }, {
  2127.             "direction": "z",
  2128.             "degree": 0
  2129.         }],
  2130.         "style": {
  2131.             "skinColor": 3407796,
  2132.             "imgurl": "../img/3dImg/water.jpg",
  2133.             "side": 2,
  2134.             "opacity": 1
  2135.         },
  2136.         "segments": 5,
  2137.         "radialSegments": 8,
  2138.         "closed": false,
  2139.         "radius": 5,
  2140.         "showSortNub": 58,
  2141.         "customType1": "",
  2142.         "customType2": "",
  2143.         "animation": null,
  2144.         "dbclickEvents": null,
  2145.         "BindDevId": null,
  2146.         "BindDevName": null,
  2147.         "devInfo": null,
  2148.         "BindMeteId": null,
  2149.         "BindMeteName": null
  2150.     }, {
  2151.         "show": false,
  2152.         "uuid": "",
  2153.         "name": "TCL_line_4_2",
  2154.         "objType": "tube",
  2155.         "points": [{
  2156.             "x": 0,
  2157.             "y": 0,
  2158.             "z": -544
  2159.         }, {
  2160.             "x": 0,
  2161.             "y": 0,
  2162.             "z": 202
  2163.         }, {
  2164.             "x": 0,
  2165.             "y": 0,
  2166.             "z": 560
  2167.         }],
  2168.         "position": {
  2169.             "x": -900.179,
  2170.             "y": 420.485,
  2171.             "z": 250
  2172.         },
  2173.         "scale": {
  2174.             "x": 1,
  2175.             "y": 1,
  2176.             "z": 1
  2177.         },
  2178.         "rotation": [{
  2179.             "direction": "x",
  2180.             "degree": 0
  2181.         }, {
  2182.             "direction": "y",
  2183.             "degree": 0
  2184.         }, {
  2185.             "direction": "z",
  2186.             "degree": 0
  2187.         }],
  2188.         "style": {
  2189.             "skinColor": 16774912,
  2190.             "imgurl": "../img/3dImg/water.jpg",
  2191.             "side": 2,
  2192.             "opacity": 1
  2193.         },
  2194.         "segments": 5,
  2195.         "radialSegments": 8,
  2196.         "closed": false,
  2197.         "radius": 5,
  2198.         "showSortNub": 58,
  2199.         "customType1": "",
  2200.         "customType2": "",
  2201.         "animation": null,
  2202.         "dbclickEvents": null,
  2203.         "BindDevId": null,
  2204.         "BindDevName": null,
  2205.         "devInfo": null,
  2206.         "BindMeteId": null,
  2207.         "BindMeteName": null
  2208.     }, {
  2209.         "show": false,
  2210.         "uuid": "",
  2211.         "name": "TCL_line_4_3",
  2212.         "objType": "tube",
  2213.         "points": [{
  2214.             "x": 0,
  2215.             "y": 0,
  2216.             "z": -544
  2217.         }, {
  2218.             "x": 0,
  2219.             "y": 0,
  2220.             "z": 202
  2221.         }, {
  2222.             "x": 0,
  2223.             "y": 0,
  2224.             "z": 560
  2225.         }],
  2226.         "position": {
  2227.             "x": -850.179,
  2228.             "y": 420.485,
  2229.             "z": 250
  2230.         },
  2231.         "scale": {
  2232.             "x": 1,
  2233.             "y": 1,
  2234.             "z": 1
  2235.         },
  2236.         "rotation": [{
  2237.             "direction": "x",
  2238.             "degree": 0
  2239.         }, {
  2240.             "direction": "y",
  2241.             "degree": 0
  2242.         }, {
  2243.             "direction": "z",
  2244.             "degree": 0
  2245.         }],
  2246.         "style": {
  2247.             "skinColor": 10879490,
  2248.             "imgurl": "../img/3dImg/water.jpg",
  2249.             "side": 2,
  2250.             "opacity": 1
  2251.         },
  2252.         "segments": 5,
  2253.         "radialSegments": 8,
  2254.         "closed": false,
  2255.         "radius": 5,
  2256.         "showSortNub": 58,
  2257.         "customType1": "",
  2258.         "customType2": "",
  2259.         "animation": null,
  2260.         "dbclickEvents": null,
  2261.         "BindDevId": null,
  2262.         "BindDevName": null,
  2263.         "devInfo": null,
  2264.         "BindMeteId": null,
  2265.         "BindMeteName": null
  2266.     },
  2267.     ];
  2268.  
  2269.     // 添加机柜
  2270.     for (var i = 1; i <= 6; i++) {
  2271.         var showface = -1;
  2272.         if (i == 6) {
  2273.             showface = 0;
  2274.         }
  2275.         var _cab = getCabinetModel("DCR01_cab_A_" + i,   // 获取机柜静态模型
  2276.             { x: 1, y: 1, z: 1 },
  2277.             { "x": 475, "y": 210, "z": -60 + (i - 1) * 155 }, [{ "direction": "y", "degree": Math.PI }], showface, roomName);
  2278.         models.push(_cab);
  2279.         var _cabinet = wtserverAPI.CabinetBoxHandlerCacheData["c_" + roomName + "_" + "DCR01_cab_A_" + i];
  2280.         var devsNubs = 0;
  2281.         if (_cabinet && _cabinet.devChildren) {
  2282.             devsNubs = _cabinet.devChildren.length;
  2283.         }
  2284.         if (devsNubs > 0) {
  2285.             var serversGroup = getServerModel("DCR01_cab_A_" + i + "_sGroup", 0, { "x": 475, "y": 210, "z": -60 + (i - 1) * 155 }, { x: 1, y: 1, z: 1 }, Math.PI); // 给有设备的机柜贴图?
  2286.             models.push(serversGroup);
  2287.         }
  2288.     }
  2289.  
  2290.     models.push(getCabinetModel("DCR01_cab_A_26",   // 获取机柜静态模型  MF
  2291.         { x: 1, y: 1, z: 1 },
  2292.         { "x": 475, "y": 210, "z": -215 }, [{ "direction": "y", "degree": Math.PI }], 1, roomName));
  2293.  
  2294.     models.push(getCabinetModel("DCR01_cab_A_27",   // 获取机柜静态模型
  2295.         { x: 1, y: 1, z: 1 },
  2296.         { "x": 25, "y": 210, "z": -215 }, [{ "direction": "y", "degree": Math.PI }], 1, roomName));
  2297.  
  2298.     for (var i = 1; i <= 6; i++) {
  2299.         var showface = -1;
  2300.         if (i == 6) {
  2301.             showface = 0;
  2302.         }
  2303.         var _cab = getCabinetModel("DCR01_cab_A_" + (i + 6),   // 获取机柜静态模型
  2304.             { x: 1, y: 1, z: 1 },
  2305.             { "x": 25, "y": 210, "z": -60 + (i - 1) * 155 }, [{ "direction": "y", "degree": Math.PI }], showface, roomName);
  2306.         models.push(_cab);
  2307.         var _cabinet = wtserverAPI.CabinetBoxHandlerCacheData["c_" + roomName + "_" + "DCR01_cab_A_" + (i + 6)];
  2308.         var devsNubs = 0;
  2309.         if (_cabinet && _cabinet.devChildren) {
  2310.             devsNubs = _cabinet.devChildren.length;
  2311.         }
  2312.         if (devsNubs > 0) {
  2313.             var serversGroup = getServerModel("DCR01_cab_A_" + i + "_sGroup", 0, { "x": 25, "y": 210, "z": -60 + (i - 1) * 155 }, { x: 1, y: 1, z: 1 }, Math.PI); // 给有设备的机柜贴图?
  2314.             models.push(serversGroup);
  2315.         }
  2316.     }
  2317.  
  2318.     for (var i = 1; i <= 6; i++) {
  2319.         var showface = -1;
  2320.         if (i == 1) {
  2321.             showface = 1;
  2322.         } else if (i == 6) {
  2323.             showface = 0;
  2324.         }
  2325.         var _cab = getCabinetModel("DCR01_cab_A_" + (i + 12),   // 获取机柜静态模型
  2326.             { x: 1, y: 1, z: 1 },
  2327.             { "x": -435, "y": 210, "z": -60 + (i - 1) * 155 }, [{ "direction": "y", "degree": Math.PI }], showface, roomName);
  2328.         models.push(_cab);
  2329.         var _cabinet = wtserverAPI.CabinetBoxHandlerCacheData["c_" + roomName + "_" + "DCR01_cab_A_" + (i + 12)];
  2330.         var devsNubs = 0;
  2331.         if (_cabinet && _cabinet.devChildren) {
  2332.             devsNubs = _cabinet.devChildren.length;
  2333.         }
  2334.         if (devsNubs > 0) {
  2335.             var serversGroup = getServerModel("DCR01_cab_A_" + i + "_sGroup", 0, { "x": -425, "y": 210, "z": -60 + (i - 1) * 155 }, { x: 1, y: 1, z: 1 }, Math.PI); // 给有设备的机柜贴图?
  2336.             models.push(serversGroup);
  2337.         }
  2338.     }
  2339.  
  2340.     for (var i = 1; i <= 7; i++) {
  2341.         var showface = -1;
  2342.         if (i == 1) {
  2343.             showface = 1;
  2344.         } else if (i == 7) {
  2345.             showface = 0;
  2346.         }
  2347.         var _cab = getCabinetModel("DCR01_cab_A_" + (i + 18),   // 获取机柜静态模型
  2348.             { x: 1, y: 1, z: 1 },
  2349.             { "x": -890, "y": 210, "z": -215 + (i - 1) * 155 }, [{ "direction": "y", "degree": Math.PI }], showface, roomName);
  2350.         models.push(_cab);
  2351.         var _cabinet = wtserverAPI.CabinetBoxHandlerCacheData["c_" + roomName + "_" + "DCR01_cab_A_" + (i + 18)];
  2352.         var devsNubs = 0;
  2353.         if (_cabinet && _cabinet.devChildren) {
  2354.             devsNubs = _cabinet.devChildren.length;
  2355.         }
  2356.         if (devsNubs > 0) {
  2357.             var serversGroup = getServerModel("DCR01_cab_A_" + i + "_sGroup", 0, { "x": -890, "y": 210, "z": -215 + (i - 1) * 155 }, { x: 1, y: 1, z: 1 }, Math.PI); // 给有设备的机柜贴图?
  2358.             models.push(serversGroup);
  2359.         }
  2360.     }
  2361.  
  2362.     //优化模型 MF>这样怎么就优化了模型
  2363.     var oldobjnames = [];
  2364.     for (var i = 1; i <= 27; i++) {
  2365.         oldobjnames.push("DCR01_cab_A_" + i);
  2366.     }
  2367.     models.push({
  2368.         show: true,
  2369.         objType: "MergeModels",
  2370.         oldObjNames: oldobjnames
  2371.     });

b、实现不规则机房建模

下面是环境场景多的情况下 建立的模型

我们推进摄像机 展示一个局部的模型情况

画中画效果 在3D模型内展示视频 或者电脑桌面 或其它

c、微模块机房建模（下节课重点讲述）

d、综合机房（含有微模块与普通机柜）

二、鼠标滑过机柜，显示机柜概要信息

三、双击机柜，显示机柜详情

四、打开机柜门 显示机柜内部服务器详细信息

五、机柜利用率展示

代码实现：

//cabnames 表示名称

ModelBussiness.prototype.showSpaceRate = function () {

    var _this = this;

    var cabnames = wtserverAPI.cabNames;

    if (_this.rateSpaceState == 0) {

        _this.rateSpaceState = 1;

        $("#backBtn").fadeIn();

        layer.closeAll();

        $("#toolbar").fadeOut();

        //隐藏所有

        _this.hideAllCabinet("aaaa", function () {

            if (_this.rateSpaceCubeNames.length <= 0) {    //获取利用率

                var loadindex = layer.load();

                wtserverAPI.CabRate(modelBussiness.roomName, function (result) {

                    layer.closeAll();

                    console.log(result);

                    var cabRates = {};

                    if (result && result.length && result.length > 0) {

                        $.each(result, function (_index, _obj) {

                            var _cab = wtserverAPI.getCabinetByUUID(modelBussiness.roomName, _obj.cabid);

                            if (_cab && _cab.cabName) {

                                cabRates[_cab.cabName] = _obj.useRate;

                            }

                        });

                    }

                    console.log(cabRates);

                    for (var i = 0; i < cabnames.length; i++) {

                        var itcobj = WT3DObj.commonFunc.findObject(cabnames[i]);

                        var rateValue = 0;

                        if (cabRates[cabnames[i]]) {

                            rateValue = cabRates[cabnames[i]];

                        }

                        var style = {

                            borderColor: 0xffffff,

                            innerColor: 0x6495ed,

                            innerOprity: 1,

                            outColor: 0xffffff,

                            outOprity: 0.1

                        };

                        _this.commonFunc.createRateCube(cabnames[i],

                            { x: 160, y: 380, z: 140 },

                            { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                            { x: 0, y: 0, z: 0 },

                            rateValue,

                            style, { timelong: 1000 });

                    }

                }, function (err) {

                    layer.closeAll();

                    var cabRates = {};

                    //if (result && result.length && result.length > 0) {

                    //    $.each(result, function (_index, _obj) {

                    //        var _cab = wtserverAPI.getCabinetByUUID(modelBussiness.roomName, _obj.cabid);

                    //        if (_cab && _cab.cabName) {

                    //            cabRates[_cab.cabName] = _obj.useRate;

                    //        }

                    //    });

                    //}

                    console.log(cabRates);

                    for (var i = 0; i < cabnames.length; i++) {

                        var itcobj = WT3DObj.commonFunc.findObject(cabnames[i]);

                        var rateValue = 0;

                        if (cabRates[cabnames[i]]) {

                            rateValue = cabRates[cabnames[i]];

                        }

                        var style = {

                            borderColor: 0xffffff,

                            innerColor: 0x6495ed,

                            innerOprity: 1,

                            outColor: 0xffffff,

                            outOprity: 0.1

                        };

                        _this.commonFunc.createRateCube(cabnames[i],

                            { x: 160, y: 380, z: 140 },

                            { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                            { x: 0, y: 0, z: 0 },

                            rateValue,

                            style, { timelong: 1000 });

                    }

                });

            }

            else {

                for (var i = 0; i < cabnames.length; i++) {

                    var rateValue = Math.random();

                    var style = {

                        borderColor: 0xffffff,

                        innerColor: 0x6495ed,

                        innerOprity: 1,

                        outColor: 0xffffff,

                        outOprity: 0.1

                    };

                    var itcobj = WT3DObj.commonFunc.findObject(cabnames[i]);

                    _this.commonFunc.createRateCube(cabnames[i],

                        { x: 160, y: 380, z: 140 },

                        { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                        { x: 0, y: 0, z: 0 },

                        rateValue,

                        style, { timelong: 1000 });

                }

            }

        });

    }

    else {

        _this.hideSpaceRate();

        if (_this.needHideCabinets.length > 0) {

            WT3DObj.commonFunc.changeCameraPosition({ x: 2531, y: 3967, z: -1150 }, { x: -615, y: 0, z: -35 }, 1000, function () {

                $.each(_this.needHideCabinets, function (_index, _obj) {

                    if (_obj.name.indexOf("_rate_") < 0 && _obj.name.indexOf("_yearCube_") < 0) {

                        _obj.visible = true;

                    }

                });

            });

        }

    }

}

　　

六、机柜可用控件展示

代码实现：

MSS.prototype.showUsageMap_old = function () {

    var _this = this;

    //WT3DObj.commonFunc.changeCameraPosition({ x: 3626.8806598704978, y: 2503.5840662851847, z: 1333.887505251365 }, { x: 115.96408129332937, y: 178.8991280155388, z: 368.1924201030766 },1000, function () { });

    if (_this.agesSpaceState == 0) {

        _this.agesSpaceState = 1;

        $("#backBtn").fadeIn();

        layer.closeAll();

        $("#toolbar").fadeOut();

        //隐藏所有

        _this.hideAllCabinet("aaaa", function () {

            if (_this.agesSpaceCubeNames.length <= 0) {

                var loadindex = layer.load();

                wtserverAPI.FreeSpace(modelBussiness.roomName, function (result) {

                    layer.closeAll();

                    console.log(result);

                    var cabNoUse = {};

                    if (result && result.length && result.length > 0) {

                        $.each(result, function (_index, _obj) {

                            var _cab = wtserverAPI.getCabinetByUUID(modelBussiness.roomName, _obj.cabid);

                            if (_cab && _cab.cabName) {

                                var ageValue = [];

                                if (_obj.uPositionUsed && _obj.uPositionUsed.length && _obj.uPositionUsed.length > 0) {

                                    for (var j = 0; j < _obj.uPositionUsed.length - 1; j++) {

                                        if (j == 0) {

                                            ageValue.push({

                                                value: 1,

                                                max: _obj.uPositionUsed[0],

                                                min: _obj.uPositionUsed[0]

                                            });

                                        }

                                        if (_obj.uPositionUsed[j + 1] - _obj.uPositionUsed[j] > 1) {

                                            ageValue.push({

                                                value: 1,

                                                max: _obj.uPositionUsed[j + 1],

                                                min: _obj.uPositionUsed[j + 1]

                                            });

                                        } else {

                                            ageValue[ageValue.length - 1].max = _obj.uPositionUsed[j + 1];

                                        }

                                    }

                                }

                                cabNoUse[_cab.cabName] = ageValue;

                            }

                        });

                    }

                    console.log(cabNoUse);

                    for (var i = 1; i <= 49; i++) {

                        var itcobj = WT3DObj.commonFunc.findObject(modelBussiness.roomName + "_cab_A_" + i);

                        var ageValue = [];

                        if (cabNoUse[modelBussiness.roomName + "_cab_A_" + i]) {

                            ageValue = cabNoUse[modelBussiness.roomName + "_cab_A_" + i];

                        }

                        var style = {

                            borderColor: 0x444444,

                            outColor: 0xffffff,

                            outOprity: 0.1

                        };

                        _this.commonFunc.createUseageCube(modelBussiness.roomName + "_cab_A_" + i,

                            { x: 160, y: 380, z: 140 },

                            { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                            { x: 0, y: 0, z: 0 },

                            ageValue,

                            style, { timelong: 1000 }, i);

                    }

                    for (var i = 1; i <= 48; i++) {

                        var itcobj = WT3DObj.commonFunc.findObject(modelBussiness.roomName + "_cab_B_" + i);

                        var ageValue = [];

                        if (cabNoUse[modelBussiness.roomName + "_cab_B_" + i]) {

                            ageValue = cabNoUse[modelBussiness.roomName + "_cab_B_" + i];

                        }

                        var style = {

                            borderColor: 0x444444,

                            outColor: 0xffffff,

                            outOprity: 0.1

                        };

                        var itcobj = WT3DObj.commonFunc.findObject(modelBussiness.roomName + "_cab_B_" + i);

                        _this.commonFunc.createUseageCube(modelBussiness.roomName + "_cab_B_" + i,

                            { x: 160, y: 380, z: 140 },

                            { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                            { x: 0, y: 0, z: 0 },

                            ageValue,

                            style, { timelong: 1000 }, i);

                    }

                }, function () {

                    layer.closeAll();

                    layer.msg("数据接口异常，查无数据！");

                });

            }

            else {

                for (var i = 1; i <= 49; i++) {

                    var itcobj = WT3DObj.commonFunc.findObject(modelBussiness.roomName + "_cab_A_" + i);

                    var ageValue = [];

                    var style = {

                        borderColor: 0xffffff,

                        outColor: 0xffffff,

                        outOprity: 0.1

                    };

                    _this.commonFunc.createUseageCube(modelBussiness.roomName + "_cab_A_" + i,

                        { x: 160, y: 378, z: 140 },

                        { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                        { x: 0, y: 0, z: 0 },

                        ageValue,

                        style, { timelong: 1000 }, i);

                }

                for (var i = 1; i <= 48; i++) {

                    var itcobj = WT3DObj.commonFunc.findObject(modelBussiness.roomName + "_cab_B_" + i);

                    var ageValue = [];

                    var style = {

                        borderColor: 0xffffff,

                        outColor: 0xffffff,

                        outOprity: 0.1

                    };

                    _this.commonFunc.createUseageCube(modelBussiness.roomName + "_cab_B_" + i,

                        { x: 160, y: 378, z: 140 },

                        { x: itcobj.position.x, y: itcobj.position.y, z: itcobj.position.z },

                        { x: 0, y: 0, z: 0 },

                        ageValue,

                        style, { timelong: 1000 }, i);

                }

            }

        });

    } else {

        this.hideUsageSpaceRate();

        if (_this.needHideCabinets.length > 0) {

            WT3DObj.commonFunc.changeCameraPosition({ x: 2531, y: 3967, z: -1150 }, { x: -615, y: 0, z: -35 }, 1000, function () {

                $.each(_this.needHideCabinets, function (_index, _obj) {

                    if (_obj.name.indexOf("_rate_") < 0 && _obj.name.indexOf("_yearCube_") < 0) {

                        _obj.visible = true;

                    }

                });

            });

        }

    }

}

　　

七、机房内排线

八、机房温度云图展示

九、告警机柜展示

烟雾告警模拟

十、空调通风

　　二、数据对接代码实现

　　

function WTServerAPI() { }

WTServerAPI.prototype.init = function () {

    this.alarmColors = {

        "灾难": "0xff0000",

        "警告": "0xff0000",

        "严重": "0xffff00",

        "一般": "0x00ff00",

        "经过": "0x00ffff",

    }

}

WTServerAPI.prototype.getAlarmColor = function (lstr) {

    return this.alarmColors[lstr] ? this.alarmColors[lstr] : "0xff0000";

}

WTServerAPI.prototype.roomId = function (key) {

    var keyValues = {

        ITC: "c12d7373-a6db-4a3f-96a0-f1a851a8825d",

        PCR: "dd01271f-7129-4ba1-afcb-fb2dd9017db9",

        DCR01: "b243a046-31f5-4ba4-891c-bd4e8368c0d9",

        DCR02: "d8de327b-6b11-4a18-b1d8-168ce0c06d4f",

        DCR03: "9c26ffd0-e9b1-40bb-8437-a74336c36d26",

        DCR04: "00a33071-252a-423e-891d-2d836ae23d00"

    };

    return keyValues[key];

}

WTServerAPI.prototype.startSigalrServer = function (callBack) {

    $.getScript(wtserverAPI.SignalrHubs, function () {

        $.connection.hub.url = wtserverAPI.SignalrUrl;

        var chat = $.connection.signalRHub;

        chat.client.Room3DAlert = function (res) {

            if (callBack) {

                callBack(res);

            }

        };

        //开始连接

        $.connection.hub.start().done(function () {

            // console.log("连接成功");

        }).fail(function () {

            // console.log("连接失败");

        });

    });

}

WTServerAPI.prototype.SigalrMsg = function (res) {

    var msg = JSON.parse(res);

    console.log(msg);

    if (msg) {

        if (msg.msgType && msg.msgType == "Room3DAlert") {

            if (modelBussiness) {

                modelBussiness.alarmServer(msg.message);

            }

        }

    }

}

/*

接口方式:get

返回格式: json

Url:服务端自定

参数:url?room={0}&cabinetNub={1}

参数说明：room代表机房编号,cabinetNub为机柜编号，当cabinetNub=-1时返回该机房所有服务器设备信息

接口方式:get

返回格式: json

Url:服务端自定

参数:

     action:  “cabInfo”                                      // 执行的方法

      roomID : “c12d7373-a6db-4a3f-96a0-f1a851a8825d”         // 机房ID,

     cabinetNub:  “ ”                                     // 机柜编号

参数说明：roomID代表机房编号,cabinetNub为机柜编号，当cabinetNub=-1时返回该机房所有服务器设备信息

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

    "result":  [

        {

            "cabinetNub": "A1",

            "devChildren": [//这是一个数组 列表

                {

                    "devId": "",//设备id  这里面的id或者编号要用于数据绑定 要和数据库里面的设备id或者编号一致

                    "devCode": "",//设备编号   这里面的id或者编号要用于数据绑定 要和数据库里面的设备id或者编号一致

                    "devName": "",//设备名称

                    "devType": "",//前后端协定一些设备类型

                    "devURange": {//[5,8] 这里左闭 右闭区间

                        "min": 5,

                        "max":8

                    },

                    "devCustomSkin": {//自定义设备皮肤 可不填写

                        "topImg": "img地址",

                        "bottomImg": "img地址",

                        "foreImg": "img地址",

                        "behindImg": "img地址",

                        "leftImg": "img地址",

                        "rightImg": "img地址",

                    },

                },

                //.............此处表示更多

            ]

        },

         {

             "cabinetNub": "A2",

             "devChildren": [

                 {

                     "devId": "",//设备id  这里面的id或者编号要用于数据绑定 要和数据库里面的设备id或者编号一致

                     "devCode": "",//设备编号   这里面的id或者编号要用于数据绑定 要和数据库里面的设备id或者编号一致

                     "devName": "",//设备名称

                     "devType": "",//前后端协定一些设备类型

                     "devURange": {//[5,8] 这里左闭 右闭区间

                         "min": 5,

                         "max": 8

                     },

                     "devCustomSkin": {//自定义设备皮肤 可不填写

                         "topImg": "img地址",

                         "bottomImg": "img地址",

                         "foreImg": "img地址",

                         "behindImg": "img地址",

                         "leftImg": "img地址",

                         "rightImg": "img地址",

                     },

                 }

             ]

         },

         //.............此处表示更多

         ]

*/

WTServerAPI.prototype.CabinetBoxHandlerCacheData = {};

WTServerAPI.prototype.CabinetBoxHandler = function (room, cabinetNub, sucFunc, failFunc, beCache) {

    var _this = this;

    if (beCache) {

        var cachedata = _this.CabinetBoxHandlerCacheData["c_" + room + "_" + cabinetNub];

        if (cachedata) {

            sucFunc(cachedata);

            return;

        }

    }

    var url = _this.ServerUrl + "/CBHandler.ashx?action=cabInfo&roomID=" + wtserverAPI.roomId(room)

    if (cabinetNub) {

        url += "&cabinetNub=" + cabinetNub;

    }

    httpGetSyn(url,//这里要同步获取信息 不能用异步

        function (rs) {

            if (sucFunc) {

                if (cabinetNub == -1) {

                    _this.CabinetBoxHandlerCacheData["c_" + room + "_-1"] = rs.result;

                }

                if (rs && rs.result && rs.result.length && rs.result.length > 0) {

                    $.each(rs.result, function (_index, _obj) {

                        if (_obj) {

                            _this.CabinetBoxHandlerCacheData["c_" + room + "_" + _obj.cabName] = _obj;

                        }

                    });

                }

                sucFunc(_this.CabinetBoxHandlerCacheData);

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

WTServerAPI.prototype.getCabinetByUUID = function (roomName, uuid) {

    var _this = this;

    var _cab = null;

    var allCabs = _this.CabinetBoxHandlerCacheData["c_" + roomName + "_-1"];

    $.each(allCabs, function (_index, _obj) {

        if (_obj.cabinetNub == uuid) {

            _cab = _obj;

        }

    });

    return _cab;

}

/**

 *获取端口信息

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “ports”                                  // 执行的方法

devGuid: “”                                          // 设备ID devGuid代表设备guid

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

"result":[

        {Name:’端口名称’,

     Value:’端口状态’    }，

         ………

]

    }

 *根据服务器id获取端口信息

http://116.249.124.141:8081/3droom/api/ashx/CBHandler.ashx?action=ports&hostid=xxxx

 */

WTServerAPI.prototype.PortCacheData = {};

WTServerAPI.prototype.PortHandler = function (serverId, beCache, sucFunc, failFunc) {

    var _this = this;

    if (beCache) {

        var cachedata = _this.PortCacheData["s_" + serverId];

        if (cachedata) {

            sucFunc(cachedata);

            return;

        }

    }

    var url = _this.ServerUrl + "/CBHandler.ashx?action=ports&devGuid=" + serverId;

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.result && rs.result.length > 0) {

                    _this.PortCacheData["s_" + serverId] = rs.result;

                    sucFunc(_this.PortCacheData["s_" + serverId]);

                } else if (rs && rs.error && rs.error.errorInfo) {

                    if (failFunc) {

                        failFunc(rs.error.errorInfo);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

//机柜利用率

/*

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “CabRate”                                      // 执行的方法

 roomID : “c12d7373-a6db-4a3f-96a0-f1a851a8825d”         // 机房ID,

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

"result":[

{

 "cabid":"此处为机柜id",

 "useRate":"0.8",//利用率

  “strUseRate”: 23/42 // 利用率比例

},

{

 "cabid":"此处为机柜id",

 "useRate":"0.4",//利用率

“strUseRate”: 23/42 // 利用率比例

}

......//此处表示更多

]

}

*/

WTServerAPI.prototype.CabRate = function (roomID, sucFunc, failFunc) {

    var _this = this;

    var url = _this.ServerUrl + "/CBHandler.ashx?action=CabRate&roomID=" + _this.roomId(roomID);

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.resultCode && rs.resultCode == "success" && rs.result && rs.result.length && rs.result.length > 0) {

                    sucFunc(rs.result);

                } else {

                    if (failFunc) {

                        failFunc(rs.error);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

//空闲空间

/*

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “FreeSpace”                                      // 执行的方法

roomID : “c12d7373-a6db-4a3f-96a0-f1a851a8825d”         // 机房ID,

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

"result":[

{

 "cabid":"此处为机柜id",

 "uPositionUsed":[1,2,3,4,5],//表示u位被占用

},

{

 "cabid":"此处为机柜id",

"uPositionUsed":[12,13,14,15],//表示u位被占用

}

......//此处表示更多

]

    }

*/

WTServerAPI.prototype.FreeSpaceCacheData = null;

WTServerAPI.prototype.FreeSpace = function (roomID, sucFunc, failFunc, fromCache) {

    var _this = this;

    if (fromCache) {

        return _this.FreeSpaceCacheData;

    }

    var url = _this.ServerUrl + "/CBHandler.ashx?action=FreeSpace&roomID=" + _this.roomId(roomID);

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.resultCode && rs.resultCode == "success" && rs.result && rs.result.length && rs.result.length > 0) {

                    _this.FreeSpaceCacheData = rs.result;

                    sucFunc(rs.result);

                } else {

                    if (failFunc) {

                        failFunc(rs.error);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

//温度云图

/*

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “Tnephogram”                                      // 执行的方法

roomID : “c12d7373-a6db-4a3f-96a0-f1a851a8825d”               // 机房ID

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

"result":[

{

 "thDevGuid":"此处为温湿度设备id",

 "position":{"x":"1","y":"50"},//位置

 "tValue":"25.6",//温度

},

{

 "thDevGuid":"此处为温湿度设备id",

  "position":{"x":"10","y":"100"},//位置

 "tValue":"80",//温度

}

]

    }

*/

WTServerAPI.prototype.TnephogramCacheData = null;

WTServerAPI.prototype.Tnephogram = function (roomID, sucFunc, failFunc) {

    var _this = this;

    var url = _this.ServerUrl + "/CBHandler.ashx?action=Tnephogram&roomID=" + _this.roomId(roomID);

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.resultCode && rs.resultCode == "success" && rs.result && rs.result.length && rs.result.length > 0) {

                    _this.TnephogramCacheData = rs.result;

                    sucFunc(rs.result);

                } else {

                    if (failFunc) {

                        failFunc(rs.error);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

//湿度接口

/*

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “Humidity”                                      // 执行的方法

roomID : “c12d7373-a6db-4a3f-96a0-f1a851a8825d”               // 机房ID

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

"result":[

{

 "thDevGuid":"此处为温湿度设备id",

"position":{"x":"100","y":"100"},//位置

 "hValue":"80",//湿度

},

{

 "thDevGuid":"此处为温湿度设备id",

"position":{"x":"300","y":"500"},//位置

 "hValue":"80",//湿度

}

]

    }

*/

WTServerAPI.prototype.Humidity = function (roomID, sucFunc, failFunc) {

    var _this = this;

    var url = _this.ServerUrl + "/CBHandler.ashx?action=Humidity&roomID=" + _this.roomId(roomID);

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.resultCode && rs.resultCode == "success" && rs.result && rs.result.length && rs.result.length > 0) {

                    sucFunc(rs.result);

                } else {

                    if (failFunc) {

                        failFunc(rs.error);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

//设备详细接口

/*

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “deviceInfo”                                  // 执行的方法

devGuid: “”                                          // 设备ID devGuid代表设备guid

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

    "result":{//设备详情

             }

    }

*/

WTServerAPI.prototype.DeviceInfo = function (devGuid, sucFunc, failFunc) {

    var _this = this;

    var url = _this.ServerUrl + "/CBHandler.ashx?action=deviceInfo&devGuid=" + devGuid;

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.resultCode && rs.resultCode == "success" && rs.result) {

                    sucFunc(rs);

                } else {

                    if (failFunc) {

                        failFunc(rs.error);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

/*

获取机柜详细信息

接口方式:get

返回格式: json

Url:服务端自定

参数:

action:  “ecInfo”                                  // 执行的方法

devGuid: “”                                          // 机柜ID

返回格式（参考）

{

        "resultCode": "success",

        "error": {

            "errorCode": 0,

            "errorInfo": "此处显示错误信息"

        },

"result":[

        { AreaBelong:’所在区域’,

       ECName:’机柜名称’    }，

PhysicalLocation:’位置’    }，

UNumber:’U位数’    }，

UseRate:’机柜使用率’    }，

StrUseRate:’机柜使用率字符串标识’    }，

TDP:’机柜中所有设备功耗之和’    }

]

    }

*/

WTServerAPI.prototype.getCabinetInfo = function (devGuid, sucFunc, failFunc) {

    var _this = this;

    var url = _this.ServerUrl + "/CBHandler.ashx?action=ecInfo&devGuid=" + devGuid;

    httpGet(url,

        function (rs) {

            if (sucFunc) {

                if (rs && rs.resultCode && rs.resultCode == "success" && rs.result) {

                    sucFunc(rs);

                } else {

                    if (failFunc) {

                        failFunc(rs.error);

                    }

                }

            }

        },

        function (err) {

            if (failFunc) {

                failFunc(err);

            }

        });

}

var wtserverAPI = null;

　　三、逻辑控制代码

　　　　

var WT3DModel;

function threeStart(_height,roomName,dataFunc) { // dataFunc 获取机柜，空调，墙等设备的json对象

    WT3DModel = new WT3D();   // 实例化 3D 核心对象，见 WT3D.core.js 文件。

    var initOption = {

        antialias: true, // 启用平滑、抗锯齿效果

        loadSyn: true, // 是否启用异步加载

        showHelpGrid: false, // 是否显示网格线

        clearCoolr: 0x4068b0,  // 背景色

        clearColorOp: 0,    // 透明度

    };

    var Aobjects = {  // 给3D对象绑定事件

        objects: dataFunc(roomName),

        Animation: [

            {

                obj_name: "",

                obj_animation: function (_obj) {

                },

                animationType: 0, // 动画类型 -1永久循环执行 0触发执行 >=1执行多少次

                aniInterval: 1000, // 执行时间间隔 毫秒

            }],

        events: {

            dbclick: [

                {

                    obj_name: "ALL",

                    obj_event: function (_obj, face) { // 被选中的对象 被选中的面

                        // 此处设置双击聚焦

                        {

                            console.log(_obj);

                            console.log(face);

                            if (_obj.objType == "optimizeModel") {

                                console.log("optimizeModel");

                                console.log(_obj);

                                _obj = WT3DModel.commonFunc.getOldModelByNewModelAndFace(_obj, face);

                            }

                            modelBussiness.dbClickSelectCabinet(_obj, face);

                            var mainCamera = WT3DModel.camera;//主场景

                            //mainCamera.lookAt({

                            //    x:  _obj.position.x, y:  _obj.position.y, z: _obj.position.z

                            //});

                            var objpositionx = _obj.position.x;

                            var objpositiony = _obj.position.y;

                            var objpositionz = _obj.position.z;

                            if (typeof (_obj.parent) != 'undefined' && _obj.parent != null && typeof (_obj.parent.position) != 'undefined' && _obj.parent.position != null) {

                                objpositionx += _obj.parent.position.x;

                                objpositiony += _obj.parent.position.y;

                                objpositionz += _obj.parent.position.z;

                            }

                            if (typeof (_obj.oldPosition) != 'undefined' && _obj.oldPosition != null) {

                                objpositionx = _obj.oldPosition.x;

                                objpositiony = _obj.oldPosition.y;

                                objpositionz = _obj.oldPosition.z;

                            }

                            new TWEEN.Tween(WT3DModel.controls.target).to({   // WT3DModel.controls.target: 要改变的对象

                                x: objpositionx, y: objpositiony, z: objpositionz  // to({键值对：动画结束时移动到的文职,完成动画需要的时间})

                            }, 600).onComplete(function () {

                                var x_distance = mainCamera.position.x - objpositionx;

                                var y_distance = mainCamera.position.y - objpositiony;

                                var z_distance = mainCamera.position.z - objpositionz;

                                var lv = 1000 / Math.sqrt(x_distance * x_distance + y_distance * y_distance + z_distance * z_distance);

                                var runtweenTime = 1000;

                                if (lv > 0.6) {

                                    runtweenTime = 400;

                                } else if (lv > 0.3) {

                                    runtweenTime = 1000;

                                } else if (lv > 0.1) {

                                    runtweenTime = 1200;

                                } else if (lv > 0.05) {

                                    runtweenTime = 1600;

                                } else if (lv > 0.01) {

                                    runtweenTime = 2000;

                                } else {

                                    runtweenTime = 2500;

                                }

                                if (x_distance * x_distance + y_distance * y_distance + z_distance * z_distance > 800 * 800 && lv < 0.9999) {

                                    new TWEEN.Tween(mainCamera.position).to({

                                        x: objpositionx + (mainCamera.position.x - objpositionx) * lv, y: objpositiony, z: objpositionz + (mainCamera.position.z - objpositionz) * lv

                                    }, runtweenTime).start();

                                }

                            }).start();

                        }

                    }

                },

            ],

            mouseDown: [{

                obj_name: "ALL",

                obj_event: function (_obj, face) {

                    console.log("mouseDown");

                    console.log(_obj);

                    console.log(face);

                    if (_obj.objType == "optimizeModel") {

                        console.log("optimizeModel");

                        console.log(_obj);

                        _obj = WT3DModel.commonFunc.getOldModelByNewModelAndFace(_obj, face); // UNDO

                    }

                    modelBussiness.clickSelectCabinet(_obj, face);

                }

            },

            ],

            mouseUp: {

            },

            mouseMove: [{

                obj_name: "doorLeft",

                obj_event: function (_obj) {

                    console.log(_obj.name);

                    return true;//返回true表示移动

                }

            },

            ]

        },

        //WT3DModel.viewState;表示0编辑状态 1表示运行状态

        btns: [

            {

                btnid: "btn_reset",

                btnTitle: "场景复位",

                btnimg: "../../img/3dImg/reset.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_space");

                        return;

                    }

                    modelBussiness.currentLockDetail = "场景复位";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 1000);

                    modelBussiness.backBtn();

                },

            },

            {

                btnid: "btn_fps",

                btnTitle: "3D性能监测",

                btnimg: "../../img/3dImg/fps.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    var display = $("#Stats_output").css("display");

                    if (display == "none") {

                        $("#Stats_output").show();

                    } else {

                        $("#Stats_output").hide();

                    }

                },

            },

            {

                btnid: "btn_space",

                btnTitle: "机柜利用率",

                btnimg: "../../img/3dImg/space.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_space");

                        return;

                    }

                    modelBussiness.currentLockDetail = "机柜利用率";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 2000);

                    modelBussiness.showSpaceRate();

                },

            },

            {

                btnid: "btn_usage",

                btnTitle: "可用空间",

                btnimg: "../../img/3dImg/usage.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_usage");

                        return;

                    }

                    modelBussiness.currentLockDetail = "可用空间";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 2000);

                    modelBussiness.showUsageMap();

                },

            },

            {

                btnid: "btn_lines",

                btnTitle: "走线管理",

                btnimg: "../../img/3dImg/connection.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_lines");

                        return;

                    }

                    modelBussiness.currentLockDetail = "走线管理";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 1000);

                    modelBussiness.showLines();

                },

            },

            {

                btnid: "btn_temperature",

                btnTitle: "温度云图",

                btnimg: "../../img/3dImg/temperature.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_temperature");

                        return;

                    }

                    modelBussiness.currentLockDetail = "温度云图";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 2000);

                    modelBussiness.showTemptureMap();

                },

            },

            {

                btnid: "btn_water",

                btnTitle: "湿度",

                btnimg: "../../img/3dImg/water.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_water");

                        return;

                    }

                    modelBussiness.currentLockDetail = "湿度效果";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 2000);

                    modelBussiness.showHumidity();

                },

            },

            {

                btnid: "btn_smokeAlarm",

                btnTitle: "烟雾模拟",

                btnimg: "../../img/3dImg/smoke.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_smokeAlarm");

                        return;

                    }

                    modelBussiness.currentLockDetail = "烟雾模拟";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 2000);

                    modelBussiness.showFireAlarm();

                },

            },

            {

                btnid: "btn_winds",

                btnTitle: "空调风向",

                btnimg: "../../img/3dImg/air.png",

                sortnub: 0,

                btnType: "system",

                enable: true,

                show_event: function () {

                    if (modelBussiness.lock == true) {

                        layer.tips("当前正在运行" + modelBussiness.currentLockDetail, "#btn_winds");

                        return;

                    }

                    modelBussiness.currentLockDetail = "空调风向";

                    modelBussiness.lock = true;

                    setTimeout(function () {

                        modelBussiness.lock = false;

                    }, 1000);

                    modelBussiness.showWinds();

                },

            },

            //{

            //    btnid: "btn_power",

            //    btnTitle: "配店组",

            //    btnimg: "../../img/3dImg/power.png",

            //    sortnub: 0,

            //    btnType: "system",

            //    enable: true,

            //    show_event: function () {

            //        modelBussiness.showWinds();

            //    },

            //},

            //{

            //    btnid: "btn_alarm",

            //    btnTitle: "告警",

            //    btnimg: "../../img/3dImg/alarm.png",

            //    sortnub: 0,

            //    btnType: "system",

            //    enable: true,

            //    show_event: function () {

            //        modelBussiness.showWinds();

            //    },

            //},

            //{

            //    btnid: "btn_person",

            //    btnTitle: "巡检",

            //    btnimg: "../../img/3dImg/person.png",

            //    sortnub: 0,

            //    btnType: "system",

            //    enable: true,

            //    show_event: function () {

            //        modelBussiness.showWinds();

            //    },

            //},

        ]

    }

    if (parent != null && parent.Aobjects_objects != null) {

        Aobjects.objects = parent.Aobjects_objects;

    }

    //修改btns

    //优化Aobjects 此处用于优化 可以先异步加载图片

    /*

   [

   {

   imgurl: "../../img/3dImg/floor.jpg",

   width: 128,

   height: 128,

   },

   {

   imgurl:"../../img/3dImg/floor.jpg",

   },

   ]

   */

    Aobjects.imageList = [];

    imageUUIDList = [];

    //遍历获取图片资源

    function getImageList(obj) {

        if (obj && typeof (obj) == "object") {

            $.each(obj, function (_index, _obj) {

                if (_obj && _obj.imgurl) {

                    var imgObj = {};

                    imgObj.uuid = _obj.imgurl;

                    imgObj.imgurl = _obj.imgurl;

                    if ($.inArray(imgObj.uuid, imageUUIDList) < 0) {

                        imageUUIDList.push(imgObj.uuid);

                        Aobjects.imageList.push(imgObj);

                    }

                }

                getImageList(_obj);

            });

        }

    }

    getImageList(Aobjects.objects);

    if (_height != null && typeof (_height) != 'undefined' && _height == 0) {

        $("#canvas-frame").height($(document).height());

    }

    //检查是否存在动态资源需要加载

    var dynamicSource = [];

    $.each(Aobjects.objects, function (_index, _obj) {

        /*

        动态资源结构

        {

               name: '',

               objType: 'dynamicSource',

               file:"";

               loadedCallBackFuncName:""

           }

        */

        if (_obj && _obj.objType && _obj.objType == "dynamicSource") {

            dynamicSource.push(_obj);

        }

    });

    if (dynamicSource.length > 0) {

        WT3DModel.additionModels = {};

        var loadednub = 0;

        $.each(dynamicSource, function (_index, _obj) {

            $.getScript(_obj.file).done(function () {

                /* 耶，没有问题，这里可以干点什么 */

                loadednub++;

                if (loadednub == dynamicSource.length) {

                    $.each(dynamicSource, function (_dindex, _dobj) {

                        if (_dobj.loadedCallBackFuncName && _dobj.loadedCallBackFuncName != "") {

                            eval(_dobj.loadedCallBackFuncName + "()");

                        }

                    });

                }

            })

                .fail(function () {

                    /* 靠，马上执行挽救操作 */

                    console.log("文件加载失败");

                });

        });

    }

    WT3DModel.initWT3D('canvas-frame', initOption, Aobjects);

    WT3DModel.start();

}

//actionSign doorLeft doorRight cabinet1 cabinet2

function opcabinetdoor(_obj, _cmd, _func) {

    var doorstate = "close";

    var tempobj = null;

    if (typeof (_obj.doorState) != 'undefined' && _obj.doorState != null) {

        doorstate = _obj.doorState;

        tempobj = _obj.parent;

    } else {

        _obj.oldPosition = {

            x: _obj.parent.position.x, y: _obj.parent.position.y, z: _obj.parent.position.z

        }

        _obj.doorstate = "close";

        var _objparent = _obj.parent;

        tempobj = new THREE.Object3D();

        tempobj.position.set(_obj.position.x, _obj.position.y, _obj.position.z - _obj.geometry.parameters.depth / 2);

        _obj.position.set(0, 0, _obj.geometry.parameters.depth / 2);

        _obj.matrixAutoUpdate = true;

        tempobj.add(_obj);

        _objparent.add(tempobj);

    }

    if (typeof (_cmd) == 'undefined' || _cmd == null || _cmd == "") {

        _obj.doorState = (doorstate == "close" ? "open" : "close");

    } else {

        if (_cmd == _obj.doorState) {

            if (_func != null) {

                _func();

            }

            return;

        } else {

            _obj.doorState = _cmd;

        }

    }

    new TWEEN.Tween(tempobj.rotation).to({

        y: (_obj.doorState == "open" ? 0.5 * Math.PI : 0)

    }, 1000).onComplete(function () {

        if (_func != null) {

            _func();

        }

    }).start();

}

function openRightDoor(_obj, func, _cmd) {

    var doorstate = "close";

    var tempobj = null;

    if (_obj.doorState != null && typeof (_obj.doorState) != 'undefined') {

        doorstate = _obj.doorState;

        tempobj = _obj.parent;

    } else {

        _obj.oldPosition = { x: _obj.position.x, y: _obj.position.y, z: _obj.position.z }

        _obj.doorState = "close";

        var _objparent = _obj.parent;

        tempobj = new THREE.Object3D();

        tempobj.position.set(_obj.position.x - _obj.geometry.parameters.width / 2, _obj.position.y, _obj.position.z);

        _obj.position.set(_obj.geometry.parameters.width / 2, 0, 0);

        tempobj.add(_obj);

        _objparent.add(tempobj);

    }

    if (typeof (_cmd) == 'undefined' || _cmd == null || _cmd == "") {

        _obj.doorState = (doorstate == "close" ? "open" : "close");

    } else {

        if (_cmd == _obj.doorState) {

            if (func != null) {

                func();

            }

            return;

        } else {

            _obj.doorState = _cmd;

        }

    }

    new TWEEN.Tween(tempobj.rotation).to({

        y: (_obj.doorState == "open" ? 0.25 * 2 * Math.PI : 0 * 2 * Math.PI)

    }, 3000).easing(TWEEN.Easing.Elastic.Out).onComplete(

        function () {

            if (func != null) {

                func();

            }

        }

    ).start();

}

function openLeftDoor(_obj, func, _cmd) {

    var doorstate = "close";

    var tempobj = null;

    if (_obj.doorState != null && typeof (_obj.doorState) != 'undefined') {

        doorstate = _obj.doorState;

        tempobj = _obj.parent;

    } else {

        _obj.oldPosition = { x: _obj.position.x, y: _obj.position.y, z: _obj.position.z }

        _obj.doorState = "close";

        var _objparent = _obj.parent;

        tempobj = new THREE.Object3D();

        tempobj.position.set(_obj.position.x + _obj.geometry.parameters.width / 2, _obj.position.y, _obj.position.z);

        _obj.position.set(-_obj.geometry.parameters.width / 2, 0, 0);

        tempobj.add(_obj);

        _objparent.add(tempobj);

    }

    if (typeof (_cmd) == 'undefined' || _cmd == null || _cmd == "") {

        _obj.doorState = (doorstate == "close" ? "open" : "close");

    } else {

        if (_cmd == _obj.doorState) {

            if (func != null) {

                func();

            }

            return;

        } else {

            _obj.doorState = _cmd;

        }

    }

    new TWEEN.Tween(tempobj.rotation).to({

        y: (_obj.doorState == "open" ? -0.25 * 2 * Math.PI : 0 * 2 * Math.PI)

    }, 3000).easing(TWEEN.Easing.Elastic.Out).onComplete(function () {

        if (func != null) {

            func();

        }

    }).start();

}

function get3DConfiguration(stationId, sucfunc, failfunc, _userid) { // 没用到？

    businessService.getUser3DConfiguration(stationId, sucfunc, failfunc, _userid);

}

下节预告：

　　下节课主要讲解微模块的实现与功能

技术交流 1203193731@qq.com

交流微信：

　　　　

如果你有什么要交流的心得 可邮件我

其它相关文章：

使用webgl(three.js)创建3D机房，3D机房微模块详细介绍(升级版二)

如何用webgl(three.js)搭建一个3D库房-第一课

如何用webgl(three.js)搭建一个3D库房,3D密集架,3D档案室,-第二课

使用webgl(three.js)搭建一个3D建筑，3D消防模拟——第三课

使用webgl(three.js)搭建一个3D智慧园区、3D建筑，3D消防模拟，web版3D,bim管理系统——第四课

如何用webgl(three.js)搭建不规则建筑模型，客流量热力图模拟

使用webgl(three.js)创建3D机房(升级版)-普通机房的更多相关文章

  1. 使用webgl(three.js)创建3D机房，3D机房微模块详细介绍(升级版二)

    序: 上节课已经详细描述了普通机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10473021.html) 紧接着上节课的内容 我们这节可来详细讲解机房 ...

  2. 使用three.js创建3D机房模型-分享一

    序:前段时间公司一次研讨会上,一市场部同事展现了同行业其他公司的3D机房,我司领导觉得这个可以研究研究,为了节约成本,我们在网上大量检索,最后找到一位前辈的博文[TWaver的技术博客],在那篇博文的 ...

  3. 使用webgl(three.js)搭建3D智慧园区、3D大屏，3D楼宇，智慧灯杆三维展示，3D灯杆，web版3D,bim管理系统——第六课

    前言: 今年是建国70周年,爱国热情异常的高涨,为自己身在如此安全.蓬勃发展的国家深感自豪. 我们公司楼下为庆祝国庆,拉了这样的标语,每个人做好一件事,就组成了我们强大的祖国. 看到这句话,深有感触, ...

  4. 如何使用webgl(three.js)实现3D储能,3D储能站,3D智慧储能、储能柜的三维可视化解决方案——第十七课

    前言 上节课我们讲了<3D光伏发电>,与之配套的就是能量存储 这节课我们主要讲讲储能,储能站,在分布式能源系统中起到调节用对电的尖峰平谷进行削峰填谷的作用.特别是小型储能站,更加灵活,因地 ...

  5. 使用webgl(three.js)创建科技版3D机房，3D机房微模块详细介绍(升级版三)—— 1

    上节课已经详细描述了微模块机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10484241.html) 紧接着上节课的内容 我们这节可来详细讲解科技版机 ...

  6. 如何用webgl(three.js)搭建处理3D园区、3D楼层、3D机房管线问题（机房升级版）-第九课（一）

    写在前面的话: 说点啥好呢?就讲讲前两天的小故事吧,让我确实好好反省了一下. 前两天跟朋友一次技术对话,对方问了一下Geometry与BufferGeometry的具体不同,我一下子脑袋短路,没点到重 ...

  7. 如何用webgl(three.js)搭建一个3D库房,3D密集架,3D档案室（升级版）

    很长一段时间没有写3D库房,3D密集架相关的效果文章了,刚好最近有相关项目落地,索性总结一下 与之前我写的3D库房密集架文章<如何用webgl(three.js)搭建一个3D库房,3D密集架,3 ...

  8. 如何用three.js搭建处理3D园区、3D楼层、3D机房管线（机房升级版）-第九课（二）

    接着上一篇文章,<如何用webgl(three.js)搭建处理3D园区.3D楼层.3D机房管线问题(机房升级版)-第九课(一)> 继续讲解关于三维数据中心管线可视化的解决方案. 上一篇我们 ...

  9. webgl(three.js)实现室内三维定位,3D定位,3D楼宇bim、实时定位三维可视化解决方案——第十四课（定位升级版）

    序: 还是要抽出时间看书的,迷上了豆豆的作品,最近在看<天幕红尘>,书中主人公的人生价值观以及修为都是让我惊为叹止.很想成为那样的人,但是再看看自己每天干的事,与时间的支配情况,真是十分的 ...

随机推荐

  1. 【windows】dos命令查看某个文件夹下所有文件目录列表

    dos命令  dir展示一个目录中的文件夹和文件列表  /a代表显示隐藏目录

  2. c++调用c#写的DLL

    c++调用c#写的DLL: 此文章演示了建立c#的dll: c++建立工程,引入dll: 不能解决的问题: 指定dll的路径,在代码里面直接写 #using "xxx.dll" 必 ...

  3. 如何安全地运行用户的 JavaScript 脚本

    本文来自网易云社区,转载务必请注明出处. 有时候我们需要运行用户输入的 JavaScript 脚本(以下简称脚本).对于我们来说,这些脚本是不可信任的,如果在当前的 Context 中运行这些脚本,它 ...

  4. Struts2学习第4天--拦截器

    第1章     Struts2_day04笔记 1.1      上次课内容回顾 l  OGNL表达式 n  OGNL的概述 u  OGNL:对象图导航语言,是一门功能强大的表达式语言. n  OGN ...

  5. D. Magic Box（几何）

    One day Vasya was going home when he saw a box lying on the road. The box can be represented as a re ...

  6. 【ocp 052又加新题了】052新加的考试题及答案整理-第13题

    13.Which two are true about AWR snapshots? A) They are stored In the SYSAUX tablespace. B) They are ...

  7. 15、xtrabackup 全量备份

    xtrabackup 全量备份与恢复 安装 yum install https://www.percona.com/downloads/XtraBackup/Percona-XtraBackup-2. ...

  8. 洛谷P5245 【模板】多项式快速幂

    题面 传送门 题解 话说现在还用数组写多项式的似乎没几个了-- \[B(x)=A^k(x)\] \[\ln B(x)=k\ln A(x)\] 求个\(\ln\),乘个\(k\),\(\exp\)回去就 ...

  9. 模块sys, os, glob, pickle, subprocess常见用法

    参考python常用标准库 http://blog.51cto.com/lizhenliang/1872538 一. sys   1. sys.argv 脚本名1.py, 命令行中执行python 1 ...

  10. php 扩展 debug问题

    php安装时为debug模式 ./configure  --prefix=/usr/local/php7.1.6-debug --with-curl --with-pcre-regex --enabl ...