导入3D模型Threejs
导入3D模型Threejs
提问于 2019-06-02 19:38:21
我试着导入一个3D模型，但我不确定我这样做的方式是否正确。
var loader = new THREE.GLTFLoader();
loader.load('./CesiumMilkTruck.gltf',
function (gltf) {
scene.add(gltf.scene);
gltf.animations;
gltf.scene;
gltf.scenes;
gltf.cameras;
gltf.asset;
},
function (xhr) {
console.log((xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
function (error) {
console.log( 'An error happened = ', error );
}
);我的html是
<script type="text/javascript" src="js/three.min.js"></script>
<script type="text/javascript" src="js/GLTFLoader.js"></script>我在这个页面下载了这个模型：
我特别下载了以下三个文件：
CesiumMilkTruck.gltf
CesiumMilkTruck.png
CesiumMilkTruck0.bin
我有这样的错误：
An error happened = SyntaxError: "JSON.parse: unexpected character at
line 7 column 1 of the JSON data" parse
file:///C:/Users/an/Desktop/master/js/GLTFLoader.js:157
load file:///C:/Users/an/Desktop/master/js/GLTFLoader.js:75
load file:///C:/Users/an/Desktop/master/js/three.min.js:715我做错了什么？
很抱歉我的问题，但这是我第一次使用Threejs。
回答 1
Stack Overflow用户
发布于 2019-06-02 20:53:55
您的GLTF模型可能有问题，可能已损坏？错误消息会让我相信GLTF文件的格式是不正确的(都是数字)。
下面是我用Threejs和Konva.js构建的飞行模拟器的代码摘录：https://github.com/mpaccione/everest_flight_sim
在下面的代码中，我加载了一个直升机模型，旋转它的线框，并将其添加到包含第一人称相机的组中，这样就好像你正在驾驶一架直升机。
我在这个项目中使用带有browserfy的commonJS模块。
const GLTFLoader = require('three-gltf-loader'),
miniModelLoader = new GLTFLoader();// Load Helicopter Model
miniModelLoader.load( './src/models/helicopter/scene.gltf', function(gltf){
miniModel = gltf.scene;
miniModel.name = "miniHeli"
miniModel.rotation.y = -90 * Math.PI / 180; // Radians
miniModel.position.set( 0, 0, 0 );
let miniModelMesh = miniModel.children[0].children[0].children[0],
miniModelMeshArr = [ miniModelMesh.children[0], miniModelMesh.children[1], miniModelMesh.children[2] ];
for (var i = miniModelMeshArr.length - 1; i >= 0; i--) {
miniModelMeshArr[i].material.wireframe = true;
}
miniHeliGroup.add( miniModel );
} )页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56414650
复制相关文章
相似问题
腾讯云开发者
