使用ThreeJS添加纹理的方法

admin

0 x2 |8 ]! Y* |, f8 D1 X使用TextureLoader的方法，添加图片进行load

结果如下：
+ e* |! ~: U  i7 f" R

1 T& U& d, B+ I; y3 _. E
) T7 `6 s- H4 ~* M2 h2 S0 S this.loader = new TextureLoader()
/ Z8 I' t3 \& G* P6 B: E
% X3 ]# V" B. E2 s( ]; V; I( P* n- _: Uconst {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()

7 d% l6 p2 I: X. T% l. x5 A


% [8 `. s; w2 b& r9 D) EloadTexture () {
8 J! L. Q/ k) S
        const headerTexture = this.loader.load('/game/res/images/head.png')
1 U7 Z' c" G! P" [3 b  {7 a        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
  d0 P$ g3 W- O3 d7 U        const middleTexture = this.loader.load('/game/res/images/middle.png')


  n2 H6 o. S( Q: Z6 b" ?# R/ H, x        const headerMaterial = new MeshBasicMaterial({
            map: headerTexture
        })
        const middleMaterial = new MeshBasicMaterial({
            map: middleTexture
* R3 ]8 {) L7 T0 g% J4 \7 e        })
' d5 N' [: ~5 R* B& G( a( @        const bottomMaterial = new MeshBasicMaterial({
- h2 M0 _2 q2 [7 y1 w9 d' v; V            map: bottomTexture
        })
4 l! D4 c* t$ J( J- E
% Y* {! p9 f: u0 X% i+ P        return {headerMaterial,middleMaterial,bottomMaterial}
* L: Z7 ~- h& b& \/ [( @    }
$ N3 e- B" X! L4 g