Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Examples: Fix onWindowResize #28706

Merged
merged 1 commit into from
Jun 20, 2024
Merged

Conversation

Methuselah96
Copy link
Contributor

Related issue: N/A

Description

The camera is an OrthographicCamera, not a PerspectiveCamera, so setting the aspect property is ineffectual. The orthographic camera's planes are not based on the window's aspect ratio, so no updates to the camera are necessary on window resize.

@mrdoob mrdoob added this to the r166 milestone Jun 20, 2024
@mrdoob mrdoob merged commit 291f210 into mrdoob:dev Jun 20, 2024
10 of 11 checks passed
@Methuselah96 Methuselah96 deleted the fix-ortho-window-resize branch June 20, 2024 11:51
@WestLangley
Copy link
Collaborator

The orthographic camera's planes are not based on the window's aspect ratio, so no updates to the camera are necessary on window resize.

This example is not correct. The camera and viewport must have the same aspect ratio to prevent distortion, as we do for other orthographic examples.

@WestLangley
Copy link
Collaborator

FWIW, I think this WebGPU example by @cmhhelgeson (the original author) is far better. Maybe the three.js example can be modified to look like that one. 🙏

@cmhhelgeson
Copy link
Contributor

cmhhelgeson commented Jun 22, 2024

FWIW, I think this WebGPU example by @cmhhelgeson (the original author) is far better. Maybe the three.js example can be modified to look like that one. 🙏

Aside from the removal of screen curvature and the aforementioned orthographic problem, the shaders should be mostly the same between that link and the example version in Three.js. I could put that back in, but I'm not sure what else needs to be modified?

@WestLangley
Copy link
Collaborator

IMHO, the scrolling obfuscates what you are trying to demonstrate, and is unnecessary. Also, with a static image and a properly-maintained aspect ratio, you can see how changing the window size affects the shader.

Also, I think a single plane geometry and a GUI toggle to switch shaders would be more consistent with how the other examples are structured.

I do like your dog example.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
4 participants