cmptExample.js 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. import { CMPTLoader } from '../src/index.js';
  2. import {
  3. Scene,
  4. DirectionalLight,
  5. AmbientLight,
  6. WebGLRenderer,
  7. PerspectiveCamera,
  8. sRGBEncoding,
  9. PCFSoftShadowMap,
  10. } from 'three';
  11. import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
  12. let camera, controls, scene, renderer;
  13. let dirLight;
  14. init();
  15. animate();
  16. function init() {
  17. scene = new Scene();
  18. // primary camera view
  19. renderer = new WebGLRenderer( { antialias: true } );
  20. renderer.setPixelRatio( window.devicePixelRatio );
  21. renderer.setSize( window.innerWidth, window.innerHeight );
  22. renderer.setClearColor( 0x151c1f );
  23. renderer.shadowMap.enabled = true;
  24. renderer.shadowMap.type = PCFSoftShadowMap;
  25. renderer.outputEncoding = sRGBEncoding;
  26. document.body.appendChild( renderer.domElement );
  27. camera = new PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 4000 );
  28. camera.position.set( 400, 400, 400 );
  29. // controls
  30. controls = new OrbitControls( camera, renderer.domElement );
  31. controls.screenSpacePanning = false;
  32. controls.minDistance = 1;
  33. controls.maxDistance = 2000;
  34. // lights
  35. dirLight = new DirectionalLight( 0xffffff, 1.25 );
  36. dirLight.position.set( 1, 2, 3 ).multiplyScalar( 40 );
  37. dirLight.castShadow = true;
  38. dirLight.shadow.bias = - 0.01;
  39. dirLight.shadow.mapSize.setScalar( 2048 );
  40. const shadowCam = dirLight.shadow.camera;
  41. shadowCam.left = - 200;
  42. shadowCam.bottom = - 200;
  43. shadowCam.right = 200;
  44. shadowCam.top = 200;
  45. shadowCam.updateProjectionMatrix();
  46. scene.add( dirLight );
  47. const ambLight = new AmbientLight( 0xffffff, 0.05 );
  48. scene.add( ambLight );
  49. new CMPTLoader()
  50. .load( '...' )
  51. .then( res => {
  52. console.log( res );
  53. // console.log( res );
  54. // scene.add( res.scene );
  55. } );
  56. onWindowResize();
  57. window.addEventListener( 'resize', onWindowResize, false );
  58. }
  59. function onWindowResize() {
  60. camera.aspect = window.innerWidth / window.innerHeight;
  61. renderer.setPixelRatio( window.devicePixelRatio );
  62. renderer.setSize( window.innerWidth, window.innerHeight );
  63. camera.updateProjectionMatrix();
  64. }
  65. function animate() {
  66. requestAnimationFrame( animate );
  67. render();
  68. }
  69. function render() {
  70. renderer.render( scene, camera );
  71. }