CODEWITHSUNDEEP
javascriptopengl-esgeometrywebgl
Emmanuel M. Smith
Emmanuel M. Smith

Reputation: 441

WebGL Geometry Shader Equivalent?

I'm currently researching a way to produce non-photorealistic rendering in webgl. The best looking algorithm I've found so far for edge detection was implemented with OpenGL's geometry shader, here. Specifically GL_TRIANGLES_ADJACENCY.

I was wondering if there was an equivalent in WebGL or even how would I go about porting this code over to Javascript.

Upvotes: 12

Views: 21155

Answers (2)

Mortennobel
Mortennobel

Reputation: 3481

Geometry shaders is not available in WebGL.

However there is plenty of ways to do edge detection. E.g. you can use image space based algorithms, such as

http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.93.9731&rep=rep1&type=pdf

Or take a look in "Real-time Rendering - 3rd edition" (book). In this book there is a lot of examples of NPR, of which most will run fine on WebGL.

http://www.realtimerendering.com/

UPDATE Nov 4 2023:

With WebGL2, if you know the number of vertices you want to generate up front, you can use this technique:

https://webgl2fundamentals.org/webgl/lessons/webgl-drawing-without-data.html

This website is dedicated to examples of that:

https://www.vertexshaderart.com

Upvotes: 14

cdiggins
cdiggins

Reputation: 18243

WebGL currently only supports pixel shaders and vertex shaders not geometry shaders.

This is as close as it gets:

https://webgl2fundamentals.org/webgl/lessons/webgl-drawing-without-data.html

And here's a site dedicated to examples of that:

https://www.vertexshaderart.com

You have to specify the number of vertices you will generate up front.

Upvotes: 7

Related Questions