查看: 2370|回复: 0

[前端框架] 使用ThreeJS添加纹理的方法

[复制链接]

6

主题

4

回帖

60

积分

管理员

积分
60
发表于 2020-2-6 12:46:58 | 显示全部楼层 |阅读模式

请使用QQ关联注册PLM之家,学习更多关于内容,更多精彩原创视频供你学习!

您需要 登录 才可以下载或查看,没有账号?注册

×

" W% W3 |* b2 B; q使用TextureLoader的方法,添加图片进行load$ Z. A, k# S* l9 |

3 n4 `' v4 s' H/ Q1 }结果如下:5 w/ Y- s2 S7 M
8 _$ v& V8 m* W

; E! k' x: e, V; |' [. ]5 x
) ?: f: c" h  T+ \; ]& @  b, ~$ B this.loader = new TextureLoader()5 b! Y) s( |1 h1 O! a) ~( F
- h4 ~4 k, ^- c( M" h8 z' A
const {headerMaterial,middleMaterial,bottomMaterial} = this.loadTexture ()
% D. j, a* b2 |! L

' Q* \. R( c; [( {7 Z* B: d
* j9 M' i# L$ V% S4 P# @2 F; Z1 o3 z) W. [9 i5 q( ?
# a9 V9 I% U+ \$ c: G( T2 u2 Z
loadTexture () {
2 w/ {$ U: o! ?2 c. a. K
$ a  P' T+ I3 a3 y        const headerTexture = this.loader.load('/game/res/images/head.png')
" \2 d3 e6 c$ r7 D1 c        const bottomTexture = this.loader.load('/game/res/images/bottom.png')
* D% }/ r+ p% W# a% z1 O        const middleTexture = this.loader.load('/game/res/images/middle.png')
1 {! z  i* e1 j- @' X7 d6 J6 _9 h, h" ~% z" x1 V0 A1 E

3 u+ C3 d" ]+ w" }. h# s1 b        const headerMaterial = new MeshBasicMaterial({- s8 ~- O) p3 E! D* p$ T& V1 x
            map: headerTexture
' u/ C4 d" ]  \  d, Y) H        })
: ^0 O( \( l3 _3 S7 ^        const middleMaterial = new MeshBasicMaterial({
$ M. t2 c) C& `# H3 U- H+ @            map: middleTexture4 w. y% G( ~# W! u
        })
) k# t9 F3 A' y. w) v4 ?, q        const bottomMaterial = new MeshBasicMaterial({
7 ]. [5 F2 [, L  k2 {* v6 V            map: bottomTexture8 @3 R6 B2 ]/ s
        })
( @4 o! p. S# q/ Z+ A+ \7 p1 u; x& \1 k& g
        return {headerMaterial,middleMaterial,bottomMaterial}+ Z. M, w8 x9 `* S- ^, P0 `
    }
9 T) o* `; D8 e9 z
7 K5 p$ S% [% _' e) R8 K# y4 W
% i8 u2 x% t6 b, f; n
上海点团信息科技有限公司,承接UG NX,CATIA,CREO,Solidworks 等CAx软件,Teamcenter,3D Experience等PLM软件,工业4.0数字化软件的实施\二次开发\培训相关业务,详情QQ 939801026 Tel 18301858168 网址 www.doteam.tech
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

在本版发帖
关注公众号
QQ客服返回顶部