p5.Geometry.prototype._getFaceNormal: face has colinear sides or a repeated vertex

[micuat]

Most appropriate sub-area of p5.js?

• Accessibility (Web Accessibility)
• Color
• Core/Environment/Rendering
• Data
• Dom
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Other (specify if possible)

Details about the bug:

• p5.js version: 1.1.9
• Web browser and version: any
• Operating System: any
• Steps to reproduce this:

sorry for a bit of a mess - first sayo found bunch of warnings from _getFaceNormal in her sketch

https://www.openprocessing.org/sketch/956215

and I found that it's due to "repeated vertex" as the warning suggests. When I add a condition not to add new vertices that are close to the existing set of vertices

https://www.openprocessing.org/sketch/956834

which is actually weird because the "threshold" I found was roughly around 0.05 (line 114 in the sketch above) which actually alters the appearance of the output. So I tried to reproduce it in a simpler sketch, which I failed to do

https://www.openprocessing.org/sketch/956871

I guess if I have a p5js dev environment the best way to debug this is to actually see the set of vertices causing error in the first and the second sketches, but I am a volunteer and can only write this issue here... sorry it's not that helpful

FYI

p5.js/src/webgl/p5.Geometry.js

Line 93 in 3f0b2f0

p5.Geometry.prototype._getFaceNormal = function(faceId) {

[kfahn22]

I am wondering where this stands. I am getting this error as well. I am not sure whether the issue is with how I constructed the shape or a bug.
https://editor.p5js.org/kfahn/sketches/YceFKpQ8F

[davepagurek]

@kfahn22 in your case, it seems that you have some duplicated vertices. I tried adding a breakpoint where the warning is logged and two of the vertices are the same:

As for the status of the issue, it seems like the check is calculating the sine of the angle between two sides of the triangle to see if the result is 0. The extra trig might be adding to precision issues compared to checking whether the result of the cross product between the two triangle sides is 0? It checks sin of the angle because the result of _getFaceNormal doesn't just return the normal, but returns the normal scaled by the magnitude of the angle. Presumably this is to weigh the face normals adjacent to a vertex differently before averaging them (making it roughly proportional to area.) I think by just not normalizing the face normals, we get that without adding extra trig though?

Maybe this is sufficient? If anyone else has a sketch where they're running into this issue, does it go away if you add the following patch into your code?

p5.Geometry.prototype._getFaceNormal = function(faceId) {
  //This assumes that vA->vB->vC is a counter-clockwise ordering
  const face = this.faces[faceId];
  const vA = this.vertices[face[0]];
  const vB = this.vertices[face[1]];
  const vC = this.vertices[face[2]];
  const ab = p5.Vector.sub(vB, vA);
  const ac = p5.Vector.sub(vC, vA);
  const n = p5.Vector.cross(ab, ac);
  if (n.x === 0 && n.y === 0 && n.z === 0) {
    console.warn(
      'p5.Geometry.prototype._getFaceNormal:',
      'face has colinear sides or a repeated vertex'
    );
  }
  return n;
};

[kfahn22]

Thanks for getting back to me! I figured out that I needed to set detailX & detailY to an odd number to eliminate the duplicate vertices.

[capGoblin]

Hi @davepagurek,

I attempted to run the sketches, but I was unable to reproduce any warnings or errors in the console, related to the _getFaceNormal function. Has the issue already been resolved?

[davepagurek]

@capGoblin in this sketch https://openprocessing.org/sketch/956834 if I change the threshold on line 114 from 0.05 to 0.005, I start getting the warning again. I haven't tested it on a more recent p5 version, so a good first step could maybe be to try making a p5 editor sketch out of the above link with the changed threshold, and debug on that?