master

分支 (1)

管理

管理

master

verge3d-code-examples
/
webgl_loader_amf.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Verge3D webgl - AMF</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <link type="text/css" rel="stylesheet" href="main.css">
    <style>
      body {
        background-color: #999;
      }
    </style>
  </head>
  <body>
    <div id="info">
      <a href="https://www.soft8soft.com/verge3d" target="_blank" rel="noopener">Verge3D</a>
      <a href="http://amf.wikispaces.com" target="_blank" rel="noopener">AMF File format</a>
      <div>AMF loader test by <a href="https://github.com/tamarintech" target="_blank" rel="noopener">tamarintech</a></div>
      <div>Rook manufacturing file from <a href="http://amf.wikispaces.com/AMF+test+files" target="_blank" rel="noopener">AMF test files</a></div>
    </div>

    <script type="module">

      import * as v3d from '../build/v3d.module.js';

      import { OrbitControls } from './jsm/controls/OrbitControls.js';
      import { AMFLoader } from './jsm/loaders/AMFLoader.js';

      let camera, scene, renderer;

      init();

      function init() {

        scene = new v3d.Scene();
        scene.background = new v3d.Color(0x999999);

        scene.add(new v3d.AmbientLight(0x999999));

        camera = new v3d.PerspectiveCamera(35, window.innerWidth / window.innerHeight, 1, 500);

        // Z is up for objects intended to be 3D printed.

        camera.up.set(0, 0, 1);
        camera.position.set(0, - 9, 6);

        camera.add(new v3d.PointLight(0xffffff, 0.8));

        scene.add(camera);

        const grid = new v3d.GridHelper(50, 50, 0xffffff, 0x555555);
        grid.rotateOnAxis(new v3d.Vector3(1, 0, 0), 90 * (Math.PI / 180));
        scene.add(grid);

        renderer = new v3d.WebGLRenderer({ antialias: true });
        renderer.setPixelRatio(window.devicePixelRatio);
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);

        const loader = new AMFLoader();
        loader.load('./models/amf/rook.amf', function(amfobject) {

          scene.add(amfobject);
          render();

        });

        const controls = new OrbitControls(camera, renderer.domElement);
        controls.addEventListener('change', render);
        controls.target.set(0, 1.2, 2);
        controls.update();

        window.addEventListener('resize', onWindowResize, false);

      }

      function onWindowResize() {

        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();

        renderer.setSize(window.innerWidth, window.innerHeight);

        render();

      }

      function render() {

        renderer.render(scene, camera);

      }

    </script>
  </body>
</html>