The generated image does not match the screen resolution

[smart4654154]

I can provide images of various resolutions to the browser, but my monitor resolution is fixed (1920 * 1080),
I have observed that even if the resolution of my photos is high or low, they can always fill the browser
When the returned image resolution is small, such as 100 * 100, I know that Viser stretched the photo to fill the browser.
Q1:Based on the code that you provided(#247), I guess this is stretch code. Can you tell me specifically what 'file' refers to in the getFilmWidth function.may be browser resolution?

// Resize the mesh based on focal length.
const f = camera.getFocalLength();
backgroundMesh.current!.scale.set(
  camera.getFilmWidth() / f,
  camera.getFilmHeight() / f,
  1.0,
);

Q2:
When the returned image resolution is high, such as 2000 * 2000 or 3000 * 3000, the results I see in the browser are very clear. Does Viser downsample high-resolution photos to the browser resolution?Because the resolution of the monitor is limited.
For example, converting 2000 * 2000 photos to browser resolution and allowing users to view them. 3000 * 3000 photos are also converted to browser resolution for users to view. Can you tell me the specific code? Or is it this code that completes the downsampling task?
// Resize the mesh based on focal length.
const f = camera.getFocalLength();
backgroundMesh.current!.scale.set(
camera.getFilmWidth() / f,
camera.getFilmHeight() / f,
1.0,
);

Q3:
I guess both photos (3000 * 3000) and (2000 * 2000) will be downsampled to the same resolution. My problem is that users can render high-resolution photos, such as 2000 * 2000, 3000 * 3000, and Viser will automatically downsample to the same resolution. Therefore, rendering high-resolution photos is meaningless because the final displayed photo resolution is the same.am I right
Thank you very much.

[brentyi]

Hello!

Q1: For getting more information about getFilmWidth / getFilmHeight, your best bet is probably Google. Or, here's the threejs docs page: https://threejs.org/docs/#api/en/cameras/PerspectiveCamera.getFilmHeight

Q2/Q3: There's no explicit image downsampling. But otherwise we just display your image as a texture to fill the browser window, which will either be up- or down-sampled automatically by the WebGL renderer.

rendering high-resolution photos is meaningless because the final displayed photo resolution is the same

Yes, rendering photos that are higher in resolution than the screen/browser has no value!

[smart4654154]

Hello!

Q1: For getting more information about getFilmWidth / getFilmHeight, your best bet is probably Google. Or, here's the threejs docs page: https://threejs.org/docs/#api/en/cameras/PerspectiveCamera.getFilmHeight

Q2/Q3: There's no explicit image downsampling. But otherwise we just display your image as a texture to fill the browser window, which will either be up- or down-sampled automatically by the WebGL renderer.

rendering high-resolution photos is meaningless because the final displayed photo resolution is the same

Yes, rendering photos that are higher in resolution than the screen/browser has no value!

Thank you very much.
Is there any function that can obtain the resolution of the current browser?

[brentyi]

Is there any function that can obtain the resolution of the current browser?

Unfortunately this isn't exposed right now, you would have to modify the source code. If you have time for a PR I'd also appreciate it!