Merge pull request #5328 from barroij/fixInstancesLinesMeshEdgeRendering

Fix LinesMesh EdgeRendering + make it work for instance of LinesMesh

dist/preview release/what's new.md

@@ -48,7 +48,7 @@
 - Fixed a bug with `mesh.alwaysSelectAsActiveMesh` preventing layerMask to be taken in account ([Deltakosh](https://github.com/deltakosh))
 - Fixed a bug with pointer up being fire twice ([Deltakosh](https://github.com/deltakosh))
 - Fixed a bug with particle systems being update once per camera instead of once per frame ([Deltakosh](https://github.com/deltakosh))
-
+- Fixed the `LineEdgesRenderer` used for edge rendering of `LinesMesh` handle properly LinesMesh made of disconnected lines + Make it work for instance of `LinesMesh` ([barroij](https://github.com/barroij))
 
 ### Viewer
 

src/Rendering/babylon.edgesRenderer.ts

@@ -62,6 +62,28 @@ module BABYLON {
         return this;
     };
 
+    export interface InstancedMesh {
+        /**
+         * Enables the edge rendering mode on the mesh.
+         * This mode makes the mesh edges visible
+         * @param epsilon defines the maximal distance between two angles to detect a face
+         * @param checkVerticesInsteadOfIndices indicates that we should check vertex list directly instead of faces
+         * @returns the currentInstancedMesh
+         * @see https://www.babylonjs-playground.com/#19O9TU#0
+         */
+        enableEdgesRendering(epsilon?: number, checkVerticesInsteadOfIndices?: boolean): InstancedMesh;
+    }
+
+    InstancedMesh.prototype.enableEdgesRendering = function(epsilon = 0.95, checkVerticesInsteadOfIndices = false): InstancedMesh {
+        if (this.sourceMesh.getClassName() === 'LinesMesh') {
+            LinesMesh.prototype.enableEdgesRendering.apply(this, arguments);
+        }
+        else {
+            AbstractMesh.prototype.enableEdgesRendering.apply(this, arguments);
+        }
+        return this;
+    };
+
     /**
      * FaceAdjacencies Helper class to generate edges
      */
@@ -262,59 +284,39 @@ module BABYLON {
             }
 
             if (needToCreateLine) {
-                var offset = this._linesPositions.length / 3;
-                var normal = p0.subtract(p1);
-                normal.normalize();
-
-                // Positions
-                this._linesPositions.push(p0.x);
-                this._linesPositions.push(p0.y);
-                this._linesPositions.push(p0.z);
-
-                this._linesPositions.push(p0.x);
-                this._linesPositions.push(p0.y);
-                this._linesPositions.push(p0.z);
-
-                this._linesPositions.push(p1.x);
-                this._linesPositions.push(p1.y);
-                this._linesPositions.push(p1.z);
-
-                this._linesPositions.push(p1.x);
-                this._linesPositions.push(p1.y);
-                this._linesPositions.push(p1.z);
-
-                // Normals
-                this._linesNormals.push(p1.x);
-                this._linesNormals.push(p1.y);
-                this._linesNormals.push(p1.z);
-                this._linesNormals.push(-1);
-
-                this._linesNormals.push(p1.x);
-                this._linesNormals.push(p1.y);
-                this._linesNormals.push(p1.z);
-                this._linesNormals.push(1);
-
-                this._linesNormals.push(p0.x);
-                this._linesNormals.push(p0.y);
-                this._linesNormals.push(p0.z);
-                this._linesNormals.push(-1);
-
-                this._linesNormals.push(p0.x);
-                this._linesNormals.push(p0.y);
-                this._linesNormals.push(p0.z);
-                this._linesNormals.push(1);
-
-                // Indices
-                this._linesIndices.push(offset);
-                this._linesIndices.push(offset + 1);
-                this._linesIndices.push(offset + 2);
-                this._linesIndices.push(offset);
-                this._linesIndices.push(offset + 2);
-                this._linesIndices.push(offset + 3);
+                this.createLine(p0, p1, this._linesPositions.length / 3);
             }
         }
 
         /**
+         * push line into the position, normal and index buffer
+         * @protected
+         */
+        protected createLine(p0: Vector3, p1: Vector3, offset: number) {
+            // Positions
+            this._linesPositions.push(
+                p0.x, p0.y, p0.z,
+                p0.x, p0.y, p0.z,
+                p1.x, p1.y, p1.z,
+                p1.x, p1.y, p1.z
+            );
+
+            // Normals
+            this._linesNormals.push(
+                p1.x, p1.y, p1.z, -1,
+                p1.x, p1.y, p1.z, 1,
+                p0.x, p0.y, p0.z, -1,
+                p0.x, p0.y, p0.z, 1
+            );
+
+            // Indices
+            this._linesIndices.push(
+                offset, offset + 1, offset + 2,
+                offset, offset + 2, offset + 3
+            );
+        }
+
+        /**
          * Generates lines edges from adjacencjes
          * @private
          */

src/Rendering/babylon.lineEdgesRenderer.ts

@@ -1,15 +1,5 @@
 module BABYLON {
     /**
-     * FaceAdjacencies Helper class to generate edges
-     */
-    class FaceAdjacencies {
-        public edges = new Array<number>();
-        public p0: Vector3;
-        public p1: Vector3;
-        public edgesConnectedCount = 0;
-    }
-
-    /**
      * LineEdgesRenderer for LineMeshes to remove unnecessary triangulation
      */
     export class LineEdgesRenderer extends EdgesRenderer {
@@ -26,66 +16,6 @@ module BABYLON {
         }
 
         /**
-         * Always create the edge since its a line so only important things are p0 and p1
-         * @param  faceIndex not important for LineMesh
-         * @param  edge not important for LineMesh
-         * @param  faceNormals not important for LineMesh
-         * @param  p0 beginnig of line
-         * @param  p1 end of line
-         */
-        protected _checkEdge(faceIndex: number, edge: number, faceNormals: Array<Vector3>, p0: Vector3, p1: Vector3): void {
-                var offset = this._linesPositions.length / 3;
-                var normal = p0.subtract(p1);
-                normal.normalize();
-
-                // Positions
-                this._linesPositions.push(p0.x);
-                this._linesPositions.push(p0.y);
-                this._linesPositions.push(p0.z);
-
-                this._linesPositions.push(p0.x);
-                this._linesPositions.push(p0.y);
-                this._linesPositions.push(p0.z);
-
-                this._linesPositions.push(p1.x);
-                this._linesPositions.push(p1.y);
-                this._linesPositions.push(p1.z);
-
-                this._linesPositions.push(p1.x);
-                this._linesPositions.push(p1.y);
-                this._linesPositions.push(p1.z);
-
-                // Normals
-                this._linesNormals.push(p1.x);
-                this._linesNormals.push(p1.y);
-                this._linesNormals.push(p1.z);
-                this._linesNormals.push(-1);
-
-                this._linesNormals.push(p1.x);
-                this._linesNormals.push(p1.y);
-                this._linesNormals.push(p1.z);
-                this._linesNormals.push(1);
-
-                this._linesNormals.push(p0.x);
-                this._linesNormals.push(p0.y);
-                this._linesNormals.push(p0.z);
-                this._linesNormals.push(-1);
-
-                this._linesNormals.push(p0.x);
-                this._linesNormals.push(p0.y);
-                this._linesNormals.push(p0.z);
-                this._linesNormals.push(1);
-
-                // Indices
-                this._linesIndices.push(offset);
-                this._linesIndices.push(offset + 1);
-                this._linesIndices.push(offset + 2);
-                this._linesIndices.push(offset);
-                this._linesIndices.push(offset + 2);
-                this._linesIndices.push(offset + 3);
-        }
-
-        /**
          * Generate edges for each line in LinesMesh. Every Line should be rendered as edge.
          */
         _generateEdgesLines(): void {
@@ -96,21 +26,13 @@ module BABYLON {
                 return;
             }
 
-            // First let's find adjacencies
-            var adjacencies = new Array<FaceAdjacencies>();
-            var faceNormals = new Array<Vector3>();
-            var index: number;
-            for (let i = 0; i < (positions.length / 3) - 1 ; i++) {
-                const currentAdjecancy  = new FaceAdjacencies();
-                currentAdjecancy.p0 = new Vector3(positions[i * 3], positions[i * 3 + 1], positions[i * 3 + 2]);
-                currentAdjecancy.p1 = new Vector3(positions[(i + 1) * 3], positions[(i + 1) * 3 + 1], positions[(i + 1) * 3 + 2]);
-                adjacencies.push(currentAdjecancy);
-            }
-            // Create lines
-            for (index = 0; index < adjacencies.length; index++) {
-                // We need a line when a face has no adjacency on a specific edge or if all the adjacencies has an angle greater than epsilon
-                var current = adjacencies[index];
-                this._checkEdge(index, current.edges[0], faceNormals, current.p0, current.p1);
+            const p0 = Tmp.Vector3[0];
+            const p1 = Tmp.Vector3[1];
+            const len = indices.length - 1;
+            for (let i = 0, offset = 0; i < len; i += 2, offset += 4) {
+                Vector3.FromArrayToRef(positions, 3 * indices[i], p0);
+                Vector3.FromArrayToRef(positions, 3 * indices[i + 1], p1);
+                this.createLine(p0, p1, offset);
             }
 
             // Merge into a single mesh