cant apply texture to glb 3d model file three js react

392 Views Asked by At

i have this 3d model glb file that has a texture but its not showing for some reason. so i tried to add the texture manually but didn't work either, but my texture image appears in my network with "Status Code: 304 Not Modified" and i can see the image for some reasong it's not applying its properties directly from the glb file not only the texture

i made it using npm gltfjsx

*i want it to just look as it appears in the source here
Source: *3D model on sketchfab

My Code
`

import "./styles.css";
import React, { useRef } from "react";
import {
  MeshDistortMaterial,
  OrbitControls,
  useGLTF,
  useTexture
} from "@react-three/drei";
import { Canvas, useFrame } from "@react-three/fiber";

function Model(props) {
  const texture = useTexture("/Material_0_baseColor.png");
  const { nodes, materials } = useGLTF("/abstractModel.glb");
  const groupRef = useRef();
  useFrame(() => (groupRef.current.rotation.y -= 0.003));

  console.log("materials:", materials);
  return (
    <mesh {...props}>
      <group {...props} dispose={null}>
        <group ref={groupRef} scale={0.03}>
          <mesh
            geometry={nodes["Hedra001_Material_#0_0"].geometry}
            material={materials.Material_0}
            a
            position={[-0.618, 0, 3.478]}
            rotation={[-Math.PI / 2, 0, 0]}
            scale={1}
          />
          <meshPhysicalMaterial map={texture} />
        </group>
      </group>
      <OrbitControls
        makeDefault
        enableZoom={false}
        minPolarAngle={Math.PI / 2}
        maxPolarAngle={Math.PI / 2}
      />
    </mesh>
  );
}
export default function App(props) {
  return (
      <Canvas>
        <Model />
      </Canvas>
  );
}

useGLTF.preload("/abstractModel.glb");

and tried the same model but with ("scene.gltf" "scene.bin", and textures -> texture.png) and didnt work too
and had a problem of not having

the code works with no errors but as i said it doesnt show the properties on the object it just appears as black 3d object
THE MODEL

WHAT MY CODE GETS

0

There are 0 best solutions below