How can I take 2 separate buffer geometries, and simply merge/combine them into one BufferGeometry in three.js which can also carry over all of the skinned attributes, uvs, vertices, etc?
I've been trying to find a solution to this because the default tools in three.js seem not to work, or they scramble certain parts of the geometry.
Throughout the history of three.js, there have been changes in the default geometry class, causing discrepancies and problems in how the tools and utils revolving them are used. At this time, the latest geometry is the BufferGeometry class. When most people see the BufferGeometry.merge() or BufferGeometryUtils.mergeBufferGeometries() functions, usually, all they want to do is simply combine two models into one. This may be a little dramatic, but I can proudly say that I have created a function which will take all of the attributes of a geometry whether it be skin weights, vertex positions, uvs, etc. and apply them in the output merged geometry.
Warning: Keep in mind that if the geometry is not designed for a skinned mesh, you may have to alter the array of attributes to remove unneeded ones.
MergeGeometry(geo1, geo2) {
var attributes = ["normal", "position", "skinIndex", "skinWeight"];
var dataLengths = [3, 3, 4, 4];
var geo = new THREE.BufferGeometry();
for (var attIndex = 0; attIndex < attributes.length; attIndex++) {
var currentAttribute = attributes[attIndex];
var geo1Att = geo1.getAttribute(currentAttribute);
var geo2Att = geo2.getAttribute(currentAttribute);
var currentArray = null;
if (currentAttribute == "skinIndex") currentArray = new Uint16Array(geo1Att.array.length + geo2Att.array.length)
else currentArray = new Float32Array(geo1Att.array.length + geo2Att.array.length)
var innerCount = 0;
geo1Att.array.map((item) => {
currentArray[innerCount] = item;
innerCount++;
});
geo2Att.array.map((item) => {
currentArray[innerCount] = item;
innerCount++;
});
geo1Att.array = currentArray;
geo1Att.count = currentArray.length / dataLengths[attIndex];
geo.setAttribute(currentAttribute, geo1Att);
}
return geo;
}