由网格three.js修剪的平面

时间:2016-06-18 20:33:09

标签: javascript three.js

我有一个网格,它应该代表一个“建筑物”,我想每3个单位(不同的楼层)添加平面,并用网格面修剪它们,因此它们只出现在网格内。

我该怎么做?我无法弄清楚,网格对于我来说非常复杂,因为我将平面定义为通常仅覆盖内部。

var program = new Program(reset, step)
function reset() {
    scene.clear()
    scene.add(new THREE.GridHelper(100, 1))
}
function step() {
}
program.startup()




// the points group
var spGroup;
// the mesh
var hullMesh;

generatePoints();



render();

function generatePoints() {
    // add 10 random spheres
    var points = [];
    for (var i = 0; i < 50; i++) {
        var x = Math.random() * (80 - 1) + 1     //Math.random() * (max - min) + min
        var y = Math.random() * (80 - 1) + 1
        var z = Math.random() * (80 - 1) + 1

        points.push(new THREE.Vector3(x, y, z));
    }

    spGroup = new THREE.Object3D();
    var material = new THREE.MeshBasicMaterial({
        color: 0xff0000,
        transparent: false
    });
    points.forEach(function(point) {

        var spGeom = new THREE.SphereGeometry(0.5);
        var spMesh = new THREE.Mesh(spGeom, material);
        spMesh.position.copy(point);
        spGroup.add(spMesh);
    });
    // add the points as a group to the scene
    scene.add(spGroup);

    // use the same points to create a convexgeometry
    var hullGeometry = new THREE.ConvexGeometry(points);
    hullMesh = createMesh(hullGeometry);
    scene.add(hullMesh);
}

function createMesh(geom) {

    // assign two materials
    var meshMaterial = new THREE.MeshBasicMaterial({
        color: 0x00ff00,
        transparent: true,
        opacity: 0.2
    });
    meshMaterial.side = THREE.DoubleSide;
    var wireFrameMat = new THREE.MeshBasicMaterial();
    wireFrameMat.wireframe = true;

    // create a multimaterial
    var mesh = THREE.SceneUtils.createMultiMaterialObject(geom, [meshMaterial, wireFrameMat]);

    return mesh;
}

0 个答案:

没有答案