threejs 几何体阵列

参考: http://www.yanhuangxueyuan.com/Three.js_course/array.html

 

      //创建场景对象
      var scene = new THREE.Scene();
      //创建一个立方体几何对象
      var box = new THREE.BoxGeometry(10, 10, 10);
      //材质对象
      var material = new THREE.MeshLambertMaterial({
        color: 0x00ff00
      });
      box.translate(-120, -20, 0);
      // 直线阵列
      for (var x = 0; x < 10; x++) {
        //网格模型对象
        var mesh = new THREE.Mesh(box, material);
        //立方体间距15(阵列距离)
        mesh.position.set(x * 15, 0, 0);
        //网格模型添加到场景中
        scene.add(mesh);
      }

      //创建一个立方体几何对象
      var planeBox = new THREE.BoxGeometry(10, 10, 10);
      //材质对象
      var planeMaterial = new THREE.MeshLambertMaterial({
        color: 0x0000ff
      });
      //创建Object3D对象 
      var object = new THREE.Object3D();
      // 平面阵列
      for (var y = 0; y < 10; y++) {
        for (var x = 0; x < 10; x++) {
          //网格模型对象
          var mesh = new THREE.Mesh(planeBox, planeMaterial);
          //立方体间距15(阵列距离)
          mesh.position.set(x * 15, y * 15, 0);
          //网格模型添加到Object3D对象中
          object.add(mesh);
        }
      }
      // 平移所有网格模型
      object.translateX(-300);
      object.translateY(-200);
      scene.add(object);

      //创建一个立方体几何对象
      var dimBox = new THREE.BoxGeometry(10, 10, 10);
      //材质对象
      var dimMaterial = new THREE.MeshLambertMaterial({
        color: 0xff0000
      });
      //创建Object3D对象 
      var object2 = new THREE.Object3D();
      // 平面阵列
      for (var z = 0; z < 10; z++) {
        for (var y = 0; y < 10; y++) {
          for (var x = 0; x < 10; x++) {
            //网格模型对象
            var mesh = new THREE.Mesh(dimBox, dimMaterial);
            //立方体间距15(阵列距离)
            mesh.position.set(x * 15, y * 15, z * 15);
            //网格模型添加到Object3D对象中
            object2.add(mesh);
          }
        }
      }
      
      // 平移所有网格模型
      object2.translateX(200);
      object2.translateY(150);
      scene.add(object2);
      

      //点光源
      var point = new THREE.PointLight(0xffffff);
      //点光源位置
      point.position.set(400, 200, 300);
      //点光源添加到场景中
      scene.add(point);

      //环境光
      var ambient=new THREE.AmbientLight(0x444444);
      scene.add(ambient);

      var width = window.innerWidth;
      var height = window.innerHeight;
      //窗口宽高比
      var k = width / height;
      //三维场景缩放系数
      var s = 150;
      //创建相机对象
      var camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000);
      //设置相机位置
      camera.position.set(200, 300, 200);
      //设置相机方向(指向的场景对象)
      camera.lookAt(scene.position);
      
      // 创建渲染器对象
      var renderer = new THREE.WebGLRenderer();
      renderer.setSize(width, height);
      //设置背景颜色
      renderer.setClearColor(0xb9d3ff, 1);
      document.body.appendChild(renderer.domElement);
      //执行渲染操作
      renderer.render(scene, camera);

 

上一篇:threejs 园区楼栋分层展示


下一篇:STS中springmvc.xml配置文件