123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743 |
- //import { FBXLoader } from "./FBXLoader.js";
- //import { GLTFLoader } from "three/addons/loaders/GLTFLoader.js";
- //import { MeshBasicMaterial, MeshStandardMaterial, Vector3 } from "three";
- import Vue from "vue";
- import fetchAndCombine from "../public/loader/loader";
- import { UWB } from "../public/plugin/uwb/index.js";
- import { FXAAShader } from "../public/shader/FAAXShader.js"
- import '../public/libs/tools.js'
- // 定义一个函数,接受元素ID和一个回调函数作为参数,用于处理点击事件
- window.waterMap = {}
- window.sdkInstance = null;
- window.uwbInstance = null;
- window.getsqlData = getsqlData;
- var fbxLoader1Loaded = false;
- var fbxLoader2Loaded = false;
- let textureLoader = new THREE.TextureLoader();
- let textureReady = textureLoader.load('../images/location_ready.png');
- let textureRunning = textureLoader.load('../images/location_running.png');
- let textureOffline = textureLoader.load('../images/location_offline.png');
- function getsqlData(sdkInstance, uwbInstance) {
- let g_PosArrayResult = null;
- if (g_PosArrayResult == null) {
- var sqlstr = "SELECT * FROM dat_bench_extend order by bench_id asc";
- //sqlstr = sqlstr.format(two_seconds_ago, two_seconds_ago)
- console.log(sqlstr);
- let msg = {
- cmd: "query", // server端要进行判断的
- data: {
- name: "name", // 这个无所谓怎么写,有就行
- //sql: 'select * from his_location_tadiao_result_unity limit 300'
- sql: sqlstr,
- },
- };
- // 触发事件进行从服务器获取数据
- window.vm.$socket.emit("REPT", msg, (datas) => {
- g_PosArrayResult = datas.data;
- var now = new Date();
- var two_seconds_ago = new Date(now.getTime() - 2 * 1000).Format(
- "yyyy-MM-dd hh:mm:ss.S"
- );
- var one_second_ago = new Date(now.getTime() - 1 * 1000).Format(
- "yyyy-MM-dd hh:mm:ss.S"
- );
- {
- let result = g_PosArrayResult;
- for (var item of result) {
- let x = item.x;
- let y = item.y;
- let z = item.z;
- let ang_x = 0.0;
- let ang_y = 0.0;
- let ang_z = 0.0;
- let benchType = item.bench_type
- if (item.use_fix_pos == 1) {
- x = JSON.parse(JSON.stringify(item.fix_pos_x));
- y = JSON.parse(JSON.stringify(item.fix_pos_y));
- z = JSON.parse(JSON.stringify(item.fix_pos_z));
- ang_x = JSON.parse(JSON.stringify(item.fix_angle_x));
- ang_y = JSON.parse(JSON.stringify(item.fix_angle_y));
- ang_z = JSON.parse(JSON.stringify(item.fix_angle_z));
- }
- else {
- }
- var distance = 10000.0;
- var xSubTmp = x;
- var ySubTmp = y;
- var zSubTmp = z;
- var ang_xSubTmp = ang_x;
- var ang_ySubTmp = ang_y;
- var ang_zSubTmp = ang_z;
- if (g_PosArrayResult) {
- var iCount = 0;
- for (var itemSub of g_PosArrayResult) {
- iCount++;
- var xSub = itemSub.x;
- var ySub = itemSub.y;
- var zSub = itemSub.z;
- var ang_xSub = 0.0;
- var ang_ySub = 0.0;
- var ang_zSub = 0.0;
- xSub = itemSub.fix_pos_x;
- ySub = itemSub.fix_pos_y;
- zSub = itemSub.fix_pos_z;
- ang_xSub = itemSub.fix_angle_x;
- ang_ySub = itemSub.fix_angle_y;
- ang_zSub = itemSub.fix_angle_z;
- var disTmp = Math.sqrt(Math.pow(x - xSub, 2) + Math.pow(y - ySub, 2) + Math.pow(z - zSub, 2))
- if (disTmp < distance) {
- distance = disTmp;
- xSubTmp = xSub;
- ySubTmp = ySub;
- zSubTmp = zSub;
- ang_xSubTmp = ang_xSub;
- ang_ySubTmp = ang_ySub;
- ang_zSubTmp = ang_zSub;
- }
- }
- }
- x = xSubTmp;
- y = ySubTmp;
- z = zSubTmp;
- ang_x = ang_xSubTmp;
- ang_y = ang_ySubTmp;
- ang_z = ang_zSubTmp;
- x = JSON.parse(JSON.stringify(xSubTmp));
- y = JSON.parse(JSON.stringify(ySubTmp));
- z = JSON.parse(JSON.stringify(zSubTmp));
- ang_x = JSON.parse(JSON.stringify(ang_xSubTmp));
- ang_y = JSON.parse(JSON.stringify(ang_ySubTmp));
- ang_z = JSON.parse(JSON.stringify(ang_zSubTmp));
- let card_id = item.card_id;
- let bench_id = item.bench_id;
- let show_remote_button = item.show_remote_button;
- // 添加水滴
- let benchList = window.store ? window.store.getters['benchList/getBenchList'] : [];
- let currentBench = benchList.find(b => b.id == bench_id);
- let texture = null;
- if (currentBench) {
- switch(currentBench.status) {
- case "ready":
- texture = textureReady;
- break;
- case "running":
- texture = textureRunning;
- break;
- case "offline":
- texture = textureOffline;
- break;
- default:
- texture = textureOffline;
- break;
- }
- } else {
- texture = textureOffline;
- }
-
- if (window.waterMap[bench_id]) {
- sdkInstance.sceneRenderer.scene.remove(window.waterMap[bench_id]);
- }
- // 创建精灵对象
- const geometry = new THREE.PlaneGeometry(1.2, 1.2);
- let spriteMaterial = new THREE.SpriteMaterial({
- map: texture
- });
- let uniformsA = {
- amplitude: {value: 1.0},
- color: {value: new THREE.Color(0xff2200)},
- texture: {value: texture }
- };
- // 创建着色器材质
- const shaderMaterial = new THREE.ShaderMaterial({
- uniforms: uniformsA,
- vertexShader: `varying vec2 vUv;
- uniform sampler2D texture;
- void main() {
- vUv = uv;
- vec4 t = texture2D( texture, vUv );
- gl_Position = projectionMatrix * modelViewMatrix * vec4( position.x,position.y,position.z+t.g, 1.0 );
- }`,
- fragmentShader: `varying vec2 vUv;
- uniform sampler2D texture;
- void main() {
- gl_FragColor = texture2D( texture, vUv );
- }`,
- side: THREE.DoubleSide,
- transparent: true
- })
- let sprite = new THREE.Sprite(spriteMaterial);
-
- const mesh = new THREE.Mesh(geometry, shaderMaterial);
- var customData = {
- benchId: bench_id,
- benchFlag: false,
- bShowRemoteButton: false,
- type: 'water'
- };
- mesh.userData = customData;
- // sprite.scale.set(100, 100, 1);
- mesh.position.set(x, y + 10, z);
- mesh.rotation.set(-Math.PI / 2, 0, 0);
- window.waterMap[bench_id] = mesh;
- console.log('添加模型和水滴1111')
- if (sdkInstance) {
- sdkInstance.sceneRenderer.scene.add(mesh)
- }
- };
- }
- let dracoLoader = new THREE.DRACOLoader();
- THREE.DRACOLoader.setDecoderPath("../gltf/");
- var fbxLoader1 = new THREE.GLTFLoader();
- fbxLoader1.setDRACOLoader(dracoLoader);
- if (!fbxLoader1Loaded) {
- fbxLoader1.load("../models/meshDraco.gltf", function (fbx) {
- fbxLoader1Loaded = true;
- let result = g_PosArrayResult;
- for (var item of result) {
- let x = item.x;
- let y = item.y;
- let z = item.z;
- let ang_x = 0.0;
- let ang_y = 0.0;
- let ang_z = 0.0;
- let benchType = item.bench_type
- if (item.use_fix_pos == 1) {
- x = JSON.parse(JSON.stringify(item.fix_pos_x));
- y = JSON.parse(JSON.stringify(item.fix_pos_y));
- z = JSON.parse(JSON.stringify(item.fix_pos_z));
- ang_x = JSON.parse(JSON.stringify(item.fix_angle_x));
- ang_y = JSON.parse(JSON.stringify(item.fix_angle_y));
- ang_z = JSON.parse(JSON.stringify(item.fix_angle_z));
- }
- else {
- }
-
- var distance = 10000.0;
-
- var xSubTmp = x;
- var ySubTmp = y;
- var zSubTmp = z;
- var ang_xSubTmp = ang_x;
- var ang_ySubTmp = ang_y;
- var ang_zSubTmp = ang_z;
-
- if (g_PosArrayResult) {
- var iCount = 0;
- for (var itemSub of g_PosArrayResult) {
-
- iCount++;
- var xSub = itemSub.x;
- var ySub = itemSub.y;
- var zSub = itemSub.z;
- var ang_xSub = 0.0;
- var ang_ySub = 0.0;
- var ang_zSub = 0.0;
- xSub = itemSub.fix_pos_x;
- ySub = itemSub.fix_pos_y;
- zSub = itemSub.fix_pos_z;
- ang_xSub = itemSub.fix_angle_x;
- ang_ySub = itemSub.fix_angle_y;
- ang_zSub = itemSub.fix_angle_z;
- var disTmp = Math.sqrt(Math.pow(x - xSub, 2) + Math.pow(y - ySub, 2) + Math.pow(z - zSub, 2))
- if (disTmp < distance) {
- distance = disTmp;
- xSubTmp = xSub;
- ySubTmp = ySub;
- zSubTmp = zSub;
- ang_xSubTmp = ang_xSub;
- ang_ySubTmp = ang_ySub;
- ang_zSubTmp = ang_zSub;
- }
- }
- }
-
-
- x = xSubTmp;
- y = ySubTmp;
- z = zSubTmp;
- ang_x = ang_xSubTmp;
- ang_y = ang_ySubTmp;
- ang_z = ang_zSubTmp;
- x = JSON.parse(JSON.stringify(xSubTmp));
- y = JSON.parse(JSON.stringify(ySubTmp));
- z = JSON.parse(JSON.stringify(zSubTmp));
- ang_x = JSON.parse(JSON.stringify(ang_xSubTmp));
- ang_y = JSON.parse(JSON.stringify(ang_ySubTmp));
- ang_z = JSON.parse(JSON.stringify(ang_zSubTmp));
-
- let card_id = item.card_id;
- let bench_id = item.bench_id;
- let show_remote_button = item.show_remote_button;
- if (benchType == 1) {
- console.log("控制台查看加载gltf文件返回的对象结构", fbx);
- var childMesh = childMesh = fbx.scene.children[0].children[0];
- let childMeshTmp = new THREE.Mesh(childMesh.geometry, childMesh.material)
- let scale = 5;
- childMeshTmp.scale.set(scale, scale, scale)
- //fbx.scene.children[0].scale.set(5, 5, 5)
- //fbx.scene.children[0].position.set(8.7, -1.6, 5.4)
- childMeshTmp.position.set(x, y, z)
- var Euler = new THREE.Euler(Math.PI * ang_x, Math.PI * ang_y, Math.PI * ang_z);
- //var Euler = new THREE.Euler( Math.PI*1.5, Math.PI*0, Math.PI*0);
- var quaternion = new THREE.Quaternion();
- childMeshTmp.quaternion.copy(quaternion.setFromEuler(Euler))
- var customData = {
- benchId: bench_id,
- benchFlag: true,
- bShowRemoteButton: show_remote_button == 1 ? true : false,
- };
- childMeshTmp.userData = customData;
-
- console.log('添加模型和水滴1111')
- sdkInstance.sceneRenderer.scene.add(childMeshTmp)
- }
-
- };
- })
- }
-
- var fbxLoader2 = new THREE.GLTFLoader();
- fbxLoader2.setDRACOLoader(dracoLoader);
- if (!fbxLoader2Loaded) {
- fbxLoader2.load("../models/mesh2Draco.gltf", function (fbx) {
- fbxLoader1Loaded = true;
- let result = g_PosArrayResult;
- for (var item of result) {
- let x = item.x;
- let y = item.y;
- let z = item.z;
- let ang_x = 0.0;
- let ang_y = 0.0;
- let ang_z = 0.0;
- let benchType = item.bench_type
- if (item.use_fix_pos == 1) {
- x = JSON.parse(JSON.stringify(item.fix_pos_x));
- y = JSON.parse(JSON.stringify(item.fix_pos_y));
- z = JSON.parse(JSON.stringify(item.fix_pos_z));
- ang_x = JSON.parse(JSON.stringify(item.fix_angle_x));
- ang_y = JSON.parse(JSON.stringify(item.fix_angle_y));
- ang_z = JSON.parse(JSON.stringify(item.fix_angle_z));
- }
- else {
- }
-
- var distance = 10000.0;
-
- var xSubTmp = x;
- var ySubTmp = y;
- var zSubTmp = z;
- var ang_xSubTmp = ang_x;
- var ang_ySubTmp = ang_y;
- var ang_zSubTmp = ang_z;
-
- if (g_PosArrayResult) {
- var iCount = 0;
- for (var itemSub of g_PosArrayResult) {
-
- iCount++;
- var xSub = itemSub.x;
- var ySub = itemSub.y;
- var zSub = itemSub.z;
- var ang_xSub = 0.0;
- var ang_ySub = 0.0;
- var ang_zSub = 0.0;
- xSub = itemSub.fix_pos_x;
- ySub = itemSub.fix_pos_y;
- zSub = itemSub.fix_pos_z;
- ang_xSub = itemSub.fix_angle_x;
- ang_ySub = itemSub.fix_angle_y;
- ang_zSub = itemSub.fix_angle_z;
- var disTmp = Math.sqrt(Math.pow(x - xSub, 2) + Math.pow(y - ySub, 2) + Math.pow(z - zSub, 2))
- if (disTmp < distance) {
- distance = disTmp;
- xSubTmp = xSub;
- ySubTmp = ySub;
- zSubTmp = zSub;
- ang_xSubTmp = ang_xSub;
- ang_ySubTmp = ang_ySub;
- ang_zSubTmp = ang_zSub;
- }
- }
- }
-
-
- x = xSubTmp;
- y = ySubTmp;
- z = zSubTmp;
- ang_x = ang_xSubTmp;
- ang_y = ang_ySubTmp;
- ang_z = ang_zSubTmp;
- x = JSON.parse(JSON.stringify(xSubTmp));
- y = JSON.parse(JSON.stringify(ySubTmp));
- z = JSON.parse(JSON.stringify(zSubTmp));
- ang_x = JSON.parse(JSON.stringify(ang_xSubTmp));
- ang_y = JSON.parse(JSON.stringify(ang_ySubTmp));
- ang_z = JSON.parse(JSON.stringify(ang_zSubTmp));
-
- let card_id = item.card_id;
- let bench_id = item.bench_id;
- let show_remote_button = item.show_remote_button;
-
- if (benchType == 2) {
- console.log("控制台查看加载gltf文件返回的对象结构", fbx);
- var childMesh = fbx.scene.children[0];
- let childMeshTmp = new THREE.Mesh(childMesh.geometry, childMesh.material)
- let scale = 0.05;
- childMeshTmp.scale.set(scale, scale, scale)
- //fbx.scene.children[0].scale.set(5, 5, 5)
- //fbx.scene.children[0].position.set(8.7, -1.6, 5.4)
- childMeshTmp.position.set(x, y, z)
- var Euler = new THREE.Euler(Math.PI * ang_x, Math.PI * ang_y, Math.PI * ang_z);
- //var Euler = new THREE.Euler( Math.PI*1.5, Math.PI*0, Math.PI*0);
- var quaternion = new THREE.Quaternion();
- childMeshTmp.quaternion.copy(quaternion.setFromEuler(Euler))
- var customData = {
- benchId: bench_id,
- benchFlag: true,
- bShowRemoteButton: show_remote_button == 1 ? true : false,
- };
- childMeshTmp.userData = customData;
- sdkInstance.sceneRenderer.scene.add(childMeshTmp)
- }
- };
- if (!sessionStorage.getItem('3dMode') || sessionStorage.getItem('3dMode') == 0) {
- setTimeout(() => {
- var benchPosList = [];
- for (var item of result) {
- var localPosition = new THREE.Vector3(item.fix_pos_x, item.fix_pos_y, item.fix_pos_z);
- var worldPosition = uwbInstance.convertLocalToWorld(localPosition);
- var pos = sdkInstance.getScreenPosition(worldPosition);
- benchPosList.push(
- {
- x: pos.x,
- y: pos.y,
- benchType: item.bench_type,
- benchId: item.bench_id
- }
- )
- }
- window.showBenchPos(benchPosList);
- }, 2000
- )
- }
-
-
- })
- }
-
- });
- }
- }
- // uwb 插件初始化
- function uwbInit(originPointPose) {
- console.log("=====初始化uwb 实例=====");
- const uwbIns = new UWB({
- upAxis: "y-up",
- LR: "r",
- worldPose: originPointPose,
- });
- return uwbIns;
- }
- export function uwbMain(domId, modelWidth, modelHeight, finalMode, callback) {
- console.log("uwbMain enter");
- finalMode = finalMode || "floorplan";
- var radius = 0.3;
- var height = 0.5;
- var segments = 4;
- var color = 0x00ff00;
- let g_gltf_downloaded = false;
- let composer = null;
- let box = null;
- let sqlQueryInited = false;
- let g_fbx = null;
- let g_fbxLoader = null;
- let sdkInstance = null;
- window.renderHeight = modelHeight;
- window.renderWidth = modelWidth;
- var geometry = new THREE.ConeGeometry(radius, height, segments);
- var material1 = new THREE.MeshBasicMaterial({
- color: color,
- opacity: 0.2,
- transparent: true,
- });
- fetchAndCombine().then(([err, data]) => {
- if (err) {
- console.error(err);
- console.log("模型加载出错");
- } else {
- let HousePlay = HOUSEPLAY.HousePlay;
- let playerContainer = document.getElementById(domId)
- data.container = playerContainer;
- sdkInstance = new HousePlay(data);
- window.sdkInstance = sdkInstance;
- sdkInstance.start();
- let vrBgContainer = document.getElementById("vr-bg-container");
- vrBgContainer.style.width = modelWidth + 'px'
- vrBgContainer.style.height = modelHeight + 'px'
- vrBgContainer.style.backgroundColor = 'transparent'
- window.sdkInstance.emit("endLoading", finalMode);
- window.sdkInstance.emit("modeChange", null, finalMode);
- if (!sessionStorage.getItem('3dMode') || sessionStorage.getItem('3dMode') == 0) {
- setTimeout(() => {
- var element = document.getElementById('house-player');
- var container = document.getElementById("ordinary-map")
- container.style.opacity = 1;
- let mapDom = document.getElementsByClassName("ordinary-map-container")[0];
- let style = getComputedStyle(mapDom);
- let width = parseFloat(style.width);
- let height = parseFloat(style.height);
- let ratio = 1.8;
- window.renderWidth = width * ratio;
- window.renderHeight = height * ratio;
- window.sdkInstance.sceneRenderer.updateScreenSize(width * ratio, height * ratio);
- element.style.marginLeft = ((width - (width * ratio)) / 2) + 'px';
- element.style.marginTop = ((height - (height * ratio)) / 2) + 'px';
- let playersmall = document.getElementById('playersmall')
- playersmall.appendChild(element)
- setTimeout(() => {
- window.sdkInstance.changeMode('floorplan');
- }, 1200)
- }, 1500)
- }
-
- sdkInstance.on("endLoading", (mode) => {
- console.log(mode, '-----+++++-----')
- vrBgContainer.style.display = "none";
- // 本地坐标系原点位姿
- const originPointPose = {
- worldPosition: { x: 0, y: 0, z: 0 },
- worldQuaternion: {
- x: 0,
- y: 0,
- z: 0,
- w: 1,
- },
- };
- //初始化uwb插件
- let uwbInstance = uwbInit(originPointPose);
- window.uwbInstance = uwbInstance;
- if (g_gltf_downloaded == false) {
- let ambientLight = new THREE.AmbientLight(0xffffff); //设置环境光
- sdkInstance.sceneRenderer.scene.add(ambientLight); //将环境光添加到场景中
- let pointLight = new THREE.PointLight(0xffffff, 1, 0);
- pointLight.position.set(200, 200, 200); //设置点光源位置
- sdkInstance.sceneRenderer.scene.add(pointLight); //将点光源添加至场景
- g_gltf_downloaded = true;
- }
- let ambientLight = new THREE.AmbientLight(0xffffff); //设置环境光
- sdkInstance.sceneRenderer.scene.add(ambientLight); //将环境光添加到场景中
- let pointLight = new THREE.PointLight(0xffffff, 1, 0);
- pointLight.position.set(200, 200, 200); //设置点光源位置
- sdkInstance.sceneRenderer.scene.add(pointLight); //将点光源添加至场景
- if (g_fbxLoader == null) {
- g_fbxLoader = new THREE.GLTFLoader();
- // g_fbxLoader.load("../models/mesh2.gltf", function (fbx) {
- // let ambientLight = new THREE.AmbientLight(0xffffff); //设置环境光
- // sdkInstance.sceneRenderer.scene.add(ambientLight); //将环境光添加到场景中
- // let pointLight = new THREE.PointLight(0xffffff, 1, 0);
- // pointLight.position.set(200, 200, 200); //设置点光源位置
- // sdkInstance.sceneRenderer.scene.add(pointLight); //将点光源添加至场景
- // g_fbx = fbx;
- // console.log("控制台查看加载gltf文件返回的对象结构", fbx);
- // //fbx.scene.children[0].children[0].scale.set(5, 5, 5)
- // //window.shader = new THREE.MeshStandardMaterial(fbx.scene.children[0].children[0].material);
- // //window.shader1 = new THREE.MeshStandardMaterial(fbx.scene.children[0].children[0].material);
- // });
- // if (false) {
- // sqlQueryInited = true;
- // var index = 0;
- // setTimeout(
- // function (card_id, x, y, z) {
- //
- // },
- // 500
- // );
- // }
- getsqlData(sdkInstance, uwbInstance)
- // var timerId = setInterval(function () {
- // getsqlData(sdkInstance, uwbInstance)
- // }, 1500);
- }
- // 创建物体add
- // 模型加载完成,进入模型页面,添加摆放的物体
- let canvas = document.getElementsByTagName('canvas')[0]
- canvas.style.borderRadius = "0px"
- canvas.onmousedown = (event) => {
- let mouse = new THREE.Vector2();
- let raycaster = new THREE.Raycaster();
- mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
- mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
- raycaster.setFromCamera(mouse, sdkInstance.player.camera);
- let intersects = raycaster.intersectObjects(sdkInstance.sceneRenderer.scene.children);
- if (intersects && intersects.length > 0) {
- let bFirst = true;
- let bool = false;
- let bool1 = false;
- intersects.forEach(m => {
- console.log('点击水滴', event, m && m.object && m.object.geometry && m.object.geometry.type, m.object)
- if (m.object.geometry.type != "PlaneBufferGeometry") {
- console.log('onmousedown', 111)
- if (m.object.userData && m.object.userData.benchFlag == true) {
- if (!bool) {
- bool = true;
- //m.object.material = window.shader1;
- ////m.object.scale.set(10, 10, 10)
- //m.object.scale.set(5, 5, 5)
- //outlineObj(m.object)
- // let player = document.getElementById(domId)
- // player.style.display = "none
- if (box) {
- sdkInstance.sceneRenderer.scene.remove(box);
- }
- window.handleBenchClick(m.object.userData.benchId, m.object.userData.bShowRemoteButton)
- box = new THREE.BoxHelper(m.object, '#ff0000'); //object 模型
- sdkInstance.sceneRenderer.scene.add(box)
- //let ambientLight = new THREE.AmbientLight(0xffffff); //设置环境光
- //sdkInstance.sceneRenderer.scene.add(ambientLight); //将环境光添加到场景中
- //let pointLight = new THREE.PointLight(0xffffff, 1, 0);
- //pointLight.position.set(200, 200, 200); //设置点光源位置
- //sdkInstance.sceneRenderer.scene.add(pointLight); //将点光源添加至场景
- }
- //outlineObj(m.object
- //m.object.material = FXAAShader
-
- }
- } else if (m.object.geometry.type == "PlaneBufferGeometry") {
- console.log('onmousedown', 222)
- if (m.object.userData && m.object.userData.benchFlag == true) {
- window.handleListClick(m.object.userData.benchId)
- }
- }})
- bool = false;
- bool1 = false;
- }
- }
- canvas.onmousemove = (event) => {
- let mouse = new THREE.Vector2();
- let raycaster = new THREE.Raycaster();
- mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
- mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
- raycaster.setFromCamera(mouse, sdkInstance.player.camera);
- let intersects = raycaster.intersectObjects(sdkInstance.sceneRenderer.scene.children);
- if (intersects && intersects.length > 0) {
- let bFirst = true;
- let bool = false;
- let bool1 = false;
- intersects.forEach(m => {
- if (m && m.object && (m.object.userData.type == 'water')) {
- console.log('===== bench selected =====')
- window.store.dispatch('benchList/setMouseOverBench', {
- bench_id: m.object.userData.benchId,
- pageX: event.x,
- pageY: event.y,
- status: true
- })
- } else {
- window.store.dispatch('benchList/setMouseOverBench', {
- bench_id: m.object.userData.benchId,
- pageX: event.x,
- pageY: event.y,
- status: false
- })
- }
- })
- bool = false;
- bool1 = false;
- }
- }
- return;
- let outlinePass = null;
- function outlineObj(selectedObjects) {
- composer = new THREE.EffectComposer(sdkInstance.sceneRenderer.renderer); // 特效组件
- var renderPass = new THREE.RenderPass(sdkInstance.sceneRenderer.scene, sdkInstance.player.camera);
- composer.addPass(renderPass); // 特效渲染
- outlinePass = new THREE.OutlinePass(new THREE.Vector2(window.innerWidth, window.innerHeight), sdkInstance.sceneRenderer.scene, sdkInstance.player.camera);
- composer.addPass(outlinePass); // 加入高光特效
- outlinePass.pulsePeriod = 2; //数值越大,律动越慢
- outlinePass.visibleEdgeColor.set(0xff0000); // 高光颜色
- outlinePass.hiddenEdgeColor.set(0x000000);// 阴影颜色
- outlinePass.usePatternTexture = true; // 使用纹理覆盖?
- outlinePass.edgeStrength = 5; // 高光边缘强度
- outlinePass.edgeGlow = 1; // 边缘微光强度
- outlinePass.edgeThickness = 1; // 高光厚度
- var textureLoader = new THREE.TextureLoader();
- textureLoader.load('../models/matcap.png', function (texture) {
- outlinePass.patternTexture = texture;
- texture.wrapS = THREE.RepeatWrapping;
- texture.wrapT = THREE.RepeatWrapping;
- outlinePass.selectedObjects = selectedObjects; // 需要高光的obj
- if (composer != null) {
- animate();
- }
- })
- }
- function animate() {
- requestAnimationFrame(animate);
- if (composer != null) {
- composer.render();
- }
- }
- });
- }
- sdkInstance.on("modeChange", function (currentMode, newMode) {
- if (newMode === "transitioning") {
- return;
- }
- console.log(newMode, '@@@@@@@@@@@@@')
- });
- });
- }
|