import * as THREE from 'three'; import { animateCamera, setModalCenter, updateAxisCenter } from '/@/utils/threejs/util'; import UseThree from '../../../../utils/threejs/useThree'; import Nitrogen from './nitrogen.dishang.threejs'; import { useAppStore } from '/@/store/modules/app'; // 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, // group, nitrogenObj, modalType = 'lmWindRect'; const appStore = useAppStore(); // 鼠标点击、松开事件 const mouseEvent = (event) => { event.stopPropagation(); const widthScale = appStore.getWidthScale; const heightScale = appStore.getHeightScale; // 将鼠标位置归一化为设备坐标。x 和 y 方向的取值范围是 (-1 to +1) model.mouse.x = ((-model.canvasContainer.getBoundingClientRect().left * widthScale + event.clientX) / (model.canvasContainer.clientWidth * widthScale)) * 2 - 1; model.mouse.y = -((-model.canvasContainer.getBoundingClientRect().top + event.clientY) / (model.canvasContainer.clientHeight * heightScale)) * 2 + 1; (model.rayCaster as THREE.Raycaster).setFromCamera(model.mouse, model.camera as THREE.Camera); // console.log('相机与控制器信息--->', model.camera, model.orbitControls); // updateAxisCenter(model, event); if (group) { const intersects = model.rayCaster?.intersectObjects(group.children, false) as THREE.Intersection[]; if (intersects.length > 0) { // 单道、 双道 if (modalType === 'nitrogen') { nitrogenObj.mousedownModel.call(nitrogenObj, intersects); } } console.log('99999------>', model.camera, model.orbitControls); } }; /* 添加监控数据 */ export const addText = (selectData) => { if (modalType === 'nitrogen') { return nitrogenObj.addText.call(nitrogenObj, selectData); } }; export const play = () => { if (modalType === 'nitrogen') { return nitrogenObj.play.call(nitrogenObj); } }; // 切换风窗类型 export const setModelType = (type) => { modalType = type; model.camera.position.set(-1000, 100, 500); return new Promise((resolve) => { // 显示双道风窗 if (modalType === 'nitrogen') { group = nitrogenObj.group; // setModalCenter(group); const oldCameraPosition = { x: -1000, y: 100, z: 500 }; const oldControlsPosition = { x: -10, y: 10, z: 10 }; model.scene.add(nitrogenObj.group); setTimeout(async () => { resolve(null); await animateCamera( oldCameraPosition, oldControlsPosition, // { x: -0.24658823766780538, y: 35.50352092191473, z: 83.90511756512278 }, // { x: -0.24658823766780538, y: 35.50352092191473, z: 83.90511756512278 }, // { x: 1.5582599568763913, y: -3.2828007511721147, z: 2.2606374587827234 }, { x: 0.2528210526315788, y: 38.731704155124646, z: 66.23189916897506 }, { x: 0, y: 0, z: 0 }, model, 0.8 ); }, 300); } }); }; export const mountedThree = (nitrogenNum) => { return new Promise(async (resolve) => { model = new UseThree('#nitrogen3D', '#nitrogenCss3D'); model.setEnvMap('test1'); model.renderer.toneMappingExposure = 0.8; model.canvasContainer?.addEventListener('mousedown', mouseEvent.bind(null)); nitrogenObj = new Nitrogen(model); await nitrogenObj.mountedThree(nitrogenNum); setModelType('nitrogen'); resolve(null); model.animate(); }); }; export const destroy = () => { if (model) { nitrogenObj?.destroy(); model.deleteModal(); model = null; group = null; } };