使用ThreeJS添加纹理的方法

admin

1 `0 J. k; ^4 s* p$ Z使用TextureLoader的方法，添加图片进行load

结果如下：



& h1 I( X! Z' u' q1 [ this.loader = new TextureLoader()

/ Z' A" w+ A% u9 x# l* Econst {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()




loadTexture () {
- m, v1 J; l3 t0 ~, u* {
        const headerTexture = this.loader.load('/game/res/images/head.png')
" Z/ z# H: U: \5 _# Y' B        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
        const middleTexture = this.loader.load('/game/res/images/middle.png')

" K- H' p, V0 T. }7 i! o2 n
0 @! G! w' M9 @. j+ `9 w        const headerMaterial = new MeshBasicMaterial({
            map: headerTexture
        })
        const middleMaterial = new MeshBasicMaterial({
, a: g, x7 S/ x8 V& Q% `            map: middleTexture
' r' |( e0 C& e3 t0 @1 n" N! L) W        })
        const bottomMaterial = new MeshBasicMaterial({
            map: bottomTexture
2 g7 E/ ~; T. p& I1 Y, Y        })
2 P7 W' H7 w& y! V0 n
        return {headerMaterial,middleMaterial,bottomMaterial}
    }
/ {7 x0 p: g$ e8 @3 |
8 ^) J$ K% c! g* J! O; v
6 I* T- R# X5 v/ e2 d4 u' u