gpt4 book ai didi

javascript - 如何在 three.js 中正确加载 json 模型?

转载 作者:数据小太阳 更新时间:2023-10-29 05:23:15 30 4
gpt4 key购买 nike

我很难在 three.js 中加载 JSON 模型。我制作了一个非常简单的管状模型,并在 blender 中对其进行了纹理处理。问题是每当我尝试在 three.js 中加载 json 模型时,顶点看起来很奇怪。

我试过使用不同的设置导出模型,但总是遇到同样的问题,所以我认为问题出在我的代码中。

编辑:否定。我加载了水牛模型,它看起来应该如此。知道我在 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>

我们将不胜感激。

谢谢,Jukka Korhonen

最佳答案

我在导出 JSON 模型时犯了一些严重的错误。对于所有在从 Blender 导出时遇到问题的人。我建议您检查导出设置。

对我来说,它适用于以下设置;

几何:顶点:勾选,面:勾选,法线:勾选,蒙皮:勾选

Material :全部勾选

设置:翻转 YZ:勾选

动画:变形动画

和所有mehses:检查

关于javascript - 如何在 three.js 中正确加载 json 模型?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17103999/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com