如何合并多行与threejs差距(How to merge multiple lines with

2019-10-29 04:16发布

我成功加载与代表在城市建筑物多边形数据的数据集。 所以每多边形代表一个单独的建筑。 在Threejs我可以成功地代表他们,但是当我尝试到单独的行MERG成一个几何体,所有的线路连接(我明白为什么这是有道理的,因为所有的顶点都加入到同一个集合)。

但我怎么合并这些单独的建筑多边形到一个单一的几何形状,而不必相互连接的一栋独立建筑多边形的线条?

该代码我现在所拥有的:

var geometry = new THREE.Geometry();

            for (var i = 0; i < data.length; i++) {
                var temp = new THREE.Geometry();
                var polygon = data[i];
                for (var j = 0; j < polygon.length; j++) {
                    temp.vertices.push(new THREE.Vector3(polygon[j][0], polygon[j][1], 0));
                }
                temp.vertices.push(new THREE.Vector3(polygon[0][0], polygon[0][1], 0));

                THREE.GeometryUtils.merge(geometry, temp);
            }
            scene.add(new THREE.Line(geometry, buildingMaterial, THREE.LineStrip));

数据是包含了所有的建筑物多边形数据的变量。

Answer 1:

解决了:

            var cube = new THREE.Geometry();

            for (var i = 0; i < data.length; i++) {
                var shape = new THREE.Shape(_.uniq(_.map(data[i], function(d) { return new THREE.Vector3(d[0], d[1], 100); })));
                shape.extrude({amount: 100})
                var points = shape.createPointsGeometry();
                THREE.GeometryUtils.merge(cube, shape.extrude({amount: -1 - Math.random() * 1, bevelSegments: 0, steps: 1 , bevelSegments: 0, bevelSize: 0, bevelThickness: 0}));

            }

            var mesh = new THREE.Mesh(cube, new THREE.MeshBasicMaterial({color: 0x333333, wireframe: false}));
            scene.add(mesh);


文章来源: How to merge multiple lines with gaps in threejs