PLM之家精品课程培训

PLM之家精品课程培训

联系电话:18301858168   |   QQ咨询:939801026
NX二次开发培训

NX二次开发培训

UFUN/NXOpen C++和实战案例

适合初级入门或想深入了解二次开发的工程师,本培训结合ufun,NXOpen C++,大量的实例及官方内部的开发技术。
公众号二维码

关注公众号

点击扫描二维码免费在线高清教程

课程详情
Catia二次开发培训

Catia二次开发培训

市场需求大,掌握核心技术前景广阔

Catia二次开发的市场需求大,人才稀缺。掌握开发技能潜力巨大,随着经验积累将在汽车、航空等领域有所作为。
B站二维码

在线原创B站视频

点击关注工业软件传道士主页

课程详情
Teamcenter培训

Teamcenter培训

全方位培训,从基础应用到高级开发全覆盖

涵盖用户应用基础培训、管理员基础培训、管理员高级培训及二次开发培训等全方位内容,由多年经验讲师打造。
QQ群二维码

加入同行交流

点击扫描二维码加入QQ群

课程详情
×

PLM之家plmhome公众号

课程涵盖: PLM之家所有原创视频

×

关注B站视频

所有高清视频一览无余,全部在线播放学习

×

加入PLM之家QQ群

同行交流,疑问解答,更多互助

PLM之家PLMHome-国产软件践行者

[前端框架] Threejs 基于webGL的3D开发神器

[复制链接]

2019-9-1 18:45:09 2557 0

admin 发表于 2019-9-1 18:45:09 |阅读模式

admin 楼主

2019-9-1 18:45:09

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

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

x
) S% j5 m1 [+ P( W. q+ M
. W; a" Y1 P; @
废话不多说,官网自己百度下, threejs.org ,入门很简单。# Z" U" s5 n# Y
& z! e) g* b, B
创建的javascript脚本如下
8 e  }! b: w7 Z0 e+ ]
. J4 C3 \& j" @9 }1 u" s GIF.gif
. q0 o# H5 t& Z4 c2 \[mw_shl_code=javascript,true]
6 K( c' A$ j3 C8 b7 k# G  }var scene = new THREE.Scene();
1 |& u3 [8 a. ]- z8 ^1 N, [var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
2 S$ v, |1 \# d5 \' e4 P, _6 Wvar renderer = new THREE.WebGLRenderer();6 Z8 Z! a4 G6 R
renderer.setSize(window.innerWidth, window.innerHeight);" E) J6 V( m  [" B
document.body.appendChild(renderer.domElement);
! M4 b  Z; Z2 C1 w: S0 Z+ @$ I; l( S) f0 K# I
// Refresh Issue 2 x3 H4 b) n/ z' [0 ^9 Q* n6 i
window.addEventListener('resize', function () {9 I6 p  ]. L: ^* r. _
    var width = this.window.innerWidth;
+ D2 \0 W; Y% U: \    var height = this.window.innerHeight;
  \! P8 l4 r% v2 B    render.setSize(width, height);, |) q2 C. g+ f& i
    camera.aspect = width / height;
/ ^% Y) z, s' j- P+ q$ Z    camera.updateProjectionMatrix();) P/ S* ]! {% c! a" e9 e4 o8 S2 ?% c& i
})
8 q: J& M- a/ H% w% E6 J2 Y6 a9 e. Z0 X1 X
//orbit contorls
0 a0 V- N) ?  l$ S; V; B- Fcontrols = new THREE.OrbiTControls(camera,renderer.domElement);
' U3 A' q4 q( H4 L" C; s% `) b: ]0 r3 e/ p7 I. O% e- B
//create the shape
3 S. [7 p% g) Evar geometry = new THREE.TorusGeometry(2, 1, 16, 100);* Y8 C- K2 w% S- s
//create  a meterial
: B8 A  V/ j8 _; }* Ivar material = new THREE.MeshBasicMaterial({ color: 0xffff00, wireframe: true, });3 ?  D7 c6 F4 m
//var myMaterial = [new THREE.MeshBasicMaterial({map:new THREE.TextureLoader().load('image/plmhome.png'),side:THREE.DoubleSide}),];* R& G+ u' R' i  Z& C
//var material = new THREE.MeshFaceMaterial(myMaterial);9 l3 Y0 M! [& u9 @; x

) o* T* a6 b1 Y+ U5 V- ?var cube = new THREE.Mesh(geometry, material);  n8 c' \; Q6 U' T; W
scene.add(cube);
9 J6 z# ?# w- f& f. Wcamera.position.z = 5;
! x) q6 f! M7 i; I  h4 E# R: u' s) l8 s3 \

( Q) g0 [1 v7 p# A' e
6 i! t2 O# l% J+ F4 y8 c1 @/ V& K$ z, E. E' Z) W

9 m2 {' B1 h4 ~! B5 d//rotate ; B/ T1 B; N- J
var update = function () {. o" G2 p4 y8 o+ p$ r6 Q9 \" n
    cube.rotation.x += .01;, C1 r  r2 v# i7 m* T
    cube.rotation.y += .02;
- G& z8 [; Q; B+ [/ t+ i    cube.rotation.z += .02;
" o8 W) l" V, z! s- h) n+ q}
# W* H5 L) ^. [6 g# z( l" @6 b- I( Y6 [, m9 M
var render = function () {
+ k5 |3 Q  ^. {; q3 t1 Y) y4 C    renderer.render(scene, camera);) V8 ?/ R! m$ w  x4 m: y
}6 q+ ]/ X7 I, c: z. G2 y
: i: E5 T% K6 G4 y8 x

: a. B: S9 E3 R% h9 g
  T7 [! N! l6 C5 Kvar Gameloop = function () {
6 u8 d" n3 Z( R# p% R    requestAnimationFrame(Gameloop);
: h8 h: ?! [* u& [# w( w6 G    update();8 \7 Z: A9 X& t+ |2 J+ [
    render();
* o  y, U  |' E  J5 |3 N+ F}9 ?* n6 E/ h8 J+ I% Y9 e3 V$ U: w

: f& U+ I* b) v# G2 |Gameloop();6 L4 x4 M& @! ^) x: x6 V
[/mw_shl_code]
. n' {1 U+ L4 A6 ^! d9 M' }' |3 [7 S( z( S* Z0 f% O
/ d* W- y4 F' o+ f( F
引入争取的html,
: B" s/ k, k, t
1 V6 y/ }! c" H5 h[mw_shl_code=html,true]<!DOCTYPE html>
) s, M' `  ?  o<html>
# G/ S& i+ P$ n6 C0 x; K$ ]+ m, a/ h* i0 Q' K. Q
<head>0 g3 x' H, b1 k
    <title>hello ThreeJS</title>6 g% n. w+ c- U
    <style>
- Y# [/ y0 I% [. x+ z2 B        body {* b, K4 H( e1 f, L
            margin: 0;" ^. P. l/ O) c! {8 q
        }
. t- T" k: n% D$ D/ m0 E5 @4 N& ~& a; `# A) O' b6 {/ p, F
        canvas {
/ T) C8 j# G" J' W; g0 p2 `: K3 [& Z            width: 100%;
. }1 ^3 g8 g5 J; \! r! l* T            height: 100%;
+ d! |& f3 c' G$ X$ O! G        }
, g: \" D$ t' s
3 X# x, C! e  U2 [        h1 {
; Y" r3 ]3 a& j0 O" L            color: aqua;# R9 U. [- z; L
        }3 H( W+ ?5 o4 n" [
    </style>
+ w' J  S1 A, v; \& g4 |</head>$ x7 l- @( G, g
7 a$ m3 a% @/ t" g) T
<body>
0 t! `. \+ r  w( z9 @1 u <script src="js/three.js"></script>& x" s2 ?$ o' \: ]4 N. Z
    <script src="js/OrbitControls.js"></script>
  H/ r) }' t( W! q/ c5 l( N    <script src="myjs.js"></script>/ Q% K, x" w) a  `8 i; X
  3 g6 I' ?- E, N) R" A4 v9 \

% I" ^5 w4 q8 F
2 N7 I. R1 X  i; f4 N( G1 Q6 e9 E( O
</body>) X4 l6 F3 q" X4 c0 O

: Y* J, g1 ^4 F- b! i, p( H! i</html>[/mw_shl_code]
/ S" u/ I, O# ?7 ?
. G- i* O5 `! N) ~, {5 p效果点击这里:' x3 u7 \; n. H

' o$ Y, \/ m& q: s- Nhttp://plmhome.com/doteam/lesson1.html
8 c/ j6 S1 ?. C' j5 T& l1 J9 X$ E3 p, S" z$ U; B# L" |# t$ \
2 S5 V0 q4 l  u  u3 C* n! u/ [
上海点团信息科技有限公司,承接UG NX,CATIA,CREO,Solidworks 等CAx软件,Teamcenter,3D Experience等PLM软件,工业4.0数字化软件的实施\二次开发\培训相关业务,详情QQ 939801026 Tel 18301858168 网址 www.diantuankj.com/ doTeam.tech
回复

使用道具 举报

发表回复

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

返回列表 本版积分规则

  • 发布新帖

  • 在线客服

  • 微信

  • 客户端

  • 返回顶部

  • x
    温馨提示

    本网站(plmhome.com)为PLM之家工业软件学习官网站

    展示的视频材料全部免费,需要高清和特殊技术支持请联系 QQ: 939801026

    PLM之家NX CAM二次开发专题模块培训报名开始啦

    我知道了