Mirroring Line2 over a single axis

Hello everyone, I’m attempting to use Line2 for a small application and I’d like to implement a mirroring function over the axis. I’m struggling however to use makeScale to flip a Line2 object over a single axis. When I apply object.applyMatrix4(new THREE.Matrix4().makeScale(-1, 1, 1)) nothing happens.

A regular line with the same transformation applied mirrors correctly over the vertical axis but Line2 doesn’t. Weirdly enough, applying more than one variation in the scale (object.applyMatrix4(new THREE.Matrix4().makeScale(-1, -1, 1)) in example) works and the object mirrors over multiple axis.

Here’s a jsfiddle that shows the problem: https://jsfiddle.net/waL3ed1b/

The thin line mirrors correctly with the makeScale above applies, the Line2 does not.

Now, I know that Line2 is not officially supported but is there a way to make this work? Or have I maybe stumbled into a bug for Line2?

Thanks!

Update just in case someone else needs this: I did not figure it out. I tried quite a lot of options, including:

  • rotating the object around an axis (not easily scaleable)
  • messing with Reflector (doesn’t work well with Line2: reflects but the original line doesn’t show)
  • cloning and flipping the geometry (flips the line correctly… but the original line disappears? Can’t figure out why, considering that the geometry is completely different)

I ended up… just drawing another line with flipped geometry starting with the original positions. If anyone else fins a better solution, I’m all ears :slight_smile:

Look at this: Line2 disappears if scale is set to negative on a single axis · Issue #19629 · mrdoob/three.js · GitHub

1 Like

Hi! Yes, I opened that bug but then forgot to come over and share the solution!

I’ll mark your answer as the solution so we can close the loop :smiley:

1 Like