three.js加载车模型

<template>
    <div style="position:relative;">
        <div ref="containerRef"
             :style="{width:container.width+'px',height:container.height+'px',background:container.color}"
             class="container">
            <div v-show="progress<100" style="position: absolute;top:50%;left:50%;width:400px;">
                <el-progress :percentage="progress" :stroke-width="15" striped/>
            </div>
            <el-button style="position:absolute;left:30px;top:100px" @click="down()">下载</el-button>
        </div>
    </div>
</template>
<script setup>
import * as THREE from 'three';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls';  //引入扩展库
import { GUI } from 'three/addons/libs/lil-gui.module.min.js'; //引入GUI库
//背景
const container = reactive({
    width: 1920,
    height: 900,
    color: '#5cb85c'
});
//画布
const canvas = reactive({
    width: 1920,
    height: 900,
    color: 0x444444,
    alpha: 1//透明度
});
//相机 视野角度（FOV） 长宽比（aspect）近截面（near），远截面（far） lookAt指向
const cameraOpt = reactive({
    fov: 75,
    near: 0.1,
    far: 1000,
    position: {
        x: 200,
        y: 200,
        z: 200
    },
    lookAt: {
        x: 0,
        y: 0,
        z: 0
    }
});
//添加点光源
const pointOpt = reactive({
    color: 0xffffff,
    intensity: 1.0,
    decay: 0.0,
    position: {
        x: 100,
        y: 100,
        z: 100
    },
    isOpen: true
});
//添加环境光
const ambientOpt = reactive({
    color: 0xffffff,
    intensity: 1.0,
    isOpen: true
});
//添加平行光
const directionOpt = reactive({
    color: 0xffffff,
    intensity: 1.0,
    position: {
        x: 100,
        y: 100,
        z: 100
    },
    isOpen: true
});
//辅助工具--坐标轴
const axesOpt = reactive({
    size: 150,
    isOpen: true
});
//辅助工具--点光源
const pointHelper = reactive({
    sphereSize: 1,
    isOpen: true
});
//---动画设置----
const animateOpt = reactive({
    isOpen: false,
    start: () => {
    },
    stop: () => {
    }
});
// 初始化场景
const scene = new THREE.Scene();
//-------初始化相机 （透视摄像机）------
const camera = new THREE.PerspectiveCamera(cameraOpt.fov, canvas.width / canvas.height, cameraOpt.near, cameraOpt.far);
//调摄像机的位置
camera.position.set(cameraOpt.position.x, cameraOpt.position.y, cameraOpt.position.z);
//------初始化渲染器------
const renderer = new THREE.WebGLRenderer({
    antialias: true,//开启抗锯齿
    //想把canvas画布上内容下载到本地，需要设置为true
    preserveDrawingBuffer: true
});
// 获取你屏幕对应的设备像素比.devicePixelRatio告诉threejs,以免渲染模糊问题
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setClearColor(canvas.color, canvas.alpha); //设置背景颜色
renderer.setSize(canvas.width, canvas.height);
//相机指向
camera.lookAt(cameraOpt.lookAt.x, cameraOpt.lookAt.y, cameraOpt.lookAt.z);
//添加相机轨道
const controls = new OrbitControls(camera, renderer.domElement);
// 挂载完毕 获取dom
const containerRef = ref();
//========光源============
//点光源
const pointLight = new THREE.PointLight(pointOpt.color, pointOpt.intensity);
pointLight.decay = pointOpt.decay;  //随着距离光源强度衰减
pointLight.position.set(pointOpt.position.x, pointOpt.position.y, pointOpt.position.z);  //光源位置
if (pointOpt.isOpen) (scene.add(pointLight));
//环境光:没有特定方向，整体改变场景的光照明暗
const ambient = new THREE.AmbientLight(ambientOpt.color, ambientOpt.intensity);
if (ambientOpt.isOpen) (scene.add(ambient));
// 平行光
const directionalLight = new THREE.DirectionalLight(directionOpt.color, directionOpt.intensity);
// 设置光源的方向：通过光源position