Feature Suggestion : Sphere and Cylinder impostors shaders

[Ludobaka]

Hi everyone,

I needed to be able to generate a very large number of spheres or cylinders. To do so, I've implemented a sphere impostor and a cylinder impostor shaders. Those shaders are generating pixel perfect objects with a reduced cost in memory.

This work has been developped thanks to this scientific publication

I planned to add my work to ThreeJS but encountered problems with Chrome.

My shaders can now do the following :

• use true impostors by using gl_PointSize in vertex shader
• use some quads to emulate the sprites (Chrome issue fix)

I don't really know where it will be better to add this to ThreeJS. I can either add this feature by adding it to /examples or /src.

By adding it to /examples, we may need to fix uniform updates from onBeforeRender callback #9927. By adding it to /src, I will be able to directly code uniform updates on WebGLRenderer.

Because those two possibilities are totally different, is it possible to know what do you prefer before going further ?

Thanks !

[WestLangley]

My suggestion would be to add it as an example and compare the results to instancing.

[vakorol]

This feature would be really cool to have!

[RodenLuo]

Are there any updates on this feature? Thanks.

I see an example here. But it is not working right now.

[Mugen87]

The fiddle included the JS files from https://threejs.org/ which means the fiddle uses the latest version of the library without upgrading the code.

Here is the working fiddle with R88 included (which is from November 2017): https://jsfiddle.net/j6gszhv4/1/

[RodenLuo]

Great, Thanks!

Just in case you are interested: I am doing this for my course project. I am implementing the impostors for a DNA nano design viewer. I plan to do it for both spheres and cylinders if possible. Below are some works I am currently based on. I'm totally new to OpenGL, JS, three.js (was doing bioinformatics, with some python quick script programming experience). So any guidance would be very appreciated.

• oxDNA-viewer (based on three.js), the main code source I will be based on.
• 2D Impostor of 3D Spheres
• The "three.js ~ Sphere Impostor Example" given above.

After some days, I finally found if I change this line in oxDNA-viewer, I can change the size of the rendered sphere. I understood to some extent that there is a chain of inheritance in the model representation in this folder's js files. The outermost layer is the "system" that encapsulates everything. I have not digested how the graphics pipeline works here yet, like how one XYZ offset (e.g. nucleoside's offset) is going to the vertex shader and then generate the triangles representing the sphere. My next step is to figure out the graphics pipeline and understand "three.js ~ Sphere Impostor Example" and then integrate them together. Many thanks!