jSON对象

Question

我在我的自定义项目中使用three.js将HTML5画布导出为3D预览。 我的预期结果是纹理应该只放在正面。 但是，它出现在各方面。

我的代码：

var scene, renderer, camera;
var controls;
init();
animate();

function init()
{
var width = window.innerWidth;
var height = window.innerHeight;

renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize (width, height);
renderer.setClearColor (0x888888);
document.body.appendChild (renderer.domElement);

scene = new THREE.Scene();

camera = new THREE.PerspectiveCamera (45, width/height, 1, 10000);
camera.position.y = 120;
camera.position.z = 120;
camera.lookAt (new THREE.Vector3(0,0,0));

controls = new THREE.OrbitControls (camera, renderer.domElement);

var hemiLight = new THREE.HemisphereLight( 0xffffff, 0xffffff, 0.6 );
hemiLight.color.setHSL( 0.6, 1, 0.6 );
hemiLight.groundColor.setHSL( 0.095, 1, 0.75 );
hemiLight.position.set( 0, 500, 0 );
scene.add( hemiLight );

var ambientLight = new THREE.AmbientLight (0xffffff);
scene.add(ambientLight);

//manager
var manager = new THREE.LoadingManager();
manager.onProgress = function (item, loaded, total) {
console.log( item, loaded, total );
};

var texture = new THREE.Texture();
var loader = new THREE.ImageLoader( manager );
loader.load( 'texturemug.jpg', function ( image ) {
console.log('load image');
texture.image = image;
texture.needsUpdate = true;
});

var loader = new THREE.ObjectLoader(manager);
loader.load ('shirt.json', function ( obj ) {
obj.traverse( function (child) {
if ( child instanceof THREE.Mesh ) {
child.material.map = texture;
child.material.needsUpdate = true;
}
});
scene.add( obj );
});
}

function animate()
{
controls.update();
requestAnimationFrame ( animate ); 
renderer.render (scene, camera);
}

但是，我得到了意想不到的输出。如下，

Answer 1

我会考虑在混合器中查看您使用的模型是如何与该纹理映射的。并且还要检查您用作纹理的图像是否未旋转或翻转