Skip to content

Commit

Permalink
Examples: Improve webgpu_morphtargets_face. (#29047)
Browse files Browse the repository at this point in the history
* Examples: Improve `webgpu_morphtargets_face`.

* E2E: Update screenshot.
  • Loading branch information
Mugen87 authored Aug 1, 2024
1 parent 423f285 commit 1ae17a6
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 11 deletions.
Binary file modified examples/screenshots/webgpu_morphtargets_face.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
22 changes: 11 additions & 11 deletions examples/webgpu_morphtargets_face.html
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@

import { OrbitControls } from 'three/addons/controls/OrbitControls.js';

import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js';
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
import { KTX2Loader } from 'three/addons/loaders/KTX2Loader.js';
import { MeshoptDecoder } from 'three/addons/libs/meshopt_decoder.module.js';
Expand All @@ -50,22 +51,26 @@

const clock = new THREE.Clock();

const container = document.createElement( 'div' );
document.body.appendChild( container );

const camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 20 );
camera.position.set( - 1.8, 0.8, 3 );

const scene = new THREE.Scene();
scene.add( new THREE.HemisphereLight( 0xFFFFFF, 0x443333, 2 ) );

const renderer = new THREE.WebGPURenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.toneMapping = THREE.ACESFilmicToneMapping;
renderer.setAnimationLoop( animate );
renderer.toneMapping = THREE.ACESFilmicToneMapping;
document.body.appendChild( renderer.domElement );

container.appendChild( renderer.domElement );
await renderer.init();

const environment = new RoomEnvironment( renderer );
const pmremGenerator = new THREE.PMREMGenerator( renderer );

scene.background = new THREE.Color( 0x666666 );
scene.environment = pmremGenerator.fromScene( environment ).texture;

const ktx2Loader = await new KTX2Loader()
.setTranscoderPath( 'jsm/libs/basis/' )
Expand All @@ -89,11 +94,6 @@
const head = mesh.getObjectByName( 'mesh_2' );
const influences = head.morphTargetInfluences;

//head.morphTargetInfluences = null;

// WebGPURenderer: Unsupported texture format. 33776
head.material.map = null;

const gui = new GUI();
gui.close();

Expand All @@ -119,7 +119,7 @@
controls.target.set( 0, 0.15, - 0.2 );

const stats = new Stats();
container.appendChild( stats.dom );
document.body.appendChild( stats.dom );



Expand Down

0 comments on commit 1ae17a6

Please sign in to comment.