<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<title>Babylon - Getting Started</title>
<!-- link to the last version of babylon -->
<script src="~/Content/scripts/babylon/babylon.js"></script>
<script src="~/Content/scripts/babylon/babylon.gui.min.js"></script>
<script src="~/Content/scripts/jquery/jquery-2.0.3.min.js"></script>
<style>
html, body {
overflow: hidden;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#renderCanvas {
width: 100%;
height: 100%;
touch-action: none;
}
</style>
</head>
<body>
<canvas id="renderCanvas"></canvas>
<script type="text/javascript">
var Dictionary = function () {
this.elements = new Array();
//Length of Dictionary
this.length = function () {
return this.elements.length;
};
//Check whether the Dictionary is empty
this.isEmpty = function () {
return (this.length() < 1);
};
//remove all elements from the Dictionary
this.removeAll = function () {
this.elements = new Array();
};
//get specify element of the dictionary
this.element = function (index) {
var rlt = null;
if (index >= 0 && index < this.elements.length) {
rlt = this.elements[index];
}
return rlt;
}
//check whether the Dictionary contains this key
this.Exists = function (key) {
var rlt = false;
try {
for (var i = 0, iLen = this.length(); i < iLen; i++) {
if (this.elements[i].key == key) {
rlt = true;
break;
}
}
}
catch (ex) {
}
return rlt;
};
//check whether the Dictionary contains this value
this.containsValue = function (value) {
var rlt = false;
try {
for (var i = 0, iLen = this.length(); i < iLen; i++) {
if (this.elements[i].value == value) {
rlt = true;
break;
}
}
}
catch (ex) {
}
return rlt;
};
//remove this key from the Dictionary
this.remove = function (key) {
var rlt = false;
try {
for (var i = 0, iLen = this.length(); i < iLen; i++) {
if (this.elements[i].key == key) {
this.elements.splice(i, 1);
rlt = true;
break;
}
}
}
catch (ex) {
}
return rlt;
};
//add this key/value to the Dictionary,if key is exists,replace the value
this.add = function (key, value) {
this.remove(key);
this.elements.push({
key: key,
value: value
});
};
//add this key/value to the Dictionary,if key is exists,append value
this.set = function (key, value) {
var arr = this.getItem(key);
if (arr != null) {
if (typeof (arr) == "object") {
arr.unshift.apply(arr, value);
value = arr;
}
else {
var array = [];
array.push(arr);
array.unshift.apply(array, value);
value = array;
}
this.remove(key);
}
this.elements.push({
key: key,
value: value
});
}
//get value of the key
this.getItem = function (key) {
var rlt = null;
try {
for (var i = 0, iLen = this.length(); i < iLen; i++) {
if (this.elements[i].key == key) {
rlt = this.elements[i].value;
break;
}
}
}
catch (ex) {
}
return rlt;
};
//get all keys of the dictionary
this.keys = function () {
var arr = [];
for (var i = 0, iLen = this.length(); i < iLen; i++) {
arr.push(this.elements[i].key);
}
return arr;
}
//get all values of the dictionary
this.values = function () {
var arr = [];
for (var i = 0, iLen = this.length(); i < iLen; i++) {
arr.push(this.elements[i].value);
}
return arr;
}
}
//初始的元素参数队列
var dicS = new Dictionary();
//盒子对象队列
var dicW = new Dictionary();
</script>
<script type="text/javascript">
//四边墙
var wh01 = { posX: 0, posY: 6, posZ: 185, scaX: 84.9, scaY: 3, scaZ: 0.15, name: "z正墙-横边墙", size: 6 };
var wh02 = { posX: -255, posY: 6, posZ: 0, scaX: 0.15, scaY: 3, scaZ: 61.8, name: "x负墙-竖边墙", size: 6 };
var wh03 = { posX: -177.5, posY: 6, posZ: -185, scaX: 25.8, scaY: 3, scaZ: 0.15, name: "z负墙-横边墙1", size: 6 };
var wh031 = { posX: 93, posY: 6, posZ: -185, scaX: 54, scaY: 3, scaZ: 0.15, name: "z负墙-横边墙2", size: 6 };
var wh04 = { posX: 255, posY: 6, posZ: 0, scaX: 0.15, scaY: 3, scaZ: 61.8, name: "x正墙-竖边墙", size: 6 };
//横墙
var wh05 = { posX: -177.5, posY: 6, posZ: -141, scaX: 25.8, scaY: 3, scaZ: 0.15, name: "z负墙-办公室", size: 6 };
var wh06 = { posX: -177.5, posY: 6, posZ: -86, scaX: 25.8, scaY: 3, scaZ: 0.15, name: "z负墙-办公室", size: 6 };
var wh07 = { posX: -177.5, posY: 6, posZ: -18, scaX: 25.8, scaY: 3, scaZ: 0.15, name: "z负墙-慢走丝", size: 6 };
var wh08 = { posX: -120, posY: 6, posZ: 70, scaX: 6.8, scaY: 3, scaZ: 0.15, name: "z负墙-电火花", size: 6 };
var wh09 = { posX: -39.8, posY: 6, posZ: -102.5, scaX: 9.8, scaY: 3, scaZ: 0.15, name: "z负墙-电梯", size: 6 };
var wh10 = { posX: -39.8, posY: 6, posZ: -140, scaX: 9.8, scaY: 3, scaZ: 0.15, name: "z负墙-电梯", size: 6 };
var wh11 = { posX: 100, posY: 6, posZ: -102.5, scaX: 28, scaY: 3, scaZ: 0.15, name: "z负墙-仓库", size: 6 };
var wh12 = { posX: 230.5, posY: 6, posZ: -102.5, scaX: 8, scaY: 3, scaZ: 0.15, name: "z负墙-焊工组", size: 6 };
var wh13 = { posX: 93, posY: 6, posZ: 120, scaX: 54, scaY: 3, scaZ: 0.15, name: "z负墙-焊工组", size: 6 };
var wh14 = { posX: 53, posY: 0, posZ: -60.5, scaX: 41, scaY: 0.3, scaZ: 0.15, name: "z负墙-车床", size: 6 };
//竖墙
var wh15 = { posX: -100, posY: 6, posZ: 155, scaX: 0.15, scaY: 3, scaZ: 10, name: "x负墙-磨床组", size: 6 };
var wh16 = { posX: -100, posY: 6, posZ: 66, scaX: 0.15, scaY: 3, scaZ: 10, name: "x负墙-磨床组", size: 6 };
var wh17 = { posX: -100, posY: 6, posZ: -20, scaX: 0.15, scaY: 3, scaZ: 10, name: "x负墙-慢走丝", size: 6 };
var wh18 = { posX: -100, posY: 6, posZ: -96, scaX: 0.15, scaY: 3, scaZ: 4, name: "x负墙-办公室", size: 6 };
var wh19 = { posX: -140, posY: 6, posZ: 26, scaX: 0.15, scaY: 3, scaZ: 14.8, name: "x负墙-电火花", size: 6 };
var wh20 = { posX: -100, posY: 6, posZ: -140, scaX: 0.15, scaY: 3, scaZ: 5, name: "x负墙-办公室", size: 6 };
var wh21 = { posX: -100, posY: 6, posZ: -176.5, scaX: 0.15, scaY: 3, scaZ: 3, name: "x负墙-办公室", size: 6 };
var wh22 = { posX: -69, posY: 6, posZ: -110.2, scaX: 0.15, scaY: 3, scaZ: 2.7, name: "x负墙-电梯", size: 6 };
var wh221 = { posX: -69, posY: 6, posZ: -140, scaX: 0.15, scaY: 3, scaZ: 3, name: "x负墙-电梯1", size: 6 };
var wh222 = { posX: -69, posY: 6, posZ: -176.5, scaX: 0.15, scaY: 3, scaZ: 3, name: "x负墙-电梯2", size: 6 };
var wh23 = { posX: -10, posY: 6, posZ: -143.7, scaX: 0.15, scaY: 3, scaZ: 13.9, name: "x负墙-电梯", size: 6 };
var wh24 = { posX: 110, posY: 6, posZ: -143.7, scaX: 0.15, scaY: 3, scaZ: 13.9, name: "x正墙-仓库", size: 6 };
var wh25 = { posX: 207, posY: 6, posZ: 19, scaX: 0.15, scaY: 3, scaZ: 33.5, name: "x正墙-焊工组", size: 6 };
//慢走丝
var wh26 = { posX: -240, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "慢走丝", size: 22, status: 1 };
var wh27 = { posX: -200, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "慢走丝", size: 22, status: 1 };
var wh28 = { posX: -160, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "慢走丝", size: 22, status: 1 };
var wh29 = { posX: -120, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "慢走丝", size: 22, status: 1 };
//电火花
var wh30 = { posX: -120, posY: 5, posZ: -0, scaX: 1, scaY: 1, scaZ: 1, name: "电火花", size: 22, status: 1 };
var wh31 = { posX: -120, posY: 5, posZ: 50, scaX: 1, scaY: 1, scaZ: 1, name: "电火花", size: 22, status: 1 };
//卧加
var wh32 = { posX: -40, posY: 6, posZ: 100, scaX: 2, scaY: 0.8, scaZ: 1.5, name: "卧加18", size: 22, status: 1, disp: "s3c2" };
var wh33 = { posX: 26, posY: 6, posZ: 100, scaX: 2, scaY: 0.8, scaZ: 1.5, name: "卧加19", size: 22, status: 1, disp: "s3c3" };
var wh34 = { posX: 92, posY: 6, posZ: 100, scaX: 2, scaY: 0.8, scaZ: 1.5, name: "卧加20", size: 22, status: 1, disp: "s3c4" };
var wh35 = { posX: 158, posY: 6, posZ: 100, scaX: 2, scaY: 0.8, scaZ: 1.5, name: "卧加21", size: 22, status: 1, disp: "s3c5" };
//立加
var wh36 = { posX: -50, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加9", size: 22, status: 1, disp: "s7c5" };
var wh37 = { posX: -20, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加10", size: 22, status: 1, disp: "s7c6" };
var wh38 = { posX: 10, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加11", size: 22, status: 1, disp: "s7c7" };
var wh39 = { posX: 40, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加12", size: 22, status: 1, disp: "s7c8" };
var wh40 = { posX: 70, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加13", size: 22, status: 1, disp: "s7c9" };
var wh41 = { posX: 130, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加14", size: 22, status: 1, disp: "s7c11" };
var wh42 = { posX: 158, posY: 5, posZ: 0, scaX: 1, scaY: 1, scaZ: 1, name: "立加15", size: 22, status: 1, disp: "s7c12" };
var wh43 = { posX: -50, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加8", size: 22, status: 1, disp: "s8c1" };
var wh45 = { posX: -20, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加7", size: 22, status: 1, disp: "s8c2" };
var wh46 = { posX: 10, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加6", size: 22, status: 1, disp: "s8c3" };
var wh47 = { posX: 40, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加5", size: 22, status: 1, disp: "s8c4" };
var wh48 = { posX: 70, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加4", size: 22, status: 1, disp: "s8c5" };
var wh49 = { posX: 100, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加3", size: 22, status: 1, disp: "s8c6" };
var wh50 = { posX: 130, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加2", size: 22, status: 1, disp: "s8c7" };
var wh51 = { posX: 158, posY: 5, posZ: -40, scaX: 1, scaY: 1, scaZ: 1, name: "立加1", size: 22, status: 1, disp: "s8c8" };
var w241 = { posX: 130, posY: 5, posZ: 45, scaX: 1, scaY: 1, scaZ: 1, name: "立加17", size: 22, status: 1, disp: "s6c4" };
var w242 = { posX: 158, posY: 5, posZ: 45, scaX: 1, scaY: 1, scaZ: 1, name: "立加16", size: 22, status: 1, disp: "s6c5" };
//车床
var wh52 = { posX: -52, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh53 = { posX: 00, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh54 = { posX: 20, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh55 = { posX: 50, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh56 = { posX: 70, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh57 = { posX: 100, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh58 = { posX: 120, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh59 = { posX: 150, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
var wh60 = { posX: 170, posY: 5, posZ: -75, scaX: 1, scaY: 1, scaZ: 1, name: "车床", size: 18, status: 1 };
//快走丝
var wh61 = { posX: -55, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh62 = { posX: -30, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh63 = { posX: -5, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh64 = { posX: 20, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh65 = { posX: 45, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh66 = { posX: 70, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh67 = { posX: 95, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh68 = { posX: 120, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh69 = { posX: 145, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh70 = { posX: 170, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh71 = { posX: 195, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh72 = { posX: 220, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh73 = { posX: 245, posY: 5, posZ: 172, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh74 = { posX: -30, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh75 = { posX: -5, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh76 = { posX: 20, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh77 = { posX: 45, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh78 = { posX: 70, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 3 };
var wh79 = { posX: 95, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh80 = { posX: 120, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh81 = { posX: 145, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh82 = { posX: 170, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh83 = { posX: 195, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh84 = { posX: 220, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
var wh85 = { posX: 245, posY: 5, posZ: 132, scaX: 1, scaY: 1, scaZ: 1, name: "快走丝", size: 15, status: 1 };
//磨床组
var wh86 = { posX: -160, posY: 5, posZ: 0, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh87 = { posX: -199, posY: 5, posZ: 0, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh88 = { posX: -238, posY: 5, posZ: 0, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh89 = { posX: -160, posY: 5, posZ: 30, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh90 = { posX: -160, posY: 5, posZ: 60, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh91 = { posX: -238, posY: 5, posZ: 30, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh92 = { posX: -238, posY: 5, posZ: 60, scaX: 1.2, scaY: 1, scaZ: 0.6, name: "磨床组", size: 22, status: 1 };
var wh93 = { posX: -245, posY: 5, posZ: 160, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 1 };
var wh94 = { posX: -212.5, posY: 5, posZ: 160, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 1 };
var wh95 = { posX: -180, posY: 5, posZ: 160, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 1 };
var wh96 = { posX: -147.5, posY: 5, posZ: 160, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 2 };
var wh97 = { posX: -115, posY: 5, posZ: 160, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 1 };
var wh98 = { posX: -245, posY: 5, posZ: 124, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 1 };
var wh99 = { posX: -245, posY: 5, posZ: 88, scaX: 0.6, scaY: 1, scaZ: 1.2, name: "磨床组", size: 22, status: 1 };
//普车组
var wh100 = { posX: 126, posY: 5, posZ: -115, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh101 = { posX: 148, posY: 5, posZ: -115, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh102 = { posX: 170, posY: 5, posZ: -115, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh103 = { posX: 126, posY: 5, posZ: -144, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh104 = { posX: 126, posY: 5, posZ: -173, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh105 = { posX: 148, posY: 5, posZ: -173, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh106 = { posX: 170, posY: 5, posZ: -173, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var wh107 = { posX: 192, posY: 5, posZ: -173, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 3 };
var wh108 = { posX: 214, posY: 5, posZ: -173, scaX: 1, scaY: 1, scaZ: 1, name: "普车组", size: 18, status: 1 };
var initDic = function () {
//四边墙
dicS.add("wh01", wh01);
dicS.add("wh02", wh02);
dicS.add("wh03", wh03);
dicS.add("wh031", wh031);
dicS.add("wh04", wh04);
//竖墙
dicS.add("wh05", wh05);
dicS.add("wh06", wh06);
dicS.add("wh07", wh07);
dicS.add("wh08", wh08);
dicS.add("wh09", wh09);
dicS.add("wh10", wh10);
dicS.add("wh11", wh11);
dicS.add("wh12", wh12);
dicS.add("wh13", wh13);
dicS.add("wh14", wh14);
//横墙
dicS.add("wh15", wh15);
dicS.add("wh16", wh16);
dicS.add("wh17", wh17);
dicS.add("wh18", wh18);
dicS.add("wh19", wh19);
dicS.add("wh20", wh20);
dicS.add("wh21", wh21);
dicS.add("wh22", wh22);
dicS.add("wh221", wh221);
dicS.add("wh222", wh222);
dicS.add("wh23", wh23);
dicS.add("wh24", wh24);
dicS.add("wh25", wh25);
//慢走丝
dicS.add("wh26", wh26);
dicS.add("wh27", wh27);
dicS.add("wh28", wh28);
dicS.add("wh29", wh29);
//电火花
dicS.add("wh30", wh30);
dicS.add("wh31", wh31);
//卧加
dicS.add("wh32", wh32);
dicS.add("wh33", wh33);
dicS.add("wh34", wh34);
dicS.add("wh35", wh35);
//立加
dicS.add("wh36", wh36);
dicS.add("wh37", wh37);
dicS.add("wh38", wh38);
dicS.add("wh39", wh39);
dicS.add("wh40", wh40);
dicS.add("wh41", wh41);
dicS.add("wh42", wh42);
dicS.add("wh43", wh43);
dicS.add("wh45", wh45);
dicS.add("wh46", wh46);
dicS.add("wh47", wh47);
dicS.add("wh48", wh48);
dicS.add("wh49", wh49);
dicS.add("wh50", wh50);
dicS.add("wh51", wh51);
dicS.add("w241", w241);
dicS.add("w242", w242);
//车床
dicS.add("wh52", wh52);
dicS.add("wh53", wh53);
dicS.add("wh54", wh54);
dicS.add("wh55", wh55);
dicS.add("wh56", wh56);
dicS.add("wh57", wh57);
dicS.add("wh58", wh58);
dicS.add("wh59", wh59);
dicS.add("wh60", wh60);
//快走丝
dicS.add("wh61", wh61);
dicS.add("wh62", wh62);
dicS.add("wh63", wh63);
dicS.add("wh64", wh64);
dicS.add("wh65", wh65);
dicS.add("wh66", wh66);
dicS.add("wh67", wh67);
dicS.add("wh68", wh68);
dicS.add("wh69", wh69);
dicS.add("wh70", wh70);
dicS.add("wh71", wh71);
dicS.add("wh72", wh72);
dicS.add("wh73", wh73);
dicS.add("wh74", wh74);
dicS.add("wh75", wh75);
dicS.add("wh76", wh76);
dicS.add("wh77", wh77);
dicS.add("wh78", wh78);
dicS.add("wh79", wh79);
dicS.add("wh80", wh80);
dicS.add("wh81", wh81);
dicS.add("wh82", wh82);
dicS.add("wh83", wh83);
dicS.add("wh84", wh84);
dicS.add("wh85", wh85);
//磨床组
dicS.add("wh86", wh86);
dicS.add("wh87", wh87);
dicS.add("wh88", wh88);
dicS.add("wh89", wh89);
dicS.add("wh90", wh90);
dicS.add("wh91", wh91);
dicS.add("wh92", wh92);
dicS.add("wh93", wh93);
dicS.add("wh94", wh94);
dicS.add("wh95", wh95);
dicS.add("wh96", wh96);
dicS.add("wh97", wh97);
dicS.add("wh98", wh98);
dicS.add("wh99", wh99);
//普车组
dicS.add("wh100", wh100);
dicS.add("wh101", wh101);
dicS.add("wh102", wh102);
dicS.add("wh103", wh103);
dicS.add("wh104", wh104);
dicS.add("wh105", wh105);
dicS.add("wh106", wh106);
dicS.add("wh107", wh107);
dicS.add("wh108", wh108);
}
</script>
<script>
//获取画布对象
var canvas = document.getElementById('renderCanvas');
//加载巴比伦3D引擎
var engine = new BABYLON.Engine(canvas, true);
var planeBG = null;
var materialPlane = null;
var scene = null;//场景
var camera = null;//镜头
var light = null;//灯光
var currentFloor = 1;//当前楼层
var colorArray = new Array(null, null, null);
$(document).ready(function () {
engine.displayLoadingUI();
//赋予该场景于变量
scene = createScene();
//创建控制面板
createUiPanel();
//创建图例面板
createUiPanelLegend();
//在引擎中循环运行这个场景
engine.runRenderLoop(function () {
scene.render();
});
//事件
scene.beforeRender = function () {
};
//追加事件：帆布与大小调整程序
window.addEventListener('resize', function () {
engine.resize();
});
getstatus();
var int = self.setInterval("getstatus()", 5000);
engine.hideLoadingUI();
});
//创建原点
var createXYZ = function (scene) {
//原点
var sphere_0 = BABYLON.Mesh.CreateSphere("Sphere1", 1, 3, scene);
sphere_0.position.x = 0;
sphere_0.position.y = 0;
sphere_0.position.z = 0;
//x点
var sphere_x = BABYLON.Mesh.CreateSphere("Sphere1", 1, 3, scene);
sphere_x.position.x = 10;
sphere_x.position.y = 0;
sphere_x.position.z = 0;
var materialSphere2 = new BABYLON.StandardMaterial("texture2", scene);
materialSphere2.diffuseColor = new BABYLON.Color3(1, 0, 0); //Red
sphere_x.material = materialSphere2;
//z点
var sphere_z = BABYLON.Mesh.CreateSphere("Sphere1", 1, 3, scene);
sphere_z.position.x = 0;
sphere_z.position.y = 0;
sphere_z.position.z = 10;
var materialSphere3 = new BABYLON.StandardMaterial("texture2", scene);
materialSphere3.diffuseColor = new BABYLON.Color3(0, 2, 0); //green
sphere_z.material = materialSphere3;
}
//画地板文字
var drawBoardText = function (scene) {
//写字
var barLegend = BABYLON.Mesh.CreateGround("barLegend", 512, 370, 1, scene, false);
barLegend.position.x = 0;
barLegend.position.z = 0;
barLegend.position.y = 0.1;
barLegend.material = new BABYLON.StandardMaterial("", scene);
var barLegendTexture = new BABYLON.DynamicTexture("dynamic texture", 512, scene, true);
barLegendTexture.hasAlpha = true;
barLegend.material.diffuseTexture = barLegendTexture;
barLegend.material.emissiveColor = new BABYLON.Color3(0.4, 0.4, 0.4);
var size = barLegendTexture.getSize();
barLegendTexture.drawText("磨床组", 40, 120, "20px Arial", "white", "transparent");
barLegendTexture.drawText("慢走丝", 40, 360, "20px verdana", "white", "transparent");
barLegendTexture.drawText("办公室", 40, 425, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("办公室", 40, 492, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("快走丝", 300, 50, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("卧加", 250, 160, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("线边仓", 270, 210, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("立加", 336, 265, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("车床", 213, 365, "17px Segoe UI", "white", "transparent");
barLegendTexture.drawText("电梯", 195, 430, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("楼梯", 195, 490, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("原材料仓库", 250, 460, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("普车组、铣钻组", 396, 460, "17px Segoe UI", "white", "transparent");
barLegendTexture.drawText("焊", 480, 240, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("工", 480, 260, "20px Segoe UI", "white", "transparent");
barLegendTexture.drawText("组", 480, 280, "20px Segoe UI", "white", "transparent");
}
//图例面板
var createUiPanelLegend = function () {
// UI
var advancedTexture = BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
var UiPanel = new BABYLON.GUI.StackPanel();
//UiPanel.height = "220px";
UiPanel.fontSize = "14px";
UiPanel.horizontalAlignment = BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
UiPanel.verticalAlignment = BABYLON.GUI.Control.VERTICAL_ALIGNMENT_CENTER;
advancedTexture.addControl(UiPanel);
// ..
var button = BABYLON.GUI.Button.CreateSimpleButton("but1", "正常");
button.paddingTop = "1px";
button.paddingLeft = "5px";
button.width = "50px";
button.height = "30px";
button.color = "black";
button.background = "green";
UiPanel.addControl(button);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but2", "待机");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "50px";
button1.height = "30px";
button1.color = "black";
button1.background = "yellow";
UiPanel.addControl(button1);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but3", "停机");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "50px";
button1.height = "30px";
button1.color = "black";
button1.background = "red";
UiPanel.addControl(button1);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but4", "未连接");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "50px";
button1.height = "30px";
button1.color = "black";
button1.background = "gray";
UiPanel.addControl(button1);
}
//控制面板
var createUiPanel = function () {
// UI
var advancedTexture = BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");
var UiPanel = new BABYLON.GUI.StackPanel();
UiPanel.fontSize = "14px";
UiPanel.horizontalAlignment = BABYLON.GUI.Control.HORIZONTAL_ALIGNMENT_LEFT;
UiPanel.verticalAlignment = BABYLON.GUI.Control.VERTICAL_ALIGNMENT_TOP;
advancedTexture.addControl(UiPanel);
// ..
var button = BABYLON.GUI.Button.CreateSimpleButton("but1", "全图");
button.paddingTop = "5px";
button.paddingLeft = "5px";
button.width = "80px";
button.height = "40px";
button.color = "white";
button.background = "green";
button.onPointerDownObservable.add(() => {
if (currentFloor != 0) {
currentFloor = 0;
scene = createScene2();
createUiPanel();
}
});
UiPanel.addControl(button);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but2", "一楼");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "80px";
button1.height = "40px";
button1.color = "white";
button1.background = "green";
button1.onPointerDownObservable.add(() => {
if (currentFloor != 1) {
currentFloor = 1;
scene = createScene();
createUiPanel();
createUiPanelLegend();
}
});
UiPanel.addControl(button1);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but3", "二楼");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "80px";
button1.height = "40px";
button1.color = "white";
button1.background = "green";
UiPanel.addControl(button1);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but4", "三楼");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "80px";
button1.height = "40px";
button1.color = "white";
button1.background = "green";
UiPanel.addControl(button1);
// ..
var button1 = BABYLON.GUI.Button.CreateSimpleButton("but4", "四楼");
button1.paddingTop = "1px";
button1.paddingLeft = "5px";
button1.width = "80px";
button1.height = "40px";
button1.color = "white";
button1.background = "green";
UiPanel.addControl(button1);
}
//创建机器
var createWall = function (wall, scene) {
//墙体样式
var materialWall = new BABYLON.StandardMaterial("Wall", scene);
materialWall.alpha = 0.5;
var cWall = BABYLON.Mesh.CreateBox(wall.name, wall.size, scene);
cWall.position.x = wall.posX;
cWall.position.y = wall.posY;
cWall.position.z = wall.posZ;
cWall.scaling.x = wall.scaX;
cWall.scaling.y = wall.scaY;
cWall.scaling.z = wall.scaZ;
if (wall.status != undefined) {
if (wall.status == 1) {
cWall.material = colorArray[0];
} else if (wall.status == 2) {
cWall.material = colorArray[1];
} else if (wall.status == 3) {
cWall.material = colorArray[2];
} else {
cWall.material = colorArray[3];
}
} else {
cWall.material = materialWall;
}
if (wall.status != undefined) {
makeOverOut(cWall, scene);
//创建盒子文字
var barLegend = BABYLON.Mesh.CreateGround("barLegend", wall.scaX * wall.size, wall.scaZ * wall.size, 1, scene, false);
barLegend.position.x = cWall.position.x;
barLegend.position.y = (wall.size * wall.scaY) / 2.0 + wall.posY + 0.3;
barLegend.position.z = cWall.position.z;
barLegend.material = new BABYLON.StandardMaterial("", scene);
var barLegendTexture = new BABYLON.DynamicTexture("dynamic texture", 50, scene, true);
barLegendTexture.hasAlpha = true;
barLegend.material.diffuseTexture = barLegendTexture;
barLegend.material.emissiveColor = new BABYLON.Color3(0.4, 0.4, 0.4);
barLegendTexture.drawText(wall.name, 0, 40, "bold 19px Segoe UI", "white", "transparent");
}
if (wall.disp != undefined) {
dicW.add(wall.disp, cWall)
}
}
// Over/Out/OnPick
var makeOverOut = function (mesh, scene) {
// mesh.actionManager.registerAction(new BABYLON.SetValueAction(BABYLON.ActionManager.OnPointerOutTrigger, mesh.material, "emissiveColor", mesh.material.emissiveColor));
//mesh.actionManager.registerAction(new BABYLON.SetValueAction(BABYLON.ActionManager.OnPointerOverTrigger, mesh.material, "emissiveColor", BABYLON.Color3.White()));
mesh.actionManager = new BABYLON.ActionManager(scene);
var outVector = new BABYLON.Vector3(mesh.scaling.x, mesh.scaling.y, mesh.scaling.z);
var overVector = new BABYLON.Vector3(mesh.scaling.x * 1.1, mesh.scaling.y * 1.1, mesh.scaling.z * 1.1);
mesh.actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOutTrigger, mesh, "scaling", outVector, 150));
mesh.actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOverTrigger, mesh, "scaling", overVector, 150));
var positionVector3 = new BABYLON.Vector3(mesh.position.x, mesh.position.y, mesh.position.z)
mesh.actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPickTrigger, camera, "target", positionVector3, 150));
}
//获取设备状态
var getstatus = function () {
$.ajax({
url: "../../MachineManage/Machine/GetDataJson",
type: "get",
dataType: "json",
async: true,
success: function (jsons) {
jsons.forEach(
function (e) {
var arrkey = dicW.keys();
$.each(arrkey, function (i, key) {
if (key == e.DisplayPosition) {
var wall = dicW.getItem(key);
if (e.Status == 1) {
wall.material = colorArray[0];
} else if (e.Status == 2) {
wall.material = colorArray[1];
} else if (e.Status == 3) {
wall.material = colorArray[2];
} else {
wall.material = colorArray[3];
}
}
});
});
}
});
}
//创建一楼场景
var createScene = function () {
//场景
scene = new BABYLON.Scene(engine);
//scene.clearColor = new BABYLON.Color3(0.5, 0.5, 0.5);//灰色
scene.clearColor = new BABYLON.Color3(0.3, 0.6, 0.9);//浅蓝
//镜头
camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 0.6, Math.PI / 6, 550, BABYLON.Vector3.Zero(), scene);
camera.upperBetaLimit = 1.5;
camera.attachControl(canvas, true);
//灯光
light = new BABYLON.HemisphericLight("hemi", new BABYLON.Vector3(0.4, 0.3, -0.4), scene);
//底图-草地
planeBG = BABYLON.Mesh.CreatePlane("plane", 550, scene);
planeBG.position.y = -0.1;
planeBG.rotation.x = Math.PI / 2;
var materialBG = new BABYLON.StandardMaterial("texturePlane", scene);
materialBG.diffuseTexture = new BABYLON.Texture("../../Content/images/babylon/shuinidi.jpg", scene);
materialBG.diffuseTexture.uScale = 5.0;//Repeat 5 times on the Vertical Axes
materialBG.diffuseTexture.vScale = 5.0;//Repeat 5 times on the Horizontal Axes
materialBG.backFaceCulling = false;//Always show the front and the back of an element
planeBG.material = materialBG;
//工厂地面
var plane = BABYLON.Mesh.CreatePlane("plane", 512, scene);
plane.position.y = -0;
plane.rotation.x = Math.PI / 2;
plane.rotation.z = 0;
plane.scaling.x = 1;
plane.scaling.y = 0.724569;
materialPlane = new BABYLON.StandardMaterial("texturePlane", scene);
materialPlane.diffuseTexture = new BABYLON.Texture("../../Content/images/babylon/shuinidi.jpg", scene);
materialPlane.diffuseTexture.uScale = 5.0;//Repeat 5 times on the Vertical Axes
materialPlane.diffuseTexture.vScale = 5.0;//Repeat 5 times on the Horizontal Axes
materialPlane.backFaceCulling = false;//Always show the front and the back of an element
//materialPlane.diffuseColor = new BABYLON.Color3(0.2, 0.2, 0.3); //Red
plane.material = materialPlane;
//颜色变量
var materialColorGreen = new BABYLON.StandardMaterial("texture2", scene);
materialColorGreen.diffuseColor = new BABYLON.Color3(0, 0.85, 0); //green
colorArray[0] = materialColorGreen;
var materialColorYellow = new BABYLON.StandardMaterial("texture2", scene);
materialColorYellow.diffuseColor = new BABYLON.Color3(0.9, 0.9, 0); //yellow
colorArray[1] = materialColorYellow;
var materialColorRed = new BABYLON.StandardMaterial("texture2", scene);
materialColorRed.diffuseColor = new BABYLON.Color3(0.85, 0, 0); //red
colorArray[2] = materialColorRed;
var materialColorBrown = new BABYLON.StandardMaterial("texture2", scene);
materialColorBrown.diffuseColor = new BABYLON.Color3(0.4, 0.4, 0.4); //灰色
colorArray[3] = materialColorBrown;
//创建坐标参照物
createXYZ(scene);
//初始化物体数据
initDic();
//循环创建物体
var arrkey = dicS.keys();
$.each(arrkey, function (i, fe) {
var key = fe;
var wall = dicS.getItem(fe);
createWall(wall, scene);
});
//写地板问题
drawBoardText(scene);
//UI图例
createUiPanel();
return scene;
}
//创建二楼场景
var createScene2 = function () {
//场景
var scene = new BABYLON.Scene(engine);
//scene.clearColor = BABYLON.Color3.White();
scene.clearColor = new BABYLON.Color3(0.5, 0.5, 0.5)
// Skybox
var skybox = BABYLON.Mesh.CreateBox("skyBox", 100.0, scene);
var skyboxMaterial = new BABYLON.StandardMaterial("skyBox", scene);
skyboxMaterial.backFaceCulling = false;
skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture("/textures/TropicalSunnyDay", scene);
skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE;
skyboxMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
skyboxMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
skyboxMaterial.disableLighting = true;
skybox.material = skyboxMaterial;
//镜头
camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 0.6, Math.PI / 6, 750, BABYLON.Vector3.Zero(), scene);
camera.attachControl(canvas, true);
//灯光
var light = new BABYLON.HemisphericLight("hemi", new BABYLON.Vector3(0.4, 0.3, -0.4), scene);
//底图-草地
planeBG = BABYLON.Mesh.CreatePlane("plane", 550, scene);
planeBG.position.y = -0.1;
planeBG.rotation.x = Math.PI / 2;
var materialBG = new BABYLON.StandardMaterial("texturePlane", scene);
materialBG.diffuseTexture = new BABYLON.Texture("../../Content/images/bgpanle.jpg", scene);
materialBG.diffuseTexture.uScale = 5.0;//Repeat 5 times on the Vertical Axes
materialBG.diffuseTexture.vScale = 5.0;//Repeat 5 times on the Horizontal Axes
materialBG.backFaceCulling = false;//Always show the front and the back of an element
planeBG.material = materialBG;
//工厂地面
var plane = BABYLON.Mesh.CreatePlane("plane", 512, scene);
plane.position.y = -0;
plane.rotation.x = Math.PI / 2;
plane.rotation.z = 0;
plane.scaling.x = 1;
plane.scaling.y = 0.724569;
materialPlane = new BABYLON.StandardMaterial("texturePlane", scene);
materialPlane.diffuseTexture = new BABYLON.Texture("../../Content/images/shuinidi.jpg", scene);
materialPlane.diffuseTexture.uScale = 5.0;//Repeat 5 times on the Vertical Axes
materialPlane.diffuseTexture.vScale = 5.0;//Repeat 5 times on the Horizontal Axes
materialPlane.backFaceCulling = false;//Always show the front and the back of an element
//materialPlane.diffuseColor = new BABYLON.Color3(0.2, 0.2, 0.3); //Red
plane.material = materialPlane;
//原点
sphere_0 = BABYLON.Mesh.CreateSphere("Sphere1", 1, 3, scene);
sphere_0.position.x = 0;
sphere_0.position.y = 0;
sphere_0.position.z = 0;
//x点
var sphere_x = BABYLON.Mesh.CreateSphere("Sphere1", 1, 3, scene);
sphere_x.position.x = 10;
sphere_x.position.y = 0;
sphere_x.position.z = 0;
var materialSphere2 = new BABYLON.StandardMaterial("texture2", scene);
materialSphere2.diffuseColor = new BABYLON.Color3(1, 0, 0); //Red
sphere_x.material = materialSphere2;
//z点
var sphere_z = BABYLON.Mesh.CreateSphere("Sphere1", 1, 3, scene);
sphere_z.position.x = 0;
sphere_z.position.y = 0;
sphere_z.position.z = 10;
var materialSphere3 = new BABYLON.StandardMaterial("texture2", scene);
materialSphere3.diffuseColor = new BABYLON.Color3(0, 2, 0); //green
sphere_z.material = materialSphere3;
return scene;
}
</script>
</body>
</html>
1761
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
