使用ThreeJS添加纹理的方法

admin

+ j2 Q/ X9 s) H5 S. N$ d使用TextureLoader的方法，添加图片进行load

结果如下：
( \- |; a& e& g$ v1 r1 D; T


this.loader = new TextureLoader()
8 Z+ k2 @3 q  H
const {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()
4 T; A7 W. H0 t2 {3 E
5 d0 e1 Z, s/ R$ j

# J2 n3 a: W4 R* ^0 i
loadTexture () {

        const headerTexture = this.loader.load('/game/res/images/head.png')
4 Y! e- Y- a3 _$ s/ z        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
* \$ y0 j+ |" x( E* Q/ a% r) H  t) f        const middleTexture = this.loader.load('/game/res/images/middle.png')
  x% w' @0 F5 @% W$ N* @  ~% r
) w1 O8 s- a& {  I& ?# B5 M6 n$ a; f* q
9 a3 j0 A: `" ?" O4 z        const headerMaterial = new MeshBasicMaterial({
            map: headerTexture
        })
        const middleMaterial = new MeshBasicMaterial({
            map: middleTexture
        })
        const bottomMaterial = new MeshBasicMaterial({
9 l4 r# W0 G( |. {            map: bottomTexture
! m7 C: V+ o: N6 r# \9 L        })
6 V3 P7 G+ U- g/ O8 D$ V
5 _; I5 p0 r3 Z- _) _; `        return {headerMaterial,middleMaterial,bottomMaterial}
    }
, y9 r1 G/ v+ s3 k: d1 }% K$ g, Y
( h! b' K& b( N: d% G" i
* Y" ^- T9 B( @, N6 C