webgl_loader_3dm.html 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>three.js webgl - loaders - Rhino 3DM loader</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. <link type="text/css" rel="stylesheet" href="main.css">
  8. </head>
  9. <body>
  10. <div id="info">
  11. <a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> - Rhino 3DM loader
  12. </div>
  13. <script type="module">
  14. import * as THREE from '../build/three.module.js';
  15. import { OrbitControls } from './jsm/controls/OrbitControls.js';
  16. import { Rhino3dmLoader } from './jsm/loaders/3DMLoader.js';
  17. var container, controls;
  18. var camera, scene, renderer;
  19. init();
  20. animate();
  21. function init() {
  22. THREE.Object3D.DefaultUp = new THREE.Vector3(0,0,1);
  23. container = document.createElement( 'div' );
  24. document.body.appendChild( container );
  25. camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
  26. camera.position.set(26,-40,5)
  27. scene = new THREE.Scene();
  28. scene.add( new THREE.HemisphereLight() );
  29. scene.add( new THREE.AmbientLight() );
  30. var directionalLight = new THREE.DirectionalLight( 0xffeedd );
  31. directionalLight.position.set( 0, 0, 2 );
  32. scene.add( directionalLight );
  33. var loader = new Rhino3dmLoader( );
  34. loader.setLibraryPath('jsm/libs/rhino3dm/');
  35. loader.load( 'models/3dm/hello_mesh.3dm', function ( object ) {
  36. scene.add( object );
  37. } );
  38. renderer = new THREE.WebGLRenderer();
  39. renderer.setPixelRatio( window.devicePixelRatio );
  40. renderer.setSize( window.innerWidth, window.innerHeight );
  41. container.appendChild( renderer.domElement );
  42. controls = new OrbitControls( camera, renderer.domElement );
  43. window.addEventListener( 'resize', resize, false );
  44. }
  45. function resize() {
  46. camera.aspect = window.innerWidth / window.innerHeight;
  47. camera.updateProjectionMatrix();
  48. renderer.setSize( window.innerWidth, window.innerHeight );
  49. }
  50. function animate() {
  51. controls.update();
  52. renderer.render( scene, camera );
  53. requestAnimationFrame( animate );
  54. }
  55. </script>
  56. </body>
  57. </html>
粤ICP备19079148号