使用ThreeJS添加纹理的方法

admin

使用TextureLoader的方法，添加图片进行load
! h' ~7 y" _" p: \: G, T
结果如下：


) W* f$ G9 ~6 ~$ d+ ^
' M+ q' Y5 V2 f8 F- k5 J this.loader = new TextureLoader()

1 p  Q% C: g' f4 bconst {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()



7 e. q  z# a& E$ C/ M* H
0 ^6 C9 o+ w4 z' l0 z+ @loadTexture () {

% M3 z) q2 U" k; A        const headerTexture = this.loader.load('/game/res/images/head.png')
3 k- B$ T- b2 y9 I1 h/ I) b5 m        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
        const middleTexture = this.loader.load('/game/res/images/middle.png')
2 |1 C4 Q  B1 B" k7 B/ e1 q" o6 ~

! L* A3 x; E1 O+ {        const headerMaterial = new MeshBasicMaterial({
            map: headerTexture
  L+ K* U" H: B3 k. {        })
        const middleMaterial = new MeshBasicMaterial({
            map: middleTexture
        })
4 H' s; P$ o  m+ Z& _; b        const bottomMaterial = new MeshBasicMaterial({
            map: bottomTexture
2 K7 `& \3 ?* D/ H8 j! V# B" ~        })

7 k- m: w4 W0 T' L& J* K        return {headerMaterial,middleMaterial,bottomMaterial}
    }