You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1001 lines
30 KiB
1001 lines
30 KiB
// 从这里开始
|
|
var h1 = null;
|
|
var h2 = null;
|
|
|
|
var oldtransformNodex = null;
|
|
var oldtransformNodeOther = null;
|
|
var drag = null;
|
|
var notmoveGroup = null;
|
|
var movedGroup = null;
|
|
|
|
var movesingle = false;
|
|
var dynamicTexture = null;
|
|
var dynamicTexture2 = null;
|
|
var dynamicTexture3 = null;
|
|
var dynamicTexture4 = null;
|
|
var PointerOverYangan = null;
|
|
var show = 50;
|
|
var showdd = 50;
|
|
var deviceData = [];
|
|
BABYLON.DefaultLoadingScreen.prototype.displayLoadingUI = function() {
|
|
if (document.getElementById("customLoadingScreenDiv")) {
|
|
document.getElementById("customLoadingScreenDiv").style.display = "initial";
|
|
// 给vue页面传值，加载完成之前
|
|
parent.getIframeLoading("true")
|
|
return;
|
|
}
|
|
this._loadingDiv = document.createElement("div");
|
|
//this._loadingDiv.style.height = '1750px';
|
|
this._loadingDiv.id = "customLoadingScreenDiv";
|
|
|
|
thecss = "lohingifpc";
|
|
thecss2 = "zcpc";
|
|
|
|
this._loadingDiv.innerHTML =
|
|
"<div class='oka'><div class='" +
|
|
thecss +
|
|
"'><image src='./logok.gif' class='jiazaiimg'/></div><div class='" +
|
|
thecss2 +
|
|
"'>由 <image class='feitimg' src='./img/yxlogo.png'/> 阅行客 提供技术支持!</div></div>";
|
|
|
|
this._resizeLoadingUI();
|
|
window.addEventListener("resize", this._resizeLoadingUI);
|
|
document.body.appendChild(this._loadingDiv);
|
|
};
|
|
|
|
BABYLON.DefaultLoadingScreen.prototype.hideLoadingUI = function() {
|
|
show = 50;
|
|
document.getElementById("customLoadingScreenDiv").style.display = "none";
|
|
document.getElementById("customLoadingScreenDiv_first").style.display =
|
|
"none";
|
|
document.title = "整理室";
|
|
|
|
//scene.getMaterialByName("材质.023").roughness = 0;
|
|
|
|
var prepareGroupButtonOther = function(transformNodex, color) {
|
|
var mesheses = null;
|
|
if (transformNodex.getClassName() == "TransformNode") {
|
|
mesheses = transformNodex.getChildMeshes(false);
|
|
} else {
|
|
mesheses = [];
|
|
mesheses.push(transformNodex);
|
|
}
|
|
|
|
for (var i = 0; i < mesheses.length; i++) {
|
|
mesheses[i].actionManager = new BABYLON.ActionManager(scene);
|
|
var theScaling = mesheses[i].scaling;
|
|
if (true) {
|
|
try {
|
|
//mesheses[i].actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOutTrigger, mesheses[i], "scaling", new BABYLON.Vector3(theScaling.x, theScaling.y, theScaling.z), 100));
|
|
// 初始化数据 温度/湿度
|
|
deviceData.forEach(item => {
|
|
if (item.id === transformNodex.nameID) {
|
|
transformNodex.wendu = item.wendu;
|
|
transformNodex.sidu = item.sidu;
|
|
transformNodex.baojing = item.alarmState;
|
|
}
|
|
});
|
|
mesheses[i].actionManager.registerAction(
|
|
new BABYLON.ExecuteCodeAction(
|
|
{
|
|
trigger: BABYLON.ActionManager.OnPointerOverTrigger,
|
|
parameter: ""
|
|
},
|
|
function() {
|
|
clickbegin = true;
|
|
|
|
if (true) {
|
|
try {
|
|
if (oldtransformNodeOther != null) {
|
|
oldtransformNodeOther.removeBehavior(drag);
|
|
var mesheses2 = null;
|
|
if (
|
|
oldtransformNodeOther.getClassName() == "TransformNode"
|
|
) {
|
|
mesheses2 = oldtransformNodeOther.getChildMeshes(false);
|
|
} else {
|
|
mesheses2 = [];
|
|
mesheses2.push(oldtransformNodeOther);
|
|
}
|
|
for (var i = 0; i < mesheses2.length; i++) {
|
|
try {
|
|
h2.removeMesh(mesheses2[i]);
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
}
|
|
}
|
|
|
|
oldtransformNodeOther = transformNodex;
|
|
|
|
//transformNodex.addBehavior(drag);
|
|
|
|
var mesheses3 = null;
|
|
if (transformNodex.getClassName() == "TransformNode") {
|
|
mesheses3 = transformNodex.getChildMeshes(false);
|
|
} else {
|
|
mesheses3 = [];
|
|
mesheses3.push(transformNodex);
|
|
}
|
|
for (var i = 0; i < mesheses3.length; i++) {
|
|
try {
|
|
if (transformNodex.baojing == true) {
|
|
h2.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
|
|
} else {
|
|
h2.addMesh(mesheses3[i], color);
|
|
}
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
}
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
clickbegin = false;
|
|
}
|
|
|
|
if (transformNodex.name.indexOf("yangan") >= 0) {
|
|
PointerOverYangan = transformNodex.name;
|
|
|
|
if (transformNodex.baojing == true) {
|
|
var location = transformNodex.absolutePosition;
|
|
var xd = scene.getMeshByName("tapred");
|
|
// x = x-0.6;; y = y+0.3 z=z+0.5
|
|
xd.position = new BABYLON.Vector3(
|
|
location.x - 0.6,
|
|
location.y + 0.9,
|
|
location.z + 0.5
|
|
);
|
|
|
|
var font_size = 36;
|
|
var font = "bold " + font_size + "px Arial";
|
|
dynamicTexture3.drawText(
|
|
transformNodex.wendu + "°C",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
dynamicTexture4.drawText(
|
|
transformNodex.sidu + "%",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
if(transformNodex.canshow == true){
|
|
xd.setEnabled(true);
|
|
}
|
|
} else {
|
|
var location = transformNodex.absolutePosition;
|
|
var xd = scene.getMeshByName("tapblue");
|
|
// x = x-0.6;; y = y+0.3 z=z+0.5
|
|
xd.position = new BABYLON.Vector3(
|
|
location.x - 0.6,
|
|
location.y + 0.9,
|
|
location.z + 0.5
|
|
);
|
|
|
|
var font_size = 36;
|
|
var font = "bold " + font_size + "px Arial";
|
|
dynamicTexture.drawText(
|
|
transformNodex.wendu + "°C",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
dynamicTexture2.drawText(
|
|
transformNodex.sidu + "%",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
|
|
if(transformNodex.canshow == true){
|
|
xd.setEnabled(true);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
)
|
|
);
|
|
|
|
mesheses[i].actionManager.registerAction(
|
|
new BABYLON.ExecuteCodeAction(
|
|
{
|
|
trigger: BABYLON.ActionManager.OnPointerOutTrigger,
|
|
parameter: ""
|
|
},
|
|
function() {
|
|
var mesheses2 = null;
|
|
if (transformNodex.getClassName() == "TransformNode") {
|
|
mesheses2 = transformNodex.getChildMeshes(false);
|
|
} else {
|
|
mesheses2 = [];
|
|
mesheses2.push(transformNodex);
|
|
}
|
|
for (var i = 0; i < mesheses2.length; i++) {
|
|
try {
|
|
h2.removeMesh(mesheses2[i]);
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
}
|
|
|
|
if (transformNodex.name.indexOf("yangan") >= 0) {
|
|
if (transformNodex.baojing == true) {
|
|
var location = transformNodex.absolutePosition;
|
|
var xd = scene.getMeshByName("tapred");
|
|
// x = x-0.6;; y = y+0.3 z=z+0.5
|
|
|
|
xd.setEnabled(false);
|
|
} else {
|
|
var location = transformNodex.absolutePosition;
|
|
var xd = scene.getMeshByName("tapblue");
|
|
// x = x-0.6;; y = y+0.3 z=z+0.5
|
|
|
|
xd.setEnabled(false);
|
|
}
|
|
}
|
|
}
|
|
)
|
|
);
|
|
|
|
//mesheses[i].actionManager.registerAction(new BABYLON.InterpolateValueAction(BABYLON.ActionManager.OnPointerOverTrigger, mesheses[i], "scaling", new BABYLON.Vector3(theScaling.x * 1.01, theScaling.y * 1.01, theScaling.z * 1.01), 100));
|
|
} catch (error) {
|
|
//alert(error)
|
|
}
|
|
}
|
|
|
|
var clickbegin = false;
|
|
mesheses[i].actionManager.registerAction(
|
|
new BABYLON.ExecuteCodeAction(
|
|
{
|
|
trigger: BABYLON.ActionManager.OnPickTrigger,
|
|
parameter: ""
|
|
},
|
|
function() {
|
|
cameraClick(transformNodex);
|
|
}
|
|
)
|
|
);
|
|
}
|
|
};
|
|
|
|
var camera05 = scene.getTransformNodeByName("Camera05");
|
|
var camera06 = scene.getTransformNodeByName("Camera06");
|
|
camera05.name = "camera05";
|
|
camera06.name = "camera06";
|
|
|
|
camera05.nameID = "ZLS_MO_CAM_001";
|
|
camera06.nameID = "ZLS_MO_CAM_002";
|
|
camera05.baojing = false;
|
|
camera06.baojing = false;
|
|
|
|
|
|
|
|
var yangan05 = scene.getTransformNodeByName("yangan_4");
|
|
yangan05.name = "yangan05";
|
|
yangan05.nameID = "ZLS_MO_OAO_001";
|
|
|
|
yangan05.wendu = 0;
|
|
yangan05.sidu = 0;
|
|
yangan05.baojing = false;
|
|
yangan05.canshow = true;
|
|
|
|
prepareGroupButtonOther(yangan05, new BABYLON.Color3(0, 0, 1));
|
|
|
|
prepareGroupButtonOther(camera06, new BABYLON.Color3(0, 0, 1));
|
|
prepareGroupButtonOther(camera05, new BABYLON.Color3(0, 0, 1));
|
|
|
|
var x = scene.getMeshByName("立方体_2_17_primitive0");
|
|
x.overlayColor = BABYLON.Color3.White();
|
|
x.renderOverlay = true;
|
|
|
|
//修改贴图
|
|
|
|
var bluexMat = new BABYLON.PBRMaterial("bluex", scene);
|
|
var tempddxa = new BABYLON.Texture("./asset/blue.png", scene);
|
|
|
|
var tempddxb = new BABYLON.Texture("./asset/blue.png", scene);
|
|
tempddxa.hasAlpha = true;
|
|
tempddxa.hasAlpha = true;
|
|
tempddxa.uAng = (180 * Math.PI) / 180;
|
|
tempddxb.uAng = (180 * Math.PI) / 180;
|
|
|
|
bluexMat.useAlphaFromAlbedoTexture = true;
|
|
bluexMat.albedoTexture = tempddxa;
|
|
bluexMat.reflectionColor = new BABYLON.Color3(0, 0, 0);
|
|
bluexMat.lightmapTexture = tempddxb;
|
|
scene.getMeshByName("平面_1").material = bluexMat;
|
|
|
|
var redMat = new BABYLON.PBRMaterial("redMat", scene);
|
|
var tempddx2 = new BABYLON.Texture("./asset/red.png", scene);
|
|
var tempddx3 = new BABYLON.Texture("./asset/red.png", scene);
|
|
tempddx2.hasAlpha = true;
|
|
tempddx3.hasAlpha = true;
|
|
tempddx2.uAng = (180 * Math.PI) / 180;
|
|
tempddx3.uAng = (180 * Math.PI) / 180;
|
|
|
|
redMat.useAlphaFromAlbedoTexture = true;
|
|
redMat.reflectionColor = new BABYLON.Color3(0, 0, 0);
|
|
//redMat.emissiveTexture =tempddx2;
|
|
redMat.albedoTexture = tempddx2;
|
|
redMat.lightmapTexture = tempddx3;
|
|
|
|
scene.getMeshByName("平面_1_2").material = redMat;
|
|
|
|
var font_size = 48;
|
|
var font = "bold " + font_size + "px Arial";
|
|
|
|
//Set height for plane
|
|
var planeHeight = 3;
|
|
|
|
//Set height for dynamic texture
|
|
var DTHeight = 1.5 * font_size; //or set as wished
|
|
|
|
//Calcultae ratio
|
|
var ratio = planeHeight / DTHeight;
|
|
|
|
//Set text
|
|
var text = "10";
|
|
|
|
//Use a temporay dynamic texture to calculate the length of the text on the dynamic texture canvas
|
|
var temp = new BABYLON.DynamicTexture("DynamicTexture", 64, scene);
|
|
var tmpctx = temp.getContext();
|
|
tmpctx.font = font;
|
|
var DTWidth = tmpctx.measureText(text).width + 58;
|
|
|
|
//Calculate width the plane has to be
|
|
var planeWidth = DTWidth * ratio;
|
|
|
|
//Create dynamic texture and write the text
|
|
dynamicTexture = new BABYLON.DynamicTexture(
|
|
"DynamicTexture",
|
|
{ width: DTWidth, height: DTHeight },
|
|
scene,
|
|
false
|
|
);
|
|
|
|
var mat = new BABYLON.StandardMaterial("mat", scene);
|
|
|
|
//var mat = new BABYLON.PBRMaterial("mat", scene);
|
|
//mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
|
|
mat.disableLighting = true;
|
|
|
|
mat.emissiveTexture = dynamicTexture;
|
|
mat.reflectivityColor = new BABYLON.Color3(0, 0, 0);
|
|
|
|
dynamicTexture.uAng = (166.39 * Math.PI) / 180;
|
|
|
|
//Create plane and set dynamic texture as material
|
|
//var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
|
|
var vxd = scene.getMeshByName("平面_2"); //blue
|
|
vxd.material = mat;
|
|
|
|
//平面3
|
|
|
|
dynamicTexture2 = new BABYLON.DynamicTexture(
|
|
"DynamicTexture2",
|
|
{ width: DTWidth, height: DTHeight },
|
|
scene,
|
|
false
|
|
);
|
|
|
|
//var mat = new BABYLON.StandardMaterial("mat", scene);
|
|
//mat.disableLighting = true;
|
|
|
|
var mat2 = new BABYLON.StandardMaterial("mat2", scene);
|
|
//mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
|
|
mat2.disableLighting = true;
|
|
//mat2.ambientTexture = dynamicTexture2;
|
|
mat2.emissiveTexture = dynamicTexture2;
|
|
mat2.reflectivityColor = new BABYLON.Color3(0, 0, 0);
|
|
|
|
dynamicTexture2.uAng = (166.39 * Math.PI) / 180;
|
|
|
|
//Create plane and set dynamic texture as material
|
|
//var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
|
|
var vxd2 = scene.getMeshByName("平面_3");
|
|
vxd2.material = mat2;
|
|
|
|
//-------------------------------------------------------------------------------------
|
|
dynamicTexture3 = new BABYLON.DynamicTexture(
|
|
"DynamicTexture3",
|
|
{ width: DTWidth, height: DTHeight },
|
|
scene,
|
|
false
|
|
);
|
|
|
|
//var mat = new BABYLON.StandardMaterial("mat", scene);
|
|
//mat.disableLighting = true;
|
|
|
|
var mat3 = new BABYLON.StandardMaterial("mat3", scene);
|
|
//mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
|
|
mat3.disableLighting = true;
|
|
//mat2.ambientTexture = dynamicTexture2;
|
|
mat3.emissiveTexture = dynamicTexture3;
|
|
mat3.reflectivityColor = new BABYLON.Color3(0, 0, 0);
|
|
|
|
dynamicTexture3.uAng = (166.39 * Math.PI) / 180;
|
|
|
|
//Create plane and set dynamic texture as material
|
|
//var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
|
|
|
|
var vxd3 = scene.getMeshByName("平面_2_2"); //blue
|
|
vxd3.material = mat3;
|
|
//-------------------------------------------------------------------------------------
|
|
dynamicTexture4 = new BABYLON.DynamicTexture(
|
|
"dynamicTexture4",
|
|
{ width: DTWidth, height: DTHeight },
|
|
scene,
|
|
false
|
|
);
|
|
|
|
//var mat = new BABYLON.StandardMaterial("mat", scene);
|
|
//mat.disableLighting = true;
|
|
|
|
var mat4 = new BABYLON.StandardMaterial("mat4", scene);
|
|
//mat.albedoColor = new BABYLON.Color4(0.7968, 0.3685, 0.1105, 1);
|
|
mat4.disableLighting = true;
|
|
//mat2.ambientTexture = dynamicTexture2;
|
|
mat4.emissiveTexture = dynamicTexture4;
|
|
mat4.reflectivityColor = new BABYLON.Color3(0, 0, 0);
|
|
|
|
dynamicTexture4.uAng = (166.39 * Math.PI) / 180;
|
|
|
|
//Create plane and set dynamic texture as material
|
|
//var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width:planeWidth, height:planeHeight}, scene);
|
|
|
|
var vxd4 = scene.getMeshByName("平面_3_2");
|
|
vxd4.material = mat4;
|
|
|
|
scene.getMeshByName("tapblue").setEnabled(false);
|
|
scene.getMeshByName("tapred").setEnabled(false);
|
|
|
|
var plane = BABYLON.MeshBuilder.CreatePlane(
|
|
"plane",
|
|
{ width: 10, height: 10 },
|
|
scene
|
|
);
|
|
plane.position = new BABYLON.Vector3(0.11, 1.93, -0.81);
|
|
plane.rotation = new BABYLON.Vector3((90 * Math.PI) / 180, 0, 0);
|
|
plane.scaling = new BABYLON.Vector3(1.2, 1, 1);
|
|
|
|
var material2d = scene.getMaterialByName("材质.16");
|
|
material2d.metallic = 0.52;
|
|
material2d.roughness = 0;
|
|
//material2.metallicReflectanceColor=new BABYLON.Color3(1,0,0);
|
|
material2d.albedoColor = new BABYLON.Color3(0.8, 0.8, 0.8);
|
|
|
|
scene.getMaterialByName("Desk.010").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.010").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.011").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.011").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.012").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.012").roughness = 0.72;
|
|
|
|
scene.getMaterialByName("Desk.013").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.013").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.014").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.014").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.015").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.015").roughness = 0.72;
|
|
|
|
scene.getMaterialByName("Desk.016").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.016").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.017").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.017").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.018").metallic = 0.8;
|
|
scene.getMaterialByName("Desk.018").roughness = 0.72;
|
|
|
|
scene.getMaterialByName("材质.29").metallic = 0.8;
|
|
|
|
// 给vue页面传值，加载完成之后
|
|
parent.getIframeLoading("false")
|
|
};
|
|
|
|
// createScene function that creates and return the scene
|
|
var createScene = function() {
|
|
engine.displayLoadingUI();
|
|
// create a basic BJS Scene object
|
|
var scene = new BABYLON.Scene(engine);
|
|
|
|
// scene.debugLayer.show();
|
|
var camera = new BABYLON.ArcRotateCamera(
|
|
"Camera",
|
|
0,
|
|
0,
|
|
5,
|
|
new BABYLON.Vector3(0, -1, 0),
|
|
scene
|
|
);
|
|
camera.setTarget(new BABYLON.Vector3(0, 3.5, 0));
|
|
camera.attachControl(canvas, true);
|
|
camera.lowerRadiusLimit = 2.0; // 这里是最大的位置，值越大，物体越小
|
|
camera.upperRadiusLimit = 40;
|
|
camera.radius = 14.888;
|
|
camera.alpha = (Math.PI * -240.2) / 180;
|
|
camera.beta = (Math.PI * 66) / 180;
|
|
camera.inertia = 0.1; // 缩放的快慢
|
|
camera.useAutoRotationBehavior = true; // 自动旋转
|
|
|
|
camera.panningDistanceLimit = 2; //平移半径
|
|
camera.panningInertia = 0;
|
|
camera.autoTransitionRange = 1;
|
|
camera.pinchToPanMaxDistance = 0.1;
|
|
camera.pinchDeltaPercentage = 0.001;
|
|
camera.useAutoRotationBehavior = false;
|
|
|
|
scene.activeCamera = camera;
|
|
// 改变场景背景颜色 - 背景颜色opacity值设为0，达到透明背景的效果
|
|
scene.clearColor = new BABYLON.Color4(0, 0, 0, 0);
|
|
|
|
scene.activeCamera.useInputToRestoreState = true;
|
|
var camera1_status = scene.activeCamera.storeState();
|
|
|
|
var light = new BABYLON.HemisphericLight(
|
|
"HemiLight",
|
|
new BABYLON.Vector3(0, 1, 0),
|
|
scene
|
|
);
|
|
light.intensity = 2;
|
|
light.diffuse = new BABYLON.Color3(0.92, 0.92, 0.92);
|
|
|
|
var assetsManager = new BABYLON.AssetsManager(scene);
|
|
var meshTask = assetsManager.addMeshTask(
|
|
"skull task",
|
|
"",
|
|
"asset/",
|
|
"B4.glb"
|
|
);
|
|
|
|
meshTask.onSuccess = function(task) {
|
|
task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.4, 0.4, -0.4);
|
|
task.loadedMeshes[0].position = new BABYLON.Vector3(0.0, 2, 0);
|
|
};
|
|
meshTask.onError = function(task, message, exception) {
|
|
console.log(message, exception);
|
|
};
|
|
|
|
var meshTask_tapblue = assetsManager.addMeshTask(
|
|
"skull task",
|
|
"",
|
|
"asset/",
|
|
"tapBlue.glb"
|
|
);
|
|
|
|
meshTask_tapblue.onSuccess = function(task) {
|
|
task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.4, 0.4, -0.4);
|
|
task.loadedMeshes[0].position = new BABYLON.Vector3(0, 0, 0);
|
|
//-2.5,3.77,1.45
|
|
// x = x-0.6;; y = y+0.3 z=z+0.5
|
|
task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
|
|
task.loadedMeshes[0].name = "tapblue";
|
|
var vx = scene.getTransformNodeByName("蓝");
|
|
|
|
vx.position = new BABYLON.Vector3(0, -1.2, 0);
|
|
vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
|
|
vx.scaling = new BABYLON.Vector3(0.015, 0.015, 0.015);
|
|
};
|
|
meshTask_tapblue.onError = function(task, message, exception) {
|
|
console.log(message, exception);
|
|
};
|
|
|
|
var meshTask_tapred = assetsManager.addMeshTask(
|
|
"skull task",
|
|
"",
|
|
"asset/",
|
|
"tapRed.glb"
|
|
);
|
|
|
|
meshTask_tapred.onSuccess = function(task) {
|
|
task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.4, 0.4, -0.4);
|
|
task.loadedMeshes[0].position = new BABYLON.Vector3(-1.929, 4.029, 0.968);
|
|
//-2.5,3.77,1.45
|
|
// x = x-0.6;; y = y+0.3 z=z+0.5
|
|
task.loadedMeshes[0].rotation = new BABYLON.Vector3(0, 0, 0);
|
|
task.loadedMeshes[0].name = "tapred";
|
|
var vx = scene.getTransformNodeByName("红");
|
|
|
|
vx.position = new BABYLON.Vector3(0, -1.2, 0);
|
|
vx.rotation = new BABYLON.Vector3(Math.PI / 2, 0, 0);
|
|
vx.scaling = new BABYLON.Vector3(0.015, 0.015, 0.015);
|
|
};
|
|
meshTask_tapred.onError = function(task, message, exception) {
|
|
console.log(message, exception);
|
|
};
|
|
|
|
var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData(
|
|
"textures/environmentSpecular.env",
|
|
scene
|
|
);
|
|
//var hdrTexture = new BABYLON.CubeTexture.CreateFromPrefilteredData("textures/environment.env", scene);
|
|
scene.environmentTexture = hdrTexture;
|
|
|
|
// renderCanvas.style.backgroundImage = 'url("./textures/' + '4' + '.jpg")';
|
|
|
|
assetsManager.load();
|
|
|
|
drag = new BABYLON.PointerDragBehavior({
|
|
dragPlaneNormal: new BABYLON.Vector3(0, 0, 1)
|
|
});
|
|
//drag.useObjectOrienationForDragging = false;
|
|
|
|
drag.validateDrag = targetPosition => {
|
|
console.log(targetPosition);
|
|
if (targetPosition.x > 10.5 || targetPosition.x < -10.5) {
|
|
return false;
|
|
}
|
|
if (targetPosition.z > 10.5 || targetPosition.z < -10.5) {
|
|
return false;
|
|
}
|
|
if (oldtransformNodex != null) {
|
|
return true;
|
|
}
|
|
};
|
|
drag.onDragEndObservable.add(event => {
|
|
console.log("dragEnd");
|
|
//console.log(event);
|
|
//console.log(line03_position)
|
|
});
|
|
|
|
//GUI
|
|
h1 = new BABYLON.HighlightLayer("hl1", scene);
|
|
h2 = new BABYLON.HighlightLayer("hl2", scene);
|
|
h3 = new BABYLON.HighlightLayer("hl3", scene);
|
|
var step = 0.1;
|
|
var currentx = 1;
|
|
|
|
var step2 = 0.1;
|
|
var currentx2 = 0.1;
|
|
h1.blurHorizontalSize = 0.1;
|
|
var showx = 0;
|
|
var showx2 = 2;
|
|
scene.registerAfterRender(() => {
|
|
h1.blurHorizontalSize = h1.blurVerticalSize + currentx;
|
|
h2.blurHorizontalSize = h2.blurVerticalSize + currentx2;
|
|
h3.blurHorizontalSize = h3.blurVerticalSize + currentx2;
|
|
|
|
var nodealert = scene.getTransformNodeByName("yangan05");
|
|
if (nodealert != null) {
|
|
var mesheses3 = null;
|
|
if (nodealert.getClassName() == "TransformNode") {
|
|
mesheses3 = nodealert.getChildMeshes(false);
|
|
} else {
|
|
mesheses3 = [];
|
|
mesheses3.push(nodealert);
|
|
}
|
|
for (var i = 0; i < mesheses3.length; i++) {
|
|
try {
|
|
if (nodealert.baojing == true) {
|
|
h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
|
|
} else {
|
|
h3.removeMesh(mesheses3[i]);
|
|
}
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
}
|
|
}
|
|
|
|
var nodealert = scene.getTransformNodeByName("camera05");
|
|
if (nodealert != null) {
|
|
var mesheses3 = null;
|
|
if (nodealert.getClassName() == "TransformNode") {
|
|
mesheses3 = nodealert.getChildMeshes(false);
|
|
} else {
|
|
mesheses3 = [];
|
|
mesheses3.push(nodealert);
|
|
}
|
|
for (var i = 0; i < mesheses3.length; i++) {
|
|
try {
|
|
if (nodealert.baojing == true) {
|
|
h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
|
|
} else {
|
|
h3.removeMesh(mesheses3[i]);
|
|
}
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
}
|
|
}
|
|
|
|
var nodealert = scene.getTransformNodeByName("camera06");
|
|
if (nodealert != null) {
|
|
var mesheses3 = null;
|
|
if (nodealert.getClassName() == "TransformNode") {
|
|
mesheses3 = nodealert.getChildMeshes(false);
|
|
} else {
|
|
mesheses3 = [];
|
|
mesheses3.push(nodealert);
|
|
}
|
|
for (var i = 0; i < mesheses3.length; i++) {
|
|
try {
|
|
if (nodealert.baojing == true) {
|
|
h3.addMesh(mesheses3[i], new BABYLON.Color3(1, 0, 0));
|
|
} else {
|
|
h3.removeMesh(mesheses3[i]);
|
|
}
|
|
} catch (error) {
|
|
// alert(error)
|
|
}
|
|
}
|
|
}
|
|
|
|
var a = scene.getMaterialByName("carpaint_baseRed");
|
|
if (a != null) {
|
|
if (a.albedoColor == b) {
|
|
b = new BABYLON.Color3(0, 1, 0);
|
|
a.albedoColor = b;
|
|
}
|
|
}
|
|
var v2 = scene.getMeshByName("tapblue");
|
|
if (v2 != null) {
|
|
v2.lookAt(camera.globalPosition, 0, 0, Math.PI);
|
|
}
|
|
|
|
var v3 = scene.getMeshByName("tapred");
|
|
if (v3 != null) {
|
|
v3.lookAt(camera.globalPosition, 0, 0, Math.PI);
|
|
}
|
|
|
|
if (currentx > 0.5) {
|
|
step *= -1;
|
|
}
|
|
if (currentx < 0) {
|
|
step *= -1;
|
|
}
|
|
currentx += step;
|
|
|
|
if (currentx2 > 5) {
|
|
step2 *= -1;
|
|
}
|
|
if (currentx2 < 0) {
|
|
step2 *= -1;
|
|
}
|
|
currentx2 += step2;
|
|
|
|
if (dynamicTexture != null && PointerOverYangan != null) {
|
|
var textx = scene.getTransformNodeByName(PointerOverYangan).wendu;
|
|
|
|
var font_size = 36;
|
|
var font = "bold " + font_size + "px Arial";
|
|
|
|
dynamicTexture.drawText(
|
|
textx + "°C",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
showx++;
|
|
show = 50;
|
|
}
|
|
|
|
if (dynamicTexture2 != null && PointerOverYangan != null) {
|
|
var textx = scene.getTransformNodeByName(PointerOverYangan).sidu;
|
|
var font_size = 36;
|
|
var font = "bold " + font_size + "px Arial";
|
|
|
|
dynamicTexture2.drawText(
|
|
textx + "%",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
}
|
|
|
|
if (dynamicTexture3 != null && PointerOverYangan != null) {
|
|
var textx = scene.getTransformNodeByName(PointerOverYangan).wendu;
|
|
var font_size = 36;
|
|
var font = "bold " + font_size + "px Arial";
|
|
|
|
dynamicTexture3.drawText(
|
|
textx + "°C",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
}
|
|
|
|
if (dynamicTexture4 != null && PointerOverYangan != null) {
|
|
var textx = scene.getTransformNodeByName(PointerOverYangan).sidu;
|
|
var font_size = 36;
|
|
var font = "bold " + font_size + "px Arial";
|
|
dynamicTexture4.drawText(
|
|
textx + "%",
|
|
null,
|
|
null,
|
|
font,
|
|
"#FFFFFF",
|
|
"#000000",
|
|
true
|
|
);
|
|
}
|
|
/*show--;
|
|
showdd--;*/
|
|
});
|
|
|
|
return scene;
|
|
};
|
|
|
|
var canvas = document.getElementById("renderCanvas");
|
|
// load the 3D engine
|
|
var engine = new BABYLON.Engine(canvas, true, {
|
|
stencil: true
|
|
});
|
|
|
|
// call the createScene function
|
|
var scene = createScene();
|
|
scene.autoClear = true;
|
|
scene.imageProcessingConfiguration.exposure = 1;
|
|
scene.imageProcessingConfiguration.contrast = 1;
|
|
scene.environmentIntensity = 0.4;
|
|
engine.runRenderLoop(function() {
|
|
scene.render();
|
|
});
|
|
|
|
window.addEventListener("resize", function() {
|
|
engine.resize();
|
|
});
|
|
|
|
function HashMap() {
|
|
//定义长度
|
|
var length = 0;
|
|
//创建一个对象
|
|
var obj = new Object();
|
|
|
|
//判断Map是否为空
|
|
this.isEmpty = function() {
|
|
return length == 0;
|
|
};
|
|
|
|
//判断对象中是否包含给定Key
|
|
this.containsKey = function(key) {
|
|
return key in obj;
|
|
};
|
|
|
|
//判断对象中是否包含给定的Value
|
|
this.containsValue = function(value) {
|
|
for (var key in obj) {
|
|
if (obj[key] == value) {
|
|
return true;
|
|
}
|
|
}
|
|
return false;
|
|
};
|
|
|
|
//向map中添加数据
|
|
this.put = function(key, value) {
|
|
if (!this.containsKey(key)) {
|
|
length++;
|
|
}
|
|
obj[key] = value;
|
|
};
|
|
|
|
//根据给定的key获取Value
|
|
this.get = function(key) {
|
|
return this.containsKey(key) ? obj[key] : null;
|
|
};
|
|
|
|
//根据给定的Key删除一个值
|
|
this.remove = function(key) {
|
|
if (this.containsKey(key) && delete obj[key]) {
|
|
length--;
|
|
}
|
|
};
|
|
|
|
//获得Map中所有的value
|
|
this.values = function() {
|
|
var _values = new Array();
|
|
for (var key in obj) {
|
|
_values.push(obj[key]);
|
|
}
|
|
return _values;
|
|
};
|
|
|
|
//获得Map中的所有key
|
|
this.keySet = function() {
|
|
var _keys = new Array();
|
|
for (var key in obj) {
|
|
_keys.push(key);
|
|
}
|
|
return _keys;
|
|
};
|
|
|
|
//获得Map的长度
|
|
this.size = function() {
|
|
return length;
|
|
};
|
|
|
|
//清空Map
|
|
this.clear = function() {
|
|
length = 0;
|
|
obj = new Object();
|
|
};
|
|
}
|
|
|
|
var yangans = new HashMap();
|
|
yangans.put("ZLS_MO_OAO_001", "yangan05");
|
|
|
|
yangans.put("ZLS_MO_CAM_001", "camera05");
|
|
yangans.put("ZLS_MO_CAM_002", "camera06");
|
|
|
|
//功能转入报警
|
|
function Myalert(MathineID, baojing) {
|
|
scene.getMeshByName("tapblue").setEnabled(false);
|
|
scene.getMeshByName("tapred").setEnabled(false);
|
|
var theName = yangans.get(MathineID);
|
|
if (theName == "yangan05") {
|
|
scene.getTransformNodeByName("yangan05").baojing = baojing;
|
|
}
|
|
if (theName == "camera05") {
|
|
scene.getTransformNodeByName("camera05").baojing = baojing;
|
|
}
|
|
if (theName == "camera06") {
|
|
scene.getTransformNodeByName("camera06").baojing = baojing;
|
|
}
|
|
}
|
|
|
|
//报警 true:表示报警， false :表示不报警
|
|
// Myalert("DAK_MO_OAO_001",true)
|
|
|
|
//设置温湿度
|
|
function setAlertValue(MathineID, wendu, sidu) {
|
|
var theName = yangans.get(MathineID);
|
|
if (theName == "yangan05") {
|
|
scene.getTransformNodeByName("yangan05").wendu = wendu;
|
|
scene.getTransformNodeByName("yangan05").sidu = sidu;
|
|
}
|
|
}
|
|
//设置温湿度: setAlertValue("DAK_MO_OAO_001",4,5)
|
|
|
|
// 设置是否显示
|
|
function setYangGanCanshow(MathineID, canshow){
|
|
var theName = yangans.get(MathineID);
|
|
if(theName == "yangan05"){
|
|
scene.getTransformNodeByName("yangan05").canshow = canshow;
|
|
}
|
|
}
|
|
// setYangGanCanshow("DAK_MO_OAO_001",false)
|
|
|
|
|
|
// function cameraClick(TheCamera) {
|
|
// alert(TheCamera.nameID);
|
|
// }
|
|
function cameraClick(TheCamera) {
|
|
window.parent.postMessage(
|
|
{
|
|
data: TheCamera.nameID
|
|
},
|
|
"*"
|
|
);
|
|
}
|
|
|
|
// 监测父页面传来得初始化得温度湿度值
|
|
window.addEventListener(
|
|
"message",
|
|
function(e) {
|
|
deviceData = e.data.data;
|
|
},
|
|
false
|
|
);
|