Я пытаюсь применить цвет к текстуре с непрозрачностью, но когда я добавил некоторый код для установки цвета, он показывает ошибку "Uncaught TypeError: object.traverse не является функцией".
Код цвета:
objLoader.load( 'demo table/demo table.obj', function ( object ) {
object.traverse( function ( child ) {
if ( child instanceof THREE.Mesh ) {
child.material.ambient.setHex(0xFF0000);
child.material.color.setHex(0x00FF00);
}
} );
object.position.y = 0;
scene.add( object );
} );
приведенный выше код дает мне ошибку.
Полный код:
<body>
<div id="glFullscreen">
<canvas id="example"></canvas>
</div>
<script src="three.js"></script>
<script src="TrackballControls.js"></script>
<script src="MTLLoader.js"></script>
<script src="dat.gui.min.js"></script>
<script src="LoaderSupport.js"></script>
<script src="Detector.js"></script>
<script src="OBJLoader2.js"></script>
<script src="http://threejs.org/examples/js/loaders/OBJLoader.js"></script>
<script src="http://threejs.org/examples/js/WebGL.js"></script>
<script src="http://threejs.org/examples/js/libs/stats.min.js"></script>
<script>
'use strict';
var OBJLoader2Example = function ( elementToBindTo ) {
this.renderer = null;
this.canvas = elementToBindTo;
this.aspectRatio = 1;
this.recalcAspectRatio();
this.scene = null;
this.cameraDefaults = {
posCamera: new THREE.Vector3( 0.0, 125.0, 500.0 ),
posCameraTarget: new THREE.Vector3( 50, 0, 50 ),
near: 0.1,
far: 10000,
fov: 15
};
this.camera = null;
this.cameraTarget = this.cameraDefaults.posCameraTarget;
this.controls = null;
};
OBJLoader2Example.prototype = {
constructor: OBJLoader2Example,
initGL: function () {
this.renderer = new THREE.WebGLRenderer( {
canvas: this.canvas,
antialias: true,
autoClear: true
} );
this.renderer.setClearColor( 0xefc586 );
this.scene = new THREE.Scene();
this.camera = new THREE.PerspectiveCamera( this.cameraDefaults.fov, this.aspectRatio, this.cameraDefaults.near, this.cameraDefaults.far );
this.resetCamera();
this.controls = new THREE.TrackballControls( this.camera, this.renderer.domElement );
var ambientLight = new THREE.AmbientLight( 0x6c6c6c );
var directionalLight1 = new THREE.DirectionalLight( 0xffffff );
var directionalLight2 = new THREE.DirectionalLight( 0xffffff );
directionalLight1.position.set( -100, -50, 100 );
directionalLight2.position.set( 100, 50, -100 );
this.scene.add( directionalLight1 );
this.scene.add( directionalLight2 );
this.scene.add( ambientLight );
},
initContent: function () {
var modelName = 'demo_table';
this._reportProgress( { detail: { text: 'Loading: ' + modelName } } );
var scope = this;
var objLoader = new THREE.OBJLoader2();
var callbackOnLoad = function ( event ) {
scope.scene.add( event.detail.loaderRootNode );
console.log( 'Loading complete: ' + event.detail.modelName );
scope._reportProgress( { detail: { text: '' } } );
};
var onLoadMtl = function ( materials ) {
objLoader.setMaterials( materials );
objLoader.setModelName( modelName );
objLoader.setLogging( true, true );
objLoader.load( 'demo table/demo table.obj', function ( object ) {
object.traverse( function ( child ) {
if ( child instanceof THREE.Mesh ) {
child.material.ambient.setHex(0xFF0000);
child.material.color.setHex(0x00FF00);
}
} );
object.position.y = 0;
scene.add( object );
} );
};
objLoader.loadMtl( 'demo table/demo table.mtl', null, onLoadMtl );
},
_reportProgress: function( event ) {
var output = THREE.LoaderSupport.Validator.verifyInput( event.detail.text, '' );
console.log( 'Progress: ' + output );
},
resizeDisplayGL: function () {
this.controls.handleResize();
this.recalcAspectRatio();
this.renderer.setSize( this.canvas.offsetWidth, this.canvas.offsetHeight, false );
this.updateCamera();
},
recalcAspectRatio: function () {
this.aspectRatio = ( this.canvas.offsetHeight === 0 ) ? 1 : this.canvas.offsetWidth / this.canvas.offsetHeight;
},
resetCamera: function () {
this.camera.position.copy( this.cameraDefaults.posCamera );
this.cameraTarget.copy( this.cameraDefaults.posCameraTarget );
this.updateCamera();
},
updateCamera: function () {
this.camera.aspect = this.aspectRatio;
this.camera.lookAt( this.cameraTarget );
this.camera.updateProjectionMatrix();
},
render: function () {
if ( ! this.renderer.autoClear ) this.renderer.clear();
this.controls.update();
this.renderer.render( this.scene, this.camera );
}
};
var app = new OBJLoader2Example( document.getElementById( 'example' ) );
var resizeWindow = function () {
app.resizeDisplayGL();
};
var render = function () {
requestAnimationFrame( render );
app.render();
};
window.addEventListener( 'resize', resizeWindow, false );
console.log( 'Starting initialisation phase...' );
app.initGL();
app.resizeDisplayGL();
app.initContent();
render();
</script>
</body>
Ошибка SS: сообщение об ошибке