Jump to content

Only render points in a mesh


Recommended Posts

I thought i would try rendering spheres using instancing, but the page becomes unusably slow after like 60.000 meshes. Since i want to be able to show a "point cloud" which is larger im still looking for better options. 

var spheres = [];//i put this somewhere in my initspheres.push(BABYLON.Mesh.CreateSphere("sphere", 2.0, 0.05, scene));
var indexY = 0;function OnTestInstancing() {  var index = 0;  for (var indexX = 0; indexX < 100; indexX++) {    for (var indexZ = 0; indexZ < 100; indexZ++) {      var newInstance = spheres[0].createInstance("i" + index);      newInstance.position = new BABYLON.Vector3(indexX * 0.2, indexY, indexZ * 0.2);      index++;     }   }   indexY += 0.5;}
Link to comment
Share on other sites

Im having trouble viewing examples in the playground sent a PM to ask what this could be.


If the example shows how to render the actual triangle mesh then its not what i was looking for. i would like to render only the vertices and be able to change the size of the "points".


I looked in the code but judging from this line (287 in babylon.mesh.ts):

engine.draw(useTriangles, useTriangles ? subMesh.indexStart : 0, useTriangles ? subMesh.indexCount : subMesh.linesIndexCount, instancesCount);    

it looks like this isnt possible only a choice between "solid" and "wireframe". But if im wrong please could you point me in the right direction.

Link to comment
Share on other sites

Im still figuring out how to compile babylon but i believe we would need something like the following added to the engine in order to get this working.


        public drawNew(drawAs: number, start: number, count: number, instancesCount?: number): void {            // Apply states            this.applyStates();                        // Render                     switch (drawAs)            {                case this._gl.LINES:                case this._gl.TRIANGLES:                    {                        if (instancesCount) {                            this._caps.instancedArrays.drawElementsInstancedANGLE(drawAs, count, this._gl.UNSIGNED_SHORT, start * 2, instancesCount);                        }                        else                        {                            this._gl.drawElements(drawAs, count, this._gl.UNSIGNED_SHORT, start * 2);                        }                    }                    break;                case this._gl.POINTS:                    {                        this._gl.drawArrays(drawAs, start, count);                    }                    break;            }                   }

This code isnt tested at all yet, and it doesnt use the instances for the points ... but if i manage to learn how to compile the TS to JS so i can test it before one of our pros comments ill post my updated code.


im using Visual studio here

Link to comment
Share on other sites

Hi All 


I managed to add the ability to render a mesh as points to the engine. 


I forked the repo, i would appriciate it if this would be added to the official repo after a review ;) 





it is very easy to use i hope this is enough info for you to test it out if not please tell me and ill create a test page.



Add this to your pixelshader:

gl_PointSize = pointSize;

On your material set:

shadedMaterial.drawAs = WebGLRenderingContext.POINTS; //TRIANGLES draws a solid mesh Lines Draws the triangle mesh
Link to comment
Share on other sites



Ill look in the modified code which got merged into babylon for you. But i can tell you in the changes i sent this would not be possible. 


I believe that when you set the mesh to be rendered as points, you should not have to set the indices (you could but it should ignore them). Why would you ask well, if i only want to render points the indices are irrelevant (And a waste of memory).


That being said i cant see why it shouldnt be technically possible to render both the points and triangles. But it will require some more modifications. If its not too much work ill see if i can modify it and make a new pull request, but to be honest my interest is currently focused on something else (http://www.html5gamedevs.com/topic/10449-updateverticesdatadirectly/). So please feel free to look at it yourself and give it a try, i know many users will be great full if you add new functionality like that.  

Link to comment
Share on other sites



hi i believe there might be a small bug, or im not using it in the correct way. 


the following code results in a solid mesh.

sphere.material.pointsCloud = true;sphere.material.pointSize = 5;

the following code does result in the point cloud.

sphere.material.fillMode = BABYLON.Material.PointFillMode;

thanks again

Link to comment
Share on other sites

  • 1 year later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...