使用ThreeJS添加纹理的方法

admin

" ]: Y- K: C: y- t: Y5 Y9 N5 V使用TextureLoader的方法，添加图片进行load
' E# x4 H" N. U6 d5 `& ~- X" ?
结果如下：



this.loader = new TextureLoader()
0 Z* _8 q9 M5 f& D" \3 R2 v
const {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()


9 D( D* `) {8 F$ N8 D
+ h1 d3 l: V8 P; j0 H  O& s/ ^
loadTexture () {

        const headerTexture = this.loader.load('/game/res/images/head.png')
        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
- o' l- x/ ?. s& Q$ E        const middleTexture = this.loader.load('/game/res/images/middle.png')
! i; d$ ?" G0 q% P
( ]  S; A8 z; j7 T  I
2 Q4 T8 d# S! E6 p' I; T        const headerMaterial = new MeshBasicMaterial({
            map: headerTexture
        })
        const middleMaterial = new MeshBasicMaterial({
            map: middleTexture
        })
, t* M6 @. Y2 j. A        const bottomMaterial = new MeshBasicMaterial({
  u/ u8 Y6 X  a/ L            map: bottomTexture
        })

        return {headerMaterial,middleMaterial,bottomMaterial}
    }
+ A# y) j. W7 b% r3 Q  J
7 t; p4 B, j) R9 z7 ]( N! s
! S' Z" O; {( \5 u% m: T