gltf模型加载 与3d背景贴图

Poly Haveny

用于3d模型跟贴图下载资源

Sketchfab

里面有免费的模型

模型放到public里面

复制代码
const loader = new GLTFLoader()
      // 加载GLTF模型
      loader.load(
        '/scene.gltf',
        (gltf) => {
          // 将加载的模型添加到场景中
          scene.add(gltf.scene)
          // 现在你可以开始渲染循环了
          let angle = 0
          function animate() {
            requestAnimationFrame(animate)
            angle += 0.002
            gltf.scene.rotation.y = angle
            renderer.render(scene, camera)
          }
          animate()
        },
        // 可选:加载进度回调
        (xhr) => {
          console.log((xhr.loaded / xhr.total) * 100 + '% loaded')
        },
        // 可选:加载错误回调
        (error) => {
          console.log('An error happened', error)
        }
      )

就加载进来了

之后加载背景图。

点击右边的jpg,右键将图像另存为,放到public里面。

场景就添加进来了。

相关推荐
Martina_03211 小时前
AI生成3D场景从白模换成精模后镜头全偏了?用6步检查单位、枢轴与层级替换
图像处理·人工智能·3d·ai·自然语言处理·材质·1024程序员节
时间的情敌1 天前
Cesium 加载 3D Tiles 倾斜摄影、压平、样式设置(Vue3 实战)
vue.js·3d·cesium
AGI_Eval3 天前
AI 3D生成技术:从“可用”走向“可靠”还有多远?
人工智能·3d
翌日阳4 天前
二十分之一的压缩比:Spatial Vivid 1.0 把 3DGS 全链路参考实现按 MIT 开源了
3d·开源
Dream-Y.ocean5 天前
鸿蒙PC平台宅匠 3D 室内设计适配实战:基于 Electron 壳方案的 Three.js 双渲染引擎与参数化户型编辑器开发
javascript·3d·harmonyos
硕迪科技SOLIDWORKS5 天前
SOLIDWORKS Electrical 2027:从线束定义到2D–3D更改分析
3d·solidworks 202
DolitD5 天前
UE像素流与云渲染技术方案对比分析
3d·云原生·ue5·云计算·图形渲染
tealcwu5 天前
【Unity高级】Unity URP:构建同时支持 2D 与 3D 场景的项目完全指南
3d·unity·游戏引擎
Jmyd01235 天前
文物3D数字化的技术选型指南:从WW/T 0115标准到落地工程,一次讲透采集、建档、管理与展示
3d·系统架构·博物馆·数字展厅·博物馆数字化
Martina_03215 天前
AI生成3D模型一合并网格,材质就串色?用6步检查材质槽、UV与图集重映射
图像处理·人工智能·3d·材质·uv·游戏策划·1024程序员节