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.
801 lines
27 KiB
801 lines
27 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>";
|
|
|
|
// 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 camera07 = scene.getTransformNodeByName("Camera8");
|
|
var camera08 = scene.getTransformNodeByName("Camera9");
|
|
camera07.name = "camera07";
|
|
camera08.name = "camera08";
|
|
|
|
camera07.nameID = "YLS_MO_CAM_001";
|
|
camera08.nameID = "YLS_MO_CAM_002";
|
|
camera07.baojing = false;
|
|
camera08.baojing = false;
|
|
|
|
var yangan06 = scene.getTransformNodeByName("yangan_5");
|
|
yangan06.name = "yangan06"
|
|
yangan06.nameID = "YLS_MO_OAO_001"
|
|
|
|
yangan06.wendu = 0;
|
|
yangan06.sidu = 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) {
|
|
console.log(transformNodex.name)
|
|
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);
|
|
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)
|
|
}
|
|
)
|
|
);
|
|
}
|
|
}
|
|
|
|
prepareGroupButtonOther(camera07, new BABYLON.Color3(0, 0, 1))
|
|
prepareGroupButtonOther(camera08, new BABYLON.Color3(0, 0, 1))
|
|
prepareGroupButtonOther(yangan06, new BABYLON.Color3(0, 0, 1))
|
|
|
|
//修改贴图
|
|
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 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);
|
|
|
|
scene.getMaterialByName("cover_label.001").metallic = 0.36;
|
|
scene.getMaterialByName("cover_label.001").albedoColor = new BABYLON.Color3(1, 1, 1);
|
|
|
|
|
|
scene.getMaterialByName("Desk.001").metallic = 0.80;
|
|
scene.getMaterialByName("Desk.001").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.005").metallic = 0.80;
|
|
scene.getMaterialByName("Desk.005").roughness = 0.72;
|
|
scene.getMaterialByName("Desk.006").metallic = 0.80;
|
|
scene.getMaterialByName("Desk.006").roughness = 0.72;
|
|
|
|
var plane = BABYLON.MeshBuilder.CreatePlane("plane", { width: 10, height: 10 }, scene);
|
|
plane.position = new BABYLON.Vector3(0.110, 2.93, -0.28);
|
|
plane.rotation = new BABYLON.Vector3(90 * Math.PI / 180, 0, 0);
|
|
plane.scaling = new BABYLON.Vector3(0.6, 0.55, 1);
|
|
|
|
|
|
scene.getMaterialByName("cover_label.001").alpha = 0.7;
|
|
scene.getMaterialByName("cover_label.001").transparencyMode = 2; //ALPHABLEND
|
|
|
|
// 给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, 2.3, 0));
|
|
camera.attachControl(canvas, true);
|
|
camera.lowerRadiusLimit = 2.0; // 这里是最大的位置，值越大，物体越小
|
|
camera.upperRadiusLimit = 40;
|
|
camera.radius = 10.328;
|
|
camera.alpha = Math.PI * 281 / 180;
|
|
camera.beta = Math.PI * 52 / 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 assetsManager = new BABYLON.AssetsManager(scene);
|
|
var meshTask = assetsManager.addMeshTask("skull task", "", "asset/", "c3.glb");
|
|
|
|
meshTask.onSuccess = function (task) {
|
|
task.loadedMeshes[0].scaling = new BABYLON.Vector3(0.2, 0.2, -0.2);
|
|
task.loadedMeshes[0].position = new BABYLON.Vector3(0.000, 3, 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.2, 0.2, -0.2);
|
|
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, 0, 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.2, 0.2, -0.2);
|
|
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, 0, 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 a = scene.getMaterialByName("carpaint_baseRed");
|
|
|
|
if (a != null) {
|
|
if (a.albedoColor == b) {
|
|
b = new BABYLON.Color3(0, 1, 0);
|
|
a.albedoColor = b;
|
|
}
|
|
}
|
|
|
|
var nodealert = scene.getTransformNodeByName("yangan06");
|
|
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 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);
|
|
}
|
|
});
|
|
|
|
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('YLS_MO_OAO_001', 'yangan06');
|
|
yangans.put('YLS_MO_CAM_001', 'camera07');
|
|
yangans.put('YLS_MO_CAM_002', 'camera08');
|
|
|
|
//功能转入报警
|
|
function Myalert (MathineID, baojing) {
|
|
scene.getMeshByName("tapblue").setEnabled(false);
|
|
scene.getMeshByName("tapred").setEnabled(false);
|
|
var theName = yangans.get(MathineID);
|
|
alert(theName)
|
|
if (theName == "yangan06") {
|
|
scene.getTransformNodeByName("yangan06").baojing = baojing;
|
|
}
|
|
if (theName == "camera07") {
|
|
scene.getTransformNodeByName("camera07").baojing = baojing;
|
|
}
|
|
if (theName == "camera08") {
|
|
scene.getTransformNodeByName("camera08").baojing = baojing;
|
|
}
|
|
}
|
|
|
|
//报警 true:表示报警， false :表示不报警
|
|
// Myalert("YLS_MO_OAO_001",true)
|
|
|
|
//设置温湿度
|
|
function setAlertValue (MathineID, wendu, sidu) {
|
|
var theName = yangans.get(MathineID);
|
|
if (theName == "yangan06") {
|
|
scene.getTransformNodeByName("yangan06").wendu = wendu;
|
|
scene.getTransformNodeByName("yangan06").sidu = sidu;
|
|
}
|
|
}
|
|
//设置温湿度: setAlertValue("DAK_MO_OAO_001",4,5)
|
|
// setAlertValue("YLS_MO_OAO_001", 4, 5);
|
|
|
|
// 设置是否显示
|
|
function setYangGanCanshow (MathineID, canshow) {
|
|
var theName = yangans.get(MathineID);
|
|
if (theName == "yangan06") {
|
|
scene.getTransformNodeByName(theName).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
|
|
);
|