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

07-12 1864阅读

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)
        }
      )

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

就加载进来了

之后加载背景图。

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

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

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

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

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

场景就添加进来了。

VPS购买请点击我

文章版权声明:除非注明,否则均为主机测评原创文章,转载或复制请以超链接形式并注明出处。

目录[+]