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