-
Notifications
You must be signed in to change notification settings - Fork 0
/
test-one.html
105 lines (88 loc) · 3.08 KB
/
test-one.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<html>
<head>
<title> Web Gui for 3D Printing </title>
</head>
<body>
<script src="js/three.min.js"></script>
<script src="js/OrbitControls.js"></script>
<style>
body {
background-color: #E6E6E6;
}
</style>
<script>
var scene, camera, renderer;
init();
animate();
function init() {
// Create new scene
scene = new THREE.Scene();
var WIDTH = window.innerWidth,
HEIGHT = window.innerHeight;
// Create and add renderer
renderer = new THREE.WebGLRenderer({antialias:true, alpha: true});
renderer.setSize(WIDTH, HEIGHT);
renderer.setClearColor( 0xE6E6E6, 1);
document.body.appendChild(renderer.domElement);
// Create and add camera
camera = new THREE.PerspectiveCamera(45, WIDTH / HEIGHT, 0.1, 20000);
camera.position.set(0,-100,50);
scene.add(camera);
// Make things nice when user resizes browser window
window.addEventListener('resize', function() {
var WIDTH = window.innerWidth,
HEIGHT = window.innerHeight;
renderer.setSize(WIDTH, HEIGHT);
camera.aspect = WIDTH / HEIGHT;
camera.updateProjectionMatrix();
});
// Create line material
material = new THREE.LineBasicMaterial({
color: 0x000000
});
// Draw the grid!
for(var i = 0; i < 101; i += 4) {
var horizontal_geometry = new THREE.Geometry();
var vertical_geometry = new THREE.Geometry();
var third_geometry = new THREE.Geometry();
var fourth_geometry = new THREE.Geometry();
horizontal_geometry.vertices.push(
new THREE.Vector3( -50, 50 - i, 0 ),
new THREE.Vector3( 50, 50 - i, 0 )
);
vertical_geometry.vertices.push(
new THREE.Vector3( -50 + i, 50, 0 ),
new THREE.Vector3( -50 + i, -50, 0 )
);
third_geometry.vertices.push(
new THREE.Vector3(0,30 , -30 + i ),
new THREE.Vector3(0,-30 , -30 + i)
);
fourth_geometry.vertices.push(
new THREE.Vector3(0,30 - i , 30 ),
new THREE.Vector3(0,30 - i , -30)
);
horizontal_line = new THREE.Line(horizontal_geometry, material);
vertical_line = new THREE.Line(vertical_geometry, material);
third_line = new THREE.Line(third_geometry, material);
fourth_line = new THREE.Line(fourth_geometry, material);
scene.add(horizontal_line);
scene.add(vertical_line);
// scene.add(third_line);
// scene.add(fourth_line);
}
var geometry = new THREE.SphereGeometry( 5, 32, 32 );
var material = new THREE.MeshLambertMaterial( {color: 0x0000ff} );
var sphere = new THREE.Mesh( geometry, material );
scene.add( sphere )
// Add mouse controls
controls = new THREE.OrbitControls(camera, renderer.domElement);
}
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
controls.update();
}
</script>
</body>
</html>