THREE.js 中的偏移网格

Question

有没有办法在给定步长/厚度的情况下偏移 THREE.JS 中的网格几何体？

offseting

这不是简单的缩放。我的建议是算法应该基于法线，法线给出缩放边缘的方向。

Answer 1

这是一些我刚刚快速写下来但没有测试的代码。但这将是我的方法。也许这是开始的事情。

var geo = mesh.geometry; // assuming this Geometry and not BufferGeometry
var verts = geo.vertices;
var faces = geo.faces;

// vertices are used in multiple faces with different normals
// we want to translate the vertex along the average normal

// first, I collect all normals for each vertex
// (it's a bit quick and dirty as I add a normals property to the Vector3 object)
for(var i=0; i<faces.length; i++) {
  // vertex a
  var va = verts[faces[i].a];
  if(va.normals) va.normals.push( faces[i].vertexNormals[0] ); // add normal to collection
  else va.normals = [ faces[i].vertexNormals[0] ];             // otherwise create array with first element
  // vertex b
  var vb = verts[faces[i].b];
  if(vb.normals) vb.normals.push( faces[i].vertexNormals[1] );
  else vb.normals = [ faces[i].vertexNormals[1] ];
  // vertex c
  var vc = verts[faces[i].c];
  if(vc.normals) vc.normals.push( faces[i].vertexNormals[2] );
  else vc.normals = [ faces[i].vertexNormals[2] ];
}

// then iterate over vertices, compute average normal, and translate vertex
for(i=0; i<verts.length; i++) {
  var v = verts[i];
  var normal = computeAverageNormal( v.normals );
  normal.multiplyScalar( offsetAmount );
  v.add( normal );
}

geo.verticesNeedUpdate = true;

function computeAverageNormal(normals) {
  var n = new THREE.Vector3();
  for(var i=0; i<normals.length; i++) {
    n.add( normals[i] );
  }
  n.normalize();
  return n;
}