使用ThreeJS添加纹理的方法

admin

5 ]5 p% o- G- u7 u使用TextureLoader的方法，添加图片进行load

& I3 Y7 L5 f; Y% ?! M结果如下：

$ S( ^, G1 C- c* N+ o

this.loader = new TextureLoader()

% x% J' U2 ?* i' Z9 e6 f  s' yconst {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()
  ?7 k9 H8 Y8 `- w# D2 B
3 E5 |2 u; r4 g8 [! I! ~
. I" H4 q8 V4 J/ K% J3 e) u
0 f7 C7 M5 u- V
loadTexture () {

        const headerTexture = this.loader.load('/game/res/images/head.png')
        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
, d) R# Y' {/ R" n) J0 _+ U        const middleTexture = this.loader.load('/game/res/images/middle.png')
& x6 L) C* }+ B
, B  R: l$ b3 |0 _
        const headerMaterial = new MeshBasicMaterial({
8 u4 v5 ~# C1 ?. q# |) y5 t0 H            map: headerTexture
, C5 ~) A, R  x9 [7 s0 s        })
0 s( S  X0 l+ c1 g2 ~* k3 j        const middleMaterial = new MeshBasicMaterial({
            map: middleTexture
- Y9 }) c) q$ O- |$ V! n- k        })
        const bottomMaterial = new MeshBasicMaterial({
            map: bottomTexture
        })
4 k9 n+ R* U7 d# y# T
$ D, O9 G* v& h1 n        return {headerMaterial,middleMaterial,bottomMaterial}
* L2 w+ {) V& s2 ^$ U    }


% [2 ^7 z  [2 p7 k1 N. j" {0 O