CODEWITHSUNDEEP
mergethree.jsgeometryrenderingmesh
sundialer
sundialer

Reputation: 33

combining several iterations of same object in different location using .add() or .merge()

I am trying to make a coil with several small loops. I have a custom function to create a single helix for each loop, and at first I was calling that within a for loop several hundred times, but it was taking too long to render and slowed down the scene.

I tried the merge function several different ways to no avail, so I'm now simply trying to combine two meshes by using the .add command. Here is my process:

(1) add the helix mesh to the total mesh

(2) move the position of the helix mesh

(3) try to add it again so that the total mesh will include both helixes

Only the second (moved) helix shows up when I say scene.add(createCoil()); in my init() function though. How do I add, or merge, several differently positioned helices into one object, geometry, mesh, or whatever, without calling a function to create a new Geometry for every iteration of the for loop?

Here is the code (I took the for loop out just to try one iteration):

function createCoil(){
var geometry = new THREE.TorusGeometry( 11, 0.5, 16, 100 );
var material = new THREE.MeshBasicMaterial( { color: 0x017FFF } );
mesh = new THREE.Mesh( geometry, material );


var clockwise = false;
var radius = 10;
var height = 3.4;
var arc = 1;
var radialSegments = 24;
var tubularSegments = 2;
var tube = 0.1;
var bottom = new THREE.Vector3();
bottom.set(radius, -height / 2, 0);
mesh2 = createHelix(clockwise, radius, height, arc, radialSegments, tubularSegments, tube, material, bottom);
mesh2.position.set(1,1,1);
mesh.add(mesh2);
for(i=1;i<=50;i++){
    mesh2.position.y=3.4*i;
    mesh.add(mesh2);
}
return mesh;
}

createHelix(...) creates a new THREE.Geometry. I have also tried this and the merge function with the helix being a THREE.Object3D

Please don't point to an answer that includes THREE.GeometryUtils.merge(geometry, otherGeometry); (...it's obsolete)

Used another link that was helpful, but I can only (1) change the position of a mesh (not geometry), and (2) only merge geometries (not meshes), within the for loop.

How do I get 500 loops of a coil into a scene without a terrible frame rate?

Please and Thanks!

Upvotes: 0

Views: 186

Answers (1)

Falk Thiele
Falk Thiele

Reputation: 4494

Use the matrix4 toolset for translation (and rotation if you want), then merge your geometrys:

var geometry = new THREE.TorusGeometry( 11, 0.5, 16, 100 );
var mergeGeometry = new THREE.Geometry();
var matrix = new THREE.Matrix4();

for( i = 1; i <= 50; i++ ) {

    matrix.makeTranslation( 0, 3.4 * i, 0 );
    mergeGeometry.merge( geometry, matrix );

}

var mesh = new THREE.Mesh( mergeGeo, material );

Upvotes: 0

Related Questions