<p>Found a solution. </p>

<p>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 <code>gl_Position</code> value.</p>

CC BY-SA 4.0
2020-05-02T20:29:00.643Z
2020-05-02T20:29:00.643Z
Anvaka
<p>I have a standard 3d camera/projection/model setup that renders rectangles with a WebGL shader. </p>

<p>Users can zoom out and fly anywhere. </p>

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

<p>What is the most efficient way to do so?</p>

<p>This is very similar to SVG's non-scaling-stroke vector effect: <a href="https://www.w3.org/TR/SVGTiny12/painting.html#NonScalingStroke" rel="nofollow noreferrer">https://www.w3.org/TR/SVGTiny12/painting.html#NonScalingStroke</a></p>

<rendering><3d><shader><glsl><computational-geometry>
constant pixel width for any scale
Anvaka
# constant pixel width for any scale

(Asked by: username_0 on 2020-02-26)

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>

**Tags:** rendering, 3d, shader, glsl, computational-geometry


---

## 1 answers

### Answer by username_0 on 2020-05-02. Score: 1

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.


---

