如何正确加载three.js中的json模型？ [英] How to load json models in three.js properly?
问题描述
我很难在three.js中加载JSON模型。我做了一个非常简单的管状模型，并在搅拌机中进行了纹理处理。问题在于，每当我尝试在three.js中加载json模型时，顶点看起来都很奇怪。
I'm having a hard time loading JSON models in three.js. I'v made a very simple tube-like model and textured it in blender. The issue is that whenever i try to load the json model in three.js, the vertexes looks weird.
我尝试使用不同的设置导出模型但总是得到同样的问题，所以我认为问题出在我的代码中。
I'v tried exporting model with different settings but got always the same problem, so i think the problem is within my code.
编辑：否定。我加载了水牛模型，看起来应该是这样。知道我在搅拌机里做错了什么吗？
Negative. I loaded buffalo model and it looked like it should. Any idea what i'm doing wrong inside blender?
<html>
<head>
<style>
canvas {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<script src="threejs/three.min.js"></script>
<script>
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
var loader = new THREE.JSONLoader();
loader.load( "models/test.js", modelToScene );
var ambientLight = new THREE.AmbientLight(0x111111);
scene.add(ambientLight);
var light = new THREE.PointLight( 0xFFFFDD );
light.position.set( -15, 10, 15 );
scene.add( light );
function modelToScene( geometry, materials ) {
var material = new THREE.MeshFaceMaterial( materials );
obj = new THREE.Mesh( geometry, material );
obj.scale.set(1,1,1);
scene.add( obj );
}
camera.position.z = 5;
camera.position.y = 1;
var render = function () {
requestAnimationFrame(render);
obj.rotation.y += 0.01;
obj.rotation.x += 0.02;
renderer.render(scene, camera);
};
render();
</script>
</body>
任何帮助将不胜感激。
any help will be appreciated.
谢谢，Jukka Korhonen
Thanks, Jukka Korhonen
推荐答案
我犯了一些残酷的错误导出JSON模型。对于那些从Blender出口有问题的人。我建议你查看你的导出设置。
I have made some brutal mistakes exporting JSON models. For all those who'r having issues with exporting from Blender. I suggest you to check out your exporting settings.
对我来说，它适用于以下设置;
for me, it worked with following setup;
几何：
顶点：check，Faces：check，normals：check，skinning：check
geometry: Vertices: check, Faces: check, normals: check, skinning: check
材料：全部检查
设置：翻转YZ：检查
动画：变形动画
和所有mehses：check
and all mehses: check
这篇关于如何正确加载three.js中的json模型？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
