请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！
您需要 登录 才可以下载或查看，没有帐号？注册
x
& @, D2 [- s( q- q8 w2 Y
8 y1 `( N3 I6 i8 E/ c废话不多说，官网自己百度下， threejs.org ，入门很简单。
1 b" {, O. v' ]* f9 i: O" `& m- H2 t& S& W6 b) M
创建的javascript脚本如下
$ E( G9 c" `. E: P5 ^; U. o( f2 W$ K. @$ a- J4 F$ i' }9 |
9 p; @4 w* u: X5 ~
[JavaScript] 纯文本查看 复制代码
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// Refresh Issue
window.addEventListener('resize', function () {
var width = this.window.innerWidth;
var height = this.window.innerHeight;
render.setSize(width, height);
camera.aspect = width / height;
camera.updateProjectionMatrix();
})
//orbit contorls
controls = new THREE.OrbitControls(camera,renderer.domElement);
//create the shape
var geometry = new THREE.TorusGeometry(2, 1, 16, 100);
//create a meterial
var material = new THREE.MeshBasicMaterial({ color: 0xffff00, wireframe: true, });
//var myMaterial = [new THREE.MeshBasicMaterial({map:new THREE.TextureLoader().load('image/plmhome.png'),side:THREE.DoubleSide}),];
//var material = new THREE.MeshFaceMaterial(myMaterial);
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);
camera.position.z = 5;
//rotate
var update = function () {
cube.rotation.x += .01;
cube.rotation.y += .02;
cube.rotation.z += .02;
}
var render = function () {
renderer.render(scene, camera);
}
var Gameloop = function () {
requestAnimationFrame(Gameloop);
update();
render();
}
Gameloop();
8 M: m" v7 s' A3 s6 p) |, r
3 f8 ?/ i ?6 K. r' W1 H+ }& [4 {
引入争取的html，' `% n* I. h' n! r1 j: k- i
! W E) C1 t' \, a) K9 `$ s
[HTML] 纯文本查看 复制代码 <!DOCTYPE html>
<html>
<head>
<title>hello ThreeJS</title>
<style>
body {
margin: 0;
}
canvas {
width: 100%;
height: 100%;
}
h1 {
color: aqua;
}
</style>
</head>
<body>
<script src="js/three.js"></script>
<script src="js/OrbitControls.js"></script>
<script src="myjs.js"></script>
</body>
</html>
( ^% D* C9 d! z0 X效果点击这里：
1 S4 e' q6 n+ w1 j( F3 U: J) Q$ u7 t- F
http://plmhome.com/doteam/lesson1.html, `8 H& k9 L9 J# ~
& e$ W$ _" ~% v/ f* r0 @) W
: g9 }) H9 l0 o: R' U
| 
管理员
/1 
PLM之家官方群 
|小黑屋|手机版|PLM之家-工业软件数字化驱动之家-国产自主软件推进者
( 沪ICP备13003373-3 ) 
视频教程 
云课堂 
PLM之家NX工具包 
+86 18301858168 
xduniverse@qq.com 
PLM之家客服 1 
