使用ThreeJS添加纹理的方法

admin

5 W+ ]+ C  X0 `: p  g7 y使用TextureLoader的方法，添加图片进行load

结果如下：


+ ~0 Q4 Y9 w8 w8 p- I; I, K
/ P) e3 b* Q! q3 W this.loader = new TextureLoader()
8 ]  d: V1 T2 D* n& f4 [
const {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()
5 Z8 U& p* X5 E1 T$ W
% }7 W8 ^1 I2 Y) G& ~( _6 o
: b& t% Q7 r3 q. \3 ^, }9 R* s
8 H9 Z9 k& x6 j
+ @. z! L4 w% J" s% t. \6 eloadTexture () {
+ W+ Z3 c1 j- G0 W, y& P. R' s
        const headerTexture = this.loader.load('/game/res/images/head.png')
        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
; s$ h+ s7 Z! O7 Z/ d+ G        const middleTexture = this.loader.load('/game/res/images/middle.png')
. K# e3 j9 M. P6 W6 U8 L/ H

        const headerMaterial = new MeshBasicMaterial({
$ s9 ^5 H2 y5 f! T2 Z# m            map: headerTexture
        })
        const middleMaterial = new MeshBasicMaterial({
            map: middleTexture
        })
+ `9 S/ X5 S$ d2 z9 v        const bottomMaterial = new MeshBasicMaterial({
" H. ]7 D% z- b: T9 u, `            map: bottomTexture
        })

        return {headerMaterial,middleMaterial,bottomMaterial}
    }

+ T( P$ U( f3 `
6 H, i: T7 f% s( |  Q7 |4 q