index.html 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>JS.BLEND Example</title>
  5. <script type="text/javascript" src="./build/js.blend.js"></script>
  6. <script type="text/javascript" src="./example/three.js"></script>
  7. <script type="text/javascript" src="./example/orbit_controls.js"></script>
  8. </head>
  9. <body>
  10. <script type="text/javascript">
  11. //threes js code
  12. var scene = new THREE.Scene();
  13. scene.background = new THREE.Color(0.5, 0.2, 0.5);
  14. var camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.1, 100);
  15. var renderer = new THREE.WebGLRenderer();
  16. renderer.setSize(window.innerWidth, window.innerHeight);
  17. document.body.appendChild(renderer.domElement);
  18. function render() {
  19. renderer.render(scene, camera);
  20. }
  21. //camera.rotation.y = 90;
  22. camera.position.z = 10;
  23. controls = new THREE.OrbitControls(camera, renderer.domElement);
  24. controls.addEventListener('change', render); // remove
  25. controls.enableZoom = true;
  26. var light = new THREE.PointLight(0xFFFFFF, 0.8, 1000);
  27. light.position.set(0, 0, 10);
  28. //scene.add(light);
  29. var light = new THREE.PointLight(0xFFFFFF, 0.8, 0);
  30. light.position.set(0, 0, -10);
  31. //scene.add(light);
  32. JSBLEND('./example/test.blend').then((blend) => {
  33. blend.three.loadScene(scene);
  34. render();
  35. }).catch((error)=>{
  36. console.log(error);
  37. });
  38. </script>
  39. </body>
  40. </html>