OrthographicCamera and GLSL rendering issue

Description of the problem

When generating a square mesh (using ShapeGeometry) with a ShaderMaterial (barebones GLSL shader) in a scene with an OrthographicCamera it is neither at the right origin nor the right scale. This is not the case using any other material.

https://jsfiddle.net/h3m951x6/1/

Three.js version

• [ x] r116

Browser

• All of them

OS

• All of them

[sciecode]

The generated geometry is not centered, so it won’t appear centered eitherway. You are assigning the vertex position in object space directly to gl_Position, so the object doesn’t follow the rendering pipeline and it won’t be based on the camera’s configuration or world coordinates.

This is not an issue with Three.js, I suggest taking a look at the examples and/or opening a thread on the Three.js Discourse Forum for help.

[olgageletina]

Thanks @sciecode .

I did look at examples my OrthographicCamera should be in line with a top left origin of my canvas as documented here and I set the vertex position in object space as demonstrated here line 22.

There was nothing in my post to suggest that the geometry needs to be centered – its origin needs to be in line with my canvas coordinates. I’ll open up a thread on the forum. In the future, I’d encourage you to heed your own advice by taking a look at some examples.

@mrdoob thoughts?