Problem drawing simple Lines for a ruler

[Topper]

High,

no idea why BJS struggles with this code:

https://www.babylonjs-playground.com/##RCZLX7

It fails when I want to push coordinates in my array in this very line:

myPoints.push(new BABYLON.Vector3(shortLength, currentHeight, 1));

Here´s the code of my function; doesn't even start in PG:

    this.createMeshRuler = function(){
        
        var rulerHeight = 5.000;
        var rulerWidth = 0.500;
        
        var sourcePlane = new BABYLON.Plane(0, 0, 0, 0);
            
        sourcePlane.normalize();
        
        var meshRuler = BABYLON.MeshBuilder.CreatePlane("meshRuler", {height:rulerHeight, width: rulerWidth, sourcePlane: sourcePlane, sideOrientation: BABYLON.Mesh.DOUBLESIDE}, this.scene);
        
        meshRuler.position = new BABYLON.Vector3(0.5 * rulerWidth, 0.5 * rulerHeight, 0);
        
        var rulerMaterial = new BABYLON.StandardMaterial("myMaterial", this.scene);

            rulerMaterial.emissiveColor = new BABYLON.Color3(1, 1, 0);
            
            meshRuler.material = rulerMaterial;
            
        // Striche einfügen
        
        var restHoehe = rulerHeight;    // verbleibende Höhe bis OK Ruler
        var currentHeight = 0;          // aktuelle Höhe beim Aufbauen des Rulers
        var step = 0.200;               // Schrittweite
        var stepCounter = 0;            // Schrittzähler (Schleifendurchläufe)
        var shortLength = 0.2000;
        var longLength = 0.3500;
        
        Ende: while (restHoehe > 0) {
            
            currentHeight = restHoehe;
            
            // kurzen Strich
            if (stepCounter < 5) {
                
                var myPoints = [];
                myPoints.push(new BABYLON.Vector3(0, 0, 0));
                myPoints.push(new BABYLON.Vector3(shortLength, currentHeight, 1));
                
                var lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myPoints, updatable: true}, this.scene); 
                lines.color = new BABYLON.Color3(1, 0, 0);               
                
               stepCounter = stepCounter + 1;
               
               currentHeight = currentHeight + step;
            
            // langer Strich    
            }else if (stepCounter === 5) {

                var myPoints = [];
                myPoints.push(new BABYLON.Vector3(0, 0, 0));
                myPoints.push(new BABYLON.Vector3(longLength, currentHeight, 1));
                
                var lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myPoints, updatable: true}, this.scene); 
                lines.color = new BABYLON.Color3(1, 0, 0);  
                
                
                stepCounter = 0;
                
                currentHeight = currentHeight + step;
                                    
            // Error
            }else{

                /// Alert

            }
        }
    }; 

All browsers start to freeze; more or less.

Any suggestions, what´s happening?

BR,

Markus

[GameMonetize]

I would say because restHoehe is never changed so your while(restHoehe > 0) is always true?

[Pryme8]

http://www.babylonjs-playground.com/#3R1BB3

Just a quick idea...

[Topper]

@ Pryme8

That´s awesome. Thanks a lot, man, I really appreciate it.

@ Deltakosh

Sounds about right. Damn, I should definitely stop coding after 16 hour.

But for some reason BJS is highly addictive to me.

 

BR,

Markus

[jerome]

you could also simply use a LineSystem instead :