How to load image in r3f canvas

[nitinrhr183]

I have loaded a png image by adding the image as a texture to a mesh by following method.

function Image() {

const texture = useLoader(THREE.TextureLoader, "image1.png");

return (

<mesh >

  <planeGeometry attach="geometry" args={[10, 7.5]} />

  <meshLambertMaterial attach="material" map={texture} />

</mesh>

);

}

Since there is a mesh involved here there is some background issues of the image involved when two images overlap. So I want a normal Image loader if exists any to load a 2d image to a scene. Please Help

[mattrossman]

What do you mean by a "normal image loader"? You can add a small position offset to overlapping images to eliminate z-fighting.