# Add img texture to loaded glb, threejs

**URL:** <https://discourse.threejs.org/t/add-img-texture-to-loaded-glb-threejs/53854>\
**Category:** Questions\
**Tags:** react, glb, textures\
**Created:** [July 13, 2023, 12:29pm UTC](https://discourse.threejs.org/t/add-img-texture-to-loaded-glb-threejs/53854 "2023-07-13T12:29:21Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Zaven](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/zaven/32/38097_2.png) [@Zaven](https://discourse.threejs.org/u/Zaven)\
**Post date:** [July 13, 2023, 12:29pm UTC](https://discourse.threejs.org/t/add-img-texture-to-loaded-glb-threejs/53854/1 "2023-07-13T12:29:21Z")

</div>

[materialOrginal.glb](https://discourse.threejs.org/uploads/short-url/lZYHNuRpW7mOnVkqtm5XcEkbTux.glb) (209.4 KB)  
Hey maybe My question is weird but I am new in Three js, and I need some assistance and will be grateful to get some help, I want to apply the image texture to the loaded glb file but the texture is not applying or applying partially , I’ve provided an image for the texture,glb and the screenshot how it looks in canvas

import { useEffect } from ‘react’;  
import { GLTFLoader } from ‘three/examples/jsm/loaders/GLTFLoader’

import \* as THREE from ‘three’;

import SceneInit from ‘./lib/SceneInit’;

function App() {  
useEffect(() =\> {  
const textureLoader = new THREE.TextureLoader();  
let loader = new GLTFLoader();  
let material = null;  
let root = null;  
const texture = textureLoader.load(‘/assets/stone.png’);  
texture.wrapS = THREE.RepeatWrapping  
texture.wrapT = THREE.RepeatWrapping  
texture.magFilter = THREE.LinearFilter  
texture.flipY = false  
texture.needsUpdate = true  
texture.encoding = THREE.sRGBEncoding;  
material = new THREE.MeshStandardMaterial({  
map: texture,  
toneMapped: false,  
});  
material.side = THREE.DoubleSide;  
const test = new SceneInit(‘myThreeJsCanvas’);  
//lighting  
const al = new THREE.AmbientLight(0xffffff,0.8)  
const dl = new THREE.DirectionalLight(0xffffff,0.8)  
dl.position.set(0,2,0)

```
test.initialize();
test.animate();
loader.load('/assets/materialOrginal.glb', function (glb) {
  root = glb.scene;
  root.traverse((child, key) => {
    if (child.isMesh) {
      if (child.name.includes('pol')) {
        child.material = material
        // child.material.color.setHex(0x00ff00)
      }
    }
  })
  root.scale.set(1, 1, 1)
});

setTimeout(() => {
  test.scene.add(root);
  test.scene.add(al);
  test.scene.add(dl);
}, 2000);

```

}, );

return (

  
  

  
);  
}

export default App;  
 ![Screenshot 2023-07-13 144546](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/b/a/ba7aa28d079b35b806e149bc94baa2ccc7fa6926.png)

 ![stone](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/2/02b1aaccee927ea9547884a3315300d3aeeebbc0.jpeg)

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [July 13, 2023, 2:35pm UTC](https://discourse.threejs.org/t/add-img-texture-to-loaded-glb-threejs/53854/2 "2023-07-13T14:35:42Z")

</div>

> [@Zaven](#):
>
> but the texture is not applying or applying partially

Is the model is properly UV-unwrapped? Texture is rendered on surfaces based on how you unwrap the model and scale the texture.
