import * as THREE from 'three'; import UseThree from '../../../../utils/threejs/useThree'; import singleWindow from './dandaoFc.threejs'; import doubleWindow from './shuangdaoFc.threejs'; import singleWindowXk from './dandaoFcXk.threejs'; import { animateCamera } from '/@/utils/threejs/util'; import useEvent from '../../../../utils/threejs/useEvent'; import { useGlobSetting } from '/@/hooks/setting'; // import * as dat from 'dat.gui'; // const gui = new dat.GUI(); // gui.domElement.style = 'position:absolute;top:100px;left:10px;z-index:99999999999999'; // 模型对象、 文字对象 let model: UseThree, singleWindowObj, doubleWindowObj: doubleWindow, singleWindowXkObj: singleWindowXk, group: THREE.Object3D, windowType = 'singleWindow'; const rotationParam = { frontDeg0: 0, // 前门初始 frontDeg1: 0, // 前门目标 backDeg0: 0, // 后门初始 backDeg1: 0, // 后门目标 }; const { mouseDownFn } = useEvent(); // 打灯光 const addLight = () => { if (!model || !model.scene) return; const directionalLight = new THREE.DirectionalLight(0xffffff, 1); directionalLight.position.set(-110, 150, 647); model.scene?.add(directionalLight); // directionalLight.target = group; const pointLight2 = new THREE.PointLight(0xffffff, 1, 150); pointLight2.position.set(-101, 34, 16); pointLight2.shadow.bias = 0.05; model.scene.add(pointLight2); const pointLight3 = new THREE.PointLight(0xffffff, 1, 150); pointLight3.position.set(19, 25, -7); pointLight3.shadow.bias = 0.05; model.scene.add(pointLight3); const pointLight6 = new THREE.PointLight(0xffffff, 1, 300); pointLight6.position.set(51, 51, 9); pointLight6.shadow.bias = 0.05; model.scene.add(pointLight6); }; // 初始化左右摇摆动画 const startAnimation = () => { // 定义鼠标点击事件 model.canvasContainer?.addEventListener('mousedown', mouseEvent.bind(null)); model.canvasContainer?.addEventListener('pointerup', (event) => { event.stopPropagation(); // 单道、 双道 if (windowType === 'doubleWindow' && doubleWindowObj) { doubleWindowObj.mouseUpModel.call(doubleWindowObj); } else if (windowType === 'singleWindow' && singleWindowObj) { singleWindowObj.mouseUpModel.call(singleWindowObj); } else if (windowType === 'singleXkWindow' && singleWindowXkObj) { singleWindowXkObj.mouseUpModel.call(singleWindowXkObj); } }); }; // 鼠标点击、松开事件 const mouseEvent = (event) => { if (event.button == 0) { mouseDownFn(model, group, event, (intersects) => { if (windowType === 'doubleWindow' && doubleWindowObj) { doubleWindowObj.mousedownModel.call(doubleWindowObj, intersects); } else if (windowType === 'singleWindow' && singleWindowObj) { singleWindowObj.mousedownModel.call(singleWindowObj, intersects); } else if (windowType === 'singleXkWindow' && singleWindowXkObj) { singleWindowXkObj.mousedownModel.call(singleWindowXkObj, intersects); } }); console.log('摄像头控制信息', model.orbitControls, model.camera); } }; export const addMonitorText = (selectData) => { if (windowType === 'doubleWindow' && doubleWindowObj) { return doubleWindowObj.addMonitorText.call(doubleWindowObj, selectData); } else if (windowType === 'singleWindow' && singleWindowObj) { return singleWindowObj.addMonitorText.call(singleWindowObj, selectData); } else if (windowType === 'singleXkWindow' && singleWindowXkObj) { return singleWindowXkObj.addMonitorText.call(singleWindowXkObj, selectData); } }; export function computePlay(data, maxarea, isFirst = false) { if (windowType === 'doubleWindow' || windowType === 'singleWindow') { if (data.OpenDegree || data.OpenDegree1 || data.OpenDegree2) { maxarea = 180; if (data.OpenDegree) { rotationParam.frontDeg0 = (180 / maxarea) * Number(isFirst ? 0 : data.OpenDegree); rotationParam.frontDeg1 = (180 / maxarea) * Number(data.OpenDegree) || 0; } if (data.OpenDegree1) { rotationParam.frontDeg0 = (180 / maxarea) * Number(isFirst ? 0 : data.OpenDegree1); rotationParam.frontDeg1 = (180 / maxarea) * Number(data.OpenDegree1) || 0; } if (data.OpenDegree2) { rotationParam.backDeg0 = (180 / maxarea) * Number(isFirst ? 0 : data.OpenDegree2); rotationParam.backDeg1 = (180 / maxarea) * Number(data.OpenDegree2) || 0; } } else { if (!maxarea) maxarea = 90; rotationParam.frontDeg0 = (90 / maxarea) * Number(isFirst ? 0 : data.forntArea); rotationParam.backDeg0 = (90 / maxarea) * Number(isFirst ? 0 : data.rearArea); rotationParam.frontDeg1 = (90 / maxarea) * Number(data.forntArea) || 0; rotationParam.backDeg1 = (90 / maxarea) * Number(data.rearArea) || 0; } if (!rotationParam.frontDeg1 && !rotationParam.backDeg1) { // 当返回值有误时默认关闭 play(rotationParam, 0); } else { if (data.nwindownum == 1 || data.nwindownum == 2) { setTimeout(() => { play(rotationParam, 1); }, 0); } if (data.nwindownum == 2) { setTimeout(() => { play(rotationParam, 2); }, 0); } } } else if (windowType === 'singleXkWindow') { const acosToAngle = (cosValue) => { cosValue = Math.max(Math.min(cosValue, 1), -1); // 计算角度 return Math.asin(cosValue) * (180 / Math.PI); }; const sina = Math.sqrt((Math.sin((78 * Math.PI) / 180) ** 2 * parseFloat(data.forntArea)) / parseFloat(maxarea)); const angleInRadians = acosToAngle(sina); rotationParam.frontDeg1 = angleInRadians; if (!rotationParam.frontDeg1 && !rotationParam.backDeg1) { // 当返回值有误时默认关闭 play(rotationParam, 0); } else { setTimeout(() => { play(rotationParam, 1); }, 0); } } } export const play = (rotationParam, flag) => { if (windowType === 'doubleWindow' && doubleWindowObj) { return doubleWindowObj.play.call(doubleWindowObj, rotationParam, flag); } else if (windowType === 'singleWindow' && singleWindowObj) { return singleWindowObj.play.call(singleWindowObj, rotationParam, flag); } else if (windowType === 'singleXkWindow' && singleWindowXkObj) { return singleWindowXkObj.play.call(singleWindowXkObj, rotationParam, flag); } }; // 切换风窗类型 export const setModelType = (type) => { // if (!model || !model.scene) return; const { sysOrgCode } = useGlobSetting(); // const sysOrgCode = 'sdmtjtswmk'; windowType = type; return new Promise((resolve) => { // 显示双道风窗 if (windowType === 'doubleWindow' && doubleWindowObj && doubleWindowObj.group) { model.startAnimation = doubleWindowObj.render.bind(doubleWindowObj); model.scene?.remove(group); group = doubleWindowObj.group; const oldCameraPosition = { x: 100, y: 0, z: 10 }; // let newP, newT; // if (sysOrgCode === 'sdmtjtyjlmk') { // newP = { x: 34.294433107431956, y: 19.284123769585108, z: 47.717286013509835 }; // newT = { x: 12.311816240141978, y: -5.691930035759495, z: -5.57302688985693 }; // } else { // newP = { x: 66.257, y: 57.539, z: 94.313 }; // newT = { x: 0, y: 0, z: 0 }; // } const newP = { x: 66.257, y: 57.539, z: 94.313 }; const newT = { x: 0, y: 0, z: 0 }; model.scene?.add(doubleWindowObj.group); setTimeout(async () => { resolve(null); await animateCamera(oldCameraPosition, { x: 0, y: 0, z: 0 }, newP, newT, model); }, 1000); } else if (windowType === 'singleWindow') { // 显示单道风窗 model.startAnimation = singleWindowObj.render.bind(singleWindowObj); model.scene?.remove(group); group = singleWindowObj.group; const oldCameraPosition = { x: 100, y: 0, z: 10 }; let newP, newT; if (sysOrgCode === 'sdmtjtyjlmk') { newP = { x: 34.294433107431956, y: 19.284123769585108, z: 47.717286013509835 }; newT = { x: 12.311816240141978, y: -5.691930035759495, z: -5.57302688985693 }; } else { newP = { x: 66.257, y: 57.539, z: 94.313 }; newT = { x: 0, y: 0, z: 0 }; } model.scene?.add(singleWindowObj.group); setTimeout(async () => { resolve(null); await animateCamera(oldCameraPosition, { x: 0, y: 0, z: 0 }, newP, newT, model); }, 1000); } else if (windowType === 'singleXkWindow') { // 显示单道风窗 model.startAnimation = singleWindowXkObj.render.bind(singleWindowXkObj); model.scene?.remove(group); group = singleWindowXkObj.group; const oldCameraPosition = { x: 100, y: 0, z: 10 }; model.scene?.add(singleWindowXkObj.group); setTimeout(async () => { resolve(null); await animateCamera( oldCameraPosition, { x: 0, y: 0, z: 0 }, { x: 116.08531358656566, y: 81.45510733175816, z: 193.00752046594465 }, { x: 23.446366480086372, y: -12.335134633777185, z: -5.63294282643405 }, model ); }, 1000); } }); }; export const mountedThree = (playerDom) => { // const { sysOrgCode } = useGlobSetting(); const sysOrgCode = 'zmhjhzmy'; return new Promise(async (resolve) => { model = new UseThree('#window3D'); if (!model || !model.renderer || !model.camera) return; model.setEnvMap('royal_esplanade_1k.hdr'); model.renderer.toneMappingExposure = 1.8; model.camera.position.set(100, 0, 1000); singleWindowXkObj = new singleWindowXk(model); // 这里是加载的蓝色有栅栏的模型 // if (sysOrgCode === 'sdmtjtbetmk') { // const singleWindowBet = await import('./dandaoFcBet.threejs'); // if (singleWindowBet) singleWindowObj = new singleWindowBet.default(model); // } if (sysOrgCode === 'sdmtjtyjlmk') { // 单 const singleWindowYjl = await import('./dandaoFcYjl.threejs'); if (singleWindowYjl) singleWindowObj = new singleWindowYjl.default(model); } else { singleWindowObj = new singleWindow(model); } if (sysOrgCode === 'sdmtjtswmk') { const doubleWindow = await import('./shuangdaoFcSw.threejs'); if (doubleWindow) doubleWindowObj = new doubleWindow.default(model); } else if (sysOrgCode === 'sdmtjtbltmk') { const doubleWindow = await import('./shuangdaoFcBlt.threejs'); if (doubleWindow) doubleWindowObj = new doubleWindow.default(model); } else if (sysOrgCode === 'sdmtjtbltmk') { const doubleWindow = await import('./shuangdaoFcBlt.threejs'); if (doubleWindow) doubleWindowObj = new doubleWindow.default(model); } else if (sysOrgCode === 'zmhjhzmy') { // 韩咀 const doubleWindow = await import('./shuangdaoFcHj.threejs'); if (doubleWindow) doubleWindowObj = new doubleWindow.default(model); } else { doubleWindowObj = new doubleWindow(model); } doubleWindowObj.mountedThree(playerDom); singleWindowXkObj.mountedThree(); singleWindowObj.mountedThree(playerDom); model.animate(); // addLight(); // startAnimation(); resolve(null); }); }; export const destroy = () => { if (model) { model.isRender = false; console.log('场景销毁前信息----------->', model.renderer?.info); model.isRender = false; doubleWindowObj.destroy(); singleWindowObj.destroy(); singleWindowXkObj.destroy(); model.destroy(); model = null; group = null; singleWindowObj = null; doubleWindowObj = null; singleWindowXkObj = null; } };