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

场景就添加进来了。

相关推荐
二狗哈12 小时前
Cesium快速入门18:Entity材质设置
3d·webgl·材质·cesium·地图可视化
二狗哈18 小时前
Cesium快速入门19:Entity折线材质
3d·webgl·材质·cesium·地图可视化
kk哥889919 小时前
从建模到渲染:C4D 2025 全流程 3D 创作提升最新版本下载安装步骤
3d
zl_vslam19 小时前
SLAM中的非线性优-3D图优化之相对位姿g2o::EdgeSE3Expmap(十)
人工智能·算法·计算机视觉·3d
二狗哈19 小时前
Cesium快速入门17:与entity和primitive交互
开发语言·前端·javascript·3d·webgl·cesium·地图可视化
杀生丸学AI1 天前
【无标题】VGGT4D:用于4D场景重建的视觉Transformer运动线索挖掘
人工智能·深度学习·3d·aigc·transformer·三维重建·视觉大模型
东芝、铠侠总代136100683932 天前
为高精度3D打印打造高性价比的——东芝TB67S579FTG
3d·步进电机
拉姆哥的小屋2 天前
突破传统PINN瓶颈:基于LSTM-格林函数的3D瞬态温度场智能预测新方法
人工智能·3d·lstm
二狗哈2 天前
Cesium快速入门16:Primitive多个实体与颜色修改
3d·webgl·cesium·地图可视化
CG_MAGIC2 天前
云渲染时代的选择:Blender与KeyShot对比及指南
3d·blender·效果图渲染·建模教程·渲云渲染·keyshot