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里面。

场景就添加进来了。

相关推荐
学术小李15 小时前
3D Gaussian Splatting中梯度反传求偏导的推导
3d
蓝鲨硬科技17 小时前
任利锋的“造物”野心,让AI 3D进入“可制造”时代
人工智能·3d·制造
cxoptics2 天前
3D电影用的偏振眼镜原理是什么?
3d
我才是银古2 天前
OpenCSG.NET:一个 .NET CSG 几何建模库的技术剖析
3d·dwg·csg
迁移科技2 天前
周转箱拆垛码垛自动化实战:3D视觉实现 ±2mm 毫米级稳定作业
3d·自动化·视觉检测
a1117763 天前
汽车3D配置器 THreeJS 开源项目
前端·3d·html·汽车
dalong103 天前
WPF:3D正八面体自动旋转
3d·wpf
数字新视界3 天前
3D数字化孪生管理解决方案
物联网·3d·数字孪生·3d可视化
宇擎智脑科技3 天前
img2threejs 架构深度解析:AI 如何高效地从图片“雕刻“3D 模型
人工智能·3d·agent