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

场景就添加进来了。

相关推荐
地球资源数据云7 小时前
从 DEM 到 3D 渲染:R 语言 rayshader 地形可视化全指南
3d·数据分析·r语言
换日线°8 小时前
前端3D炫酷展开效果
前端·3d
Funny_AI_LAB9 小时前
RAD基准重新定义多视角异常检测,传统2D方法为何战胜前沿3D与VLM?
人工智能·目标检测·3d·ai
新启航光学频率梳11 小时前
储能电池极柱深孔孔深光学3D轮廓测量-激光频率梳3D轮廓技术
科技·3d·制造
军军君011 天前
Three.js基础功能学习十三:太阳系实例上
前端·javascript·vue.js·学习·3d·前端框架·three
CG_MAGIC1 天前
Substance Painter 高效出图:贴图导出与后期优化技巧
3d·贴图·maya·substance painter·渲云渲染·3d软件
图生生1 天前
基于AI的电商产品2D转3D,降低3D建模开发成本
3d·ai
mocoding2 天前
Flutter 3D 翻转动画flip_card三方库在鸿蒙版天气预报卡片中的实战教程
flutter·3d·harmonyos
2501_948120152 天前
3D虚拟衣服动画系统关键技术的研究与实现
3d
应用市场2 天前
基于上下文感知分层深度修复的3D照片生成技术详解
3d