**我的 three.js 用的是116版本的,打开 glb 文件 报这个错
**
这是代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>pb展示</title>
</head>
<body>
<div id="junying"></div>
<script type="module">
import * as THREE from "../build/three.module.js";
import {GLTFLoader} from "./jsm/loaders/GLTFLoader.js";
import {OrbitControls} from "./jsm/controls/OrbitControls.js";
import { group } from "./utils/vehicle.js";
import {TrackballControls} from "./jsm/controls/TrackballControls.js";
var container, // dom 标签容器
stats, // 帧率检测
camera, // 相机
controls, // 相机控件
scene, // 场景
renderer; // 渲染器
init(); // 初始化
// getScene();
//
// function getScene() {
// let loader = new THREE.FileLoader().setResponseType('json');
// loader.load('./json/G1vehicle.json', (data) => {
// data.map((e) => {
// console.log(e)
// scene.add(group(e.position.x, e.position.y, e.position.z,e.rotate.x,e.rotate.y,e.rotate.z));
// })
// });
// }
function init() {
//相机设置
camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 1000);//透视摄像机
camera.position.set(0, 70, 70);
// camera.lookAt(scene.position);//设置相机方向(指向的场景对象)
//创建场景对象
scene = new THREE.Scene();
// 设置光源
//点光源
let point = new THREE.PointLight("#ffffff");
point.position.set(10000, 10000, 3000).normalize(); //点光源位置
scene.add(point); //点光源添加到场景中
let light = new THREE.DirectionalLight("#ffffff", 0.45); //从正上方(不是位置)照射过来的平行光,0.45的强度
light.position.set(5, 200, 100);
light.position.multiplyScalar(0.3);
scene.add(light);
//环境光
let light2 = new THREE.AmbientLight("#ffffff");
scene.add(light2);
// 创建渲染对象
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);//设置渲染区域尺寸
renderer.setClearColor(0xb9d3ff, 1); //设置背景颜色
junying.appendChild(renderer.domElement)
// 加载模型
var loader = new GLTFLoader();
loader.load( './D1D2/d3.glb', function ( glb ) {
console.log(glb.scene);
glb.scene.position.set(0,0,0)
scene.add(glb.scene);
}, undefined, function ( error ) {
console.error( error );
} );
// 辅助坐标系 参数250表示坐标系大小,可以根据场景大小去设置
var axisHelper = new THREE.AxesHelper(250);
scene.add(axisHelper);
// 轨迹球控制器,通过键盘和鼠标控制前后左右平移和缩放场景
controls = new TrackballControls(camera, renderer.domElement);
controls.rotateSpeed = 5.0;
controls.zoomSpeed = 5;
controls.panSpeed = 2;
controls.staticMoving = true;
window.addEventListener("resize", onWindowResize, false); // 实时监听
}
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
controls.handleResize();
}
// 执行渲染操作
function animate() {
requestAnimationFrame(animate)
renderer.render(scene,camera);//执行渲染操作
}
//创建控件对象
controls = new OrbitControls(camera,renderer.domElement);
animate();
// setInterval("animate()",2000);
</script>
<script>
</script>
<style>
body { margin: 0;overflow: hidden;}
</style>
</body>
</html>