Skip to content

Commit

Permalink
Improved USDZLoader example.
Browse files Browse the repository at this point in the history
  • Loading branch information
mrdoob committed Sep 28, 2023
1 parent d6c8dd0 commit 1c85c95
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 17 deletions.
Binary file modified examples/screenshots/webgl_loader_usdz.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
46 changes: 29 additions & 17 deletions examples/webgl_loader_usdz.html
Original file line number Diff line number Diff line change
Expand Up @@ -34,46 +34,58 @@
import * as THREE from 'three';

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

let camera, scene, renderer;

init();
animate();

function init() {
async function init() {

camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 0.1, 100 );
camera.position.set( 0, 0.75, - 1 );
camera.position.set( 0, 0.75, - 1.5 );

scene = new THREE.Scene();
scene.background = new THREE.Color( 0xeeeeee );

scene.add( new THREE.GridHelper( 2, 4, 0xc1c1c1, 0x8d8d8d ) );

const light = new THREE.DirectionalLight( 0xffffff, 3 );
light.position.set( 1, 1, 1 );
scene.add( light );

const light2 = new THREE.HemisphereLight( 0xffffff, 0xc1c1c1, 3 );
scene.add( light2 );

// renderer
renderer = new THREE.WebGLRenderer( { antialias: true } );
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
renderer.toneMapping = THREE.ACESFilmicToneMapping;
renderer.toneMappingExposure = 2.0;
document.body.appendChild( renderer.domElement );

const controls = new OrbitControls( camera, renderer.domElement );
controls.minDistance = 1;
controls.maxDistance = 8;
// controls.target.y = 15;
// controls.update();

const rgbeLoader = new RGBELoader()
.setPath( 'textures/equirectangular/' );

const usdzLoader = new USDZLoader()
.setPath( 'models/usdz/' );

const [ texture, model ] = await Promise.all( [
rgbeLoader.loadAsync( 'venice_sunset_1k.hdr' ),
usdzLoader.loadAsync( 'saeukkang.usdz' ),
] );

// environment

texture.mapping = THREE.EquirectangularReflectionMapping;

const loader = new USDZLoader();
loader.load( 'models/usdz/saeukkang.usdz', function ( usd ) {
scene.background = texture;
scene.backgroundBlurriness = 0.5;
scene.environment = texture;

scene.add( usd );
// model

} );
model.position.y = 0.25;
model.position.z = - 0.25;
scene.add( model );

window.addEventListener( 'resize', onWindowResize );

Expand Down

0 comments on commit 1c85c95

Please sign in to comment.