Tue, 04 Apr 2017 00:47:22 +0200
web viewer 3d finished
8 | 1 | <!DOCTYPE html> |
2 | <html lang="en"><head> | |
3 | <meta http-equiv="content-type" content="text/html; charset=UTF-8"> | |
4 | <title>ScubaTools Object Viewer</title> | |
5 | <meta charset="utf-8"> | |
6 | <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> | |
7 | ||
11 | 8 | <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" /> |
9 | <link rel="stylesheet" href="stlviewer.css" /> | |
10 | <script src="https://code.jquery.com/jquery-1.12.4.js"></script> | |
11 | <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> | |
8 | 12 | |
11 | 13 | <script src="https://threejs.org/build/three.js"></script> |
14 | <script src="https://threejs.org/examples/js/loaders/STLLoader.js"></script> | |
15 | <script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script> | |
8 | 16 | |
17 | </head> | |
18 | <body> | |
19 | <div id="info"> | |
11 | 20 | <div class="listcontainer"> |
21 | <h2>Available:</h2> | |
22 | <ul id="sortable1"> | |
23 | <!-- PLACEHOLDER CYLINDERS --> | |
24 | </ul> | |
25 | </div> | |
26 | <div class="listcontainer"> | |
27 | <h2>Selected:</h2> | |
28 | <ul id="sortable2"> | |
29 | ||
30 | </ul> | |
31 | </div> | |
32 | ||
8 | 33 | <a href="https://neo-soft.org" target="_blank">NeoSoft</a> ScubaTools - |
34 | <a href="https://threejs.org/" target="_blank">three.js</a> - | |
35 | STL loader by <a href="https://github.com/aleeper" target="_blank">aleeper</a>. | |
36 | <br/> | |
37 | Left mouse: rotate camera, right mouse: move camera, middle mouse or wheel: zoom | |
11 | 38 | |
39 | ||
8 | 40 | </div> |
41 | ||
11 | 42 | <script src="stlviewer.js"></script> |
43 | ||
8 | 44 | <script> |
45 | var container; | |
46 | var camera, cameraTarget, scene, renderer; | |
47 | ||
48 | init(); | |
49 | animate(); | |
50 | ||
51 | </script><div><canvas style="width: 1589px; height: 711px;" height="711" width="1589"></canvas><div style="position: fixed; top: 0px; left: 0px; cursor: pointer; opacity: 0.9; z-index: 10000;"><canvas style="width: 80px; height: 48px; display: block;" height="48" width="80"></canvas><canvas style="width: 80px; height: 48px; display: none;" height="48" width="80"></canvas></div></div> | |
52 | ||
53 | ||
54 | </body></html> |