From c07eafd8248f9035d3c72b298caf92128c3c92b5 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@63.com> Date: 星期一, 03 一月 2022 10:01:24 +0800 Subject: [PATCH] # --- static/js/app.js | 29 ++++++++++++++++++++--------- 1 files changed, 20 insertions(+), 9 deletions(-) diff --git a/static/js/app.js b/static/js/app.js index 5cc0647..3600009 100644 --- a/static/js/app.js +++ b/static/js/app.js @@ -5,6 +5,7 @@ import { RenderPass } from './lib/postprocessing/RenderPass.js'; import { ShaderPass } from './lib/postprocessing/ShaderPass.js'; import { OutlinePass } from './lib/postprocessing/OutlinePass.js'; +import { FXAAShader } from './lib/postprocessing/FXAAShader.js'; import {MTLLoader} from './lib/MTLLoader.js'; import {OBJLoader} from './lib/OBJLoader.js'; import {StoreShelf} from './object/StoreShelf.js'; @@ -52,7 +53,7 @@ this.initLight(); this.initReSize(this); this.initOutLine(); - this.initComposer(); + // this.initComposer(); this.initObjectSelect(); this.initPointLockControl(this); this.initFloor(); @@ -62,7 +63,11 @@ this.animate = function () { requestAnimationFrame(this.animate.bind(this)); this.stats.begin(); - this.renderer.render(this.scene, this.camera); + if (this.composer) { + this.composer.render(); + } else { + this.renderer.render(this.scene, this.camera); + } this.firstPersonMove(); this.initStoreObjects(this); this.stats.end(); @@ -92,7 +97,7 @@ // this.renderer.toneMapping = THREE.CineonToneMapping; // 鑹茶皟 this.renderer.setSize(window.innerWidth, window.innerHeight); this.renderer.setPixelRatio( window.devicePixelRatio ); - this.renderer.shadowMap.enabled = false; + this.renderer.shadowMap.enabled = true; this.renderer.shadowMap.type = THREE.BasicShadowMap; this.dom = document.getElementById("container"); this.dom.appendChild(this.renderer.domElement); @@ -189,18 +194,24 @@ } this.initOutLine = function(){ this.outlinePass = new OutlinePass( new THREE.Vector2( window.innerWidth, window.innerHeight ), this.scene, this.camera ) - this.outlinePass.edgeStrength = 10;//鍖呭洿绾挎祿搴� - this.outlinePass.edgeGlow = 0.1;//杈圭紭绾胯寖鍥� - this.outlinePass.edgeThickness = 1;//杈圭紭绾挎祿搴� - this.outlinePass.pulsePeriod = 2;//鍖呭洿绾块棯鐑佽瘎鐜� - this.outlinePass.visibleEdgeColor.set('#B31985');//鍖呭洿绾块鑹� - this.outlinePass.hiddenEdgeColor.set('#190a05');//琚伄鎸$殑杈圭晫绾块鑹� + // this.outlinePass.edgeStrength = 1;//鍖呭洿绾挎祿搴� + // this.outlinePass.edgeGlow = 0.1;//杈圭紭绾胯寖鍥� + // this.outlinePass.edgeThickness = 1;//杈圭紭绾挎祿搴� + // this.outlinePass.pulsePeriod = 2;//鍖呭洿绾块棯鐑佽瘎鐜� + // this.outlinePass.visibleEdgeColor.set('#B31985');//鍖呭洿绾块鑹� + // this.outlinePass.hiddenEdgeColor.set('#190a05');//琚伄鎸$殑杈圭晫绾块鑹� } this.initComposer = function(){ this.composer = new EffectComposer(this.renderer); const renderPass = new RenderPass( this.scene, this.camera ); this.composer.addPass( renderPass ); this.composer.addPass(this.outlinePass); + + const pixelRatio = this.renderer.getPixelRatio(); + this.fxaaPass = new ShaderPass( FXAAShader ); + this.fxaaPass.material.uniforms[ 'resolution' ].value.x = 1 / ( this.dom.offsetWidth * pixelRatio ); + this.fxaaPass.material.uniforms[ 'resolution' ].value.y = 1 / ( this.dom.offsetHeight * pixelRatio ); + this.composer.addPass( this.fxaaPass ); } this.initObjectSelect = function(){ new ObjectSelect(this.scene, this.camera, this.outlinePass); -- Gitblit v1.9.1