From 70cab5fb1e9b5f6b81a9af9f9d1eef75a323dfa1 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@63.com> Date: 星期四, 30 十二月 2021 16:05:07 +0800 Subject: [PATCH] # --- static/js/app.js | 151 ++++++++++++++++++++------------------------------ 1 files changed, 61 insertions(+), 90 deletions(-) diff --git a/static/js/app.js b/static/js/app.js index fcb6f8e..921addb 100644 --- a/static/js/app.js +++ b/static/js/app.js @@ -5,6 +5,7 @@ import {OBJLoader} from './lib/OBJLoader.js'; import {StoreShelf} from './object/StoreShelf.js'; import {StoreCrn} from './object/StoreCrn.js'; +import {StoreConvey} from './object/StoreConvey.js'; import { Sky } from './object/Sky.js'; @@ -29,7 +30,7 @@ this.direction = new THREE.Vector3(); this.raycaster = null; this.prevTime = performance.now();//涓婁竴娆ender鐨勬椂闂� - this.backgroundType = false; + this.backgroundType = true; this.start = function () { this.initMain(); @@ -47,7 +48,7 @@ this.initPointLockControl(this); this.initFloor(); this.initBuilding(); - this.initTransporter(this); + this.initConvey(); } this.animate = function () { requestAnimationFrame(this.animate.bind(this)); @@ -64,80 +65,58 @@ } this.initCamera = function () { if (this.camera === null) { - //澹版槑涓�涓�忚鐩告満锛� - // 瑙嗚锛�60锛� - // 绾垫í姣攁spect:鍏ㄥ睆锛屼娇鐢ㄧ殑鏄祻瑙堝櫒鐨勫搴�/楂樺害 - //杩戝钩闈ear锛�0.1 - //杩滃钩闈㈣瑙抐ar:10000 this.camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 50000); - /* - 璁剧疆鐩告満浣嶇疆锛屾敞鎰弔hreejs涓殑鍧愭爣绯婚噰鐢ㄧ殑鏄彸鎵嬪潗鏍囩郴 - */ - // this.camera.position.x = 0; - // this.camera.position.y = 1000; - // this.camera.position.z = 600; - // //鐩告満鐨勬湞鍚� - // this.camera.lookAt(0, 0, 0); - this.camera.position.set( - 350, 1070, 1550 ); + this.camera.position.set( -350, 600, 1100 ); this.camera.lookAt( this.scene.position ); //灏嗙浉鏈烘斁鍒板満鏅腑 this.scene.add(this.camera); } else { - this.camera.position.set( - 350, 1070, 1550 ); + this.camera.position.set( -350, 600, 1100 ); this.camera.lookAt( this.scene.position ); } } this.initRenderer = function () { - this.renderer = new THREE.WebGLRenderer(); - - // this.renderer.outputEncoding = THREE.sRGBEncoding; - // this.renderer.toneMapping = THREE.ACESFilmicToneMapping; - // this.renderer.toneMappingExposure = 0.5; - - // this.renderer.outputEncoding = THREE.sRGBEncoding; - // this.renderer.shadowMap.enabled = true; - // this.renderer.toneMapping = THREE.ReinhardToneMapping; - // + this.renderer = new THREE.WebGLRenderer({ + antialias: true, + logarithmicDepthBuffer: true + }); + // this.renderer.toneMapping = THREE.CineonToneMapping; // 鑹茶皟 + this.renderer.setSize(window.innerWidth, window.innerHeight); this.renderer.setPixelRatio( window.devicePixelRatio ); - this.renderer.setSize( window.innerWidth, window.innerHeight ); + this.renderer.shadowMap.enabled = true; + this.renderer.shadowMap.type = THREE.BasicShadowMap; this.dom = document.getElementById("container"); - this.dom.appendChild( this.renderer.domElement ); - + this.dom.appendChild(this.renderer.domElement); } this.initLight = function () { - //棣栧厛娣诲姞涓幆澧冨厜 let ambient = new THREE.AmbientLight(0xffffff, 1); //AmbientLight,褰卞搷鏁翠釜鍦烘櫙鐨勫厜婧� ambient.position.set(0, 0, 0); this.addObject(ambient); - //娣诲姞骞宠鍏�,骞宠鍏夌被浼间簬澶槼鍏� - let directionalLight = new THREE.DirectionalLight(0xffffff, 0.3);//妯℃嫙杩滃绫讳技澶槼鐨勫厜婧� - directionalLight.position.set(0, 200, 0); - this.addObject(directionalLight); - //璁剧疆鐐瑰厜婧� - let pointLight1 = new THREE.PointLight(0xffffff, 0.3); - pointLight1.position.set(-500, 200, 0); - this.addObject(pointLight1); - let pointLight2 = new THREE.PointLight(0xffffff, 0.3); - pointLight2.position.set(500, 200, 0); - this.addObject(pointLight2); - // const bulbGeometry = new THREE.SphereGeometry( 0.02, 16, 8 ); - // var bulbLight = new THREE.PointLight( 0xffee88, 1, 100, 2 ); - // - // var bulbMat = new THREE.MeshStandardMaterial( { - // emissive: 0xffffee, - // emissiveIntensity: 1, - // color: 0x000000 - // } ); - // bulbLight.add( new THREE.Mesh( bulbGeometry, bulbMat ) ); - // bulbLight.position.set( -500, 22, 0 ); - // bulbLight.castShadow = true; - // this.addObject( bulbLight ); - // - // var hemiLight = new THREE.HemisphereLight( 0xddeeff, 0x0f0e0d, 0.02 ); - // this.addObject( hemiLight ); + // 娣诲姞骞宠鍏�,骞宠鍏夌被浼间簬澶槼鍏� + // let directionalLight = new THREE.DirectionalLight(0xffffff, 0.3);//妯℃嫙杩滃绫讳技澶槼鐨勫厜婧� + // directionalLight.position.set(0, 200, 0); + // this.addObject(directionalLight); + // //璁剧疆鐐瑰厜婧� + // let pointLight1 = new THREE.PointLight(0xffffff, 0.3); + // pointLight1.position.set(-500, 200, 0); + // this.addObject(pointLight1); + // let pointLight2 = new THREE.PointLight(0xffffff, 0.3); + // pointLight2.position.set(500, 200, 0); + // this.addObject(pointLight2); + + // 闃村奖鑱氬厜鐏� + let pointLight = new THREE.SpotLight(0xFFFAFA,1); + pointLight.position.set(0, 1500, 2500); + pointLight.castShadow = true; + pointLight.shadow.camera.near = 2000; + pointLight.shadow.camera.far = 10000; + pointLight.shadow.mapSize.height = 100000; + pointLight.shadow.mapSize.width = 100000; + // 灏嗘墍鏈夊垱寤虹殑鐗╀綋鍔犲叆鍒板満鏅腑鍘� + this.addObject(pointLight); } this.initOrbitControl = function () { this.orbitControl = new OrbitControls(this.camera, this.renderer.domElement); @@ -157,7 +136,8 @@ } this.initBackground = function () { if (this.backgroundType) { - this.scene.background = new THREE.Color( 0xf0f0f0 ); + // this.scene.background = new THREE.Color( 0xf0f0f0 ); + this.scene.background = new THREE.Color( 0x333333 ); } else { const cubeTextureLoader = new THREE.CubeTextureLoader(); cubeTextureLoader.setPath( '../static/img/skybox0/' ); @@ -200,7 +180,7 @@ } this.initPointLockControl = function(object){ this.controls = new PointerLockControls( this.camera, document.body ); - this.raycaster = new THREE.Raycaster( new THREE.Vector3(), new THREE.Vector3( 0, - 1, 0 ), 0, 10 ); + this.raycaster = new THREE.Raycaster( new THREE.Vector3(), new THREE.Vector3( 0, - 1, 0 ), 0, 50 ); const onKeyDown = function ( event ) { switch ( event.code ) { @@ -318,8 +298,10 @@ // const helper = new THREE.PolarGridHelper( 2000, 100 ); - const helper = new THREE.GridHelper( 8000, 300 ); - helper.position.y = - 0; + const helper = new THREE.GridHelper( 8000, 300); + helper.position.x = 1200; + helper.position.y = - 1; + helper.position.z = -2000; helper.material.opacity = 0.25; helper.material.transparent = true; this.addObject( helper ); @@ -338,34 +320,9 @@ } } } - this.initTransporter = function (object) { - // const manager = new THREE.LoadingManager(); - // new MTLLoader(manager) - // .setPath( '../static/model/obj/' ) - // .load( '13213.mtl', function ( materials ) { - // materials.preload(); - // new OBJLoader( manager ) - // .setMaterials( materials ) - // .setPath( '../static/model/obj/' ) - // .load( '13213.obj', function ( obj ) { - // obj.traverse (function (child) { - // if (child instanceof THREE.Mesh) { - // child.material = new THREE.MeshLambertMaterial({ - // color: 0xCD6839 - // }); - // } - // }); - // - // obj.scale.set(0.03, 0.03, 0.03); - // obj.rotateY(- Math.PI / 2); - // // obj.name = option.crnNo + "-body"; - // obj.position.x = 0; - // obj.position.y = 0; - // obj.position.z = 0; - // object.addObject( obj ); - // }, null, null ); - // }); - + this.initConvey = function () { + let storeConvey = new StoreConvey(this, conveyObjects.objects) + storeConvey.load(); } this.initStoreObjects = function (object) { if (this.firstTime === 1) { @@ -403,7 +360,6 @@ this.crnTasks.push(new CrnTask(crnData, this)); } else { if(!crnTask.run) { - // console.log(2) crnTask.modify(crnData); } } @@ -445,6 +401,21 @@ this.controls.getObject().position.z = 200; this.controls.lock(); } + this.mainView = function () { + this.camera.position.set( 1400, 400, 2000 ); + this.camera.lookAt( 1400, 500, 0 ); + } + this.leftView = function () { + this.camera.position.set( -3000, 300, -2000 ); + this.camera.lookAt(0, 500, -2000); + } + this.verticalView = function () { + this.camera.position.set( 1400, 6000, -1800 ); + this.camera.lookAt( 1400, 0, -1800 ); + } + this.backlView = function () { + this.initCamera(); + } }, }; -- Gitblit v1.9.1