0
$\begingroup$

I have a standard 3d camera/projection/model setup that renders rectangles with a WebGL shader.

Users can zoom out and fly anywhere.

I want to make sure that regardless of the scale, width of the rendered rectangles is a constant value (e.g. 2 pixels).

What is the most efficient way to do so?

This is very similar to SVG's non-scaling-stroke vector effect: https://www.w3.org/TR/SVGTiny12/painting.html#NonScalingStroke

$\endgroup$
0
$\begingroup$

Found a solution.

In the vertex shader I project position from model to the clip-space, then from clip-space to screen space, adjust the width in screen pixels, and the project back to clip-space, which ultimately becomes gl_Position value.

| improve this answer | |
$\endgroup$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.