search

iTwin / itwinjs-core

Monorepo for iTwin.js Library
https://www.itwinjs.org
MIT License
600 stars 210 forks source link

Maintain the zoom/scale of a viewport when it resized automatically, or provide an option/api to do so. #4296

Open SatyakamKhadilkar opened 1 year ago

SatyakamKhadilkar commented 1 year ago

The request is not specific for mobile, but is more needed and useful on mobile.

When a viewport is resized, iTwinJs tries to maintain the horizontal extents of the current content and thus scales it to fit the new width. This looks acceptable on web. However, on mobile, when the view orients from portrait to landscape or vice-versa, the content looks off due to large changes in its scale done automatically. The desired behaviour is described at the end.

Original content in portrait orientation. Note the scaling. Original-Portrait

Same content on rotation of iPhone. Note how the content scales up. to match the width (but not the height). Rotated-Landscape

It is desirable to maintain the same zoom level or scale and keep the content cantered on device rotations. Desired behaviour on rotation. Desired-Rotated-Landscape

Notes:

  1. Keeping scale constant is required on both orientation changes (portrait to landscape and vice-versa)
  2. Best desired behaviour would be if iTwinJs automatically applies this behaviour to mobile (i.e scale constant on mobile and horizontal extents constants on web). Or else it would also be acceptable to have an additional parameter on viewport to keep the scale constant during rotations.
pmconne commented 1 year ago

It looks like the camera is off. If the camera is on, you will wind up with an extremely wide (fish-eye) field of view in landscape mode.

SatyakamKhadilkar commented 1 year ago

The camera is off for this view. However, irrespective of camera, we want to see if there is anyway of keeping the perceived zoom/scale same across rotations. I understand that the scale may be a derived quantity here.

The request is based on fact how 2D maps (eg. google maps) maintains the scale and centre. I know an orthogonal or perspective 3D view can't have direct comparison with maps, but we want to make sure device rotations don't cause original scale to change too much.

SatyakamKhadilkar commented 1 year ago

After experimenting I also see that it will be much harder to keep perceived scale same when camera / perspective is on. The perspective distortion would mean that merely zooming out on landscape orientation won't give the same perceived scale as the one in portrait.

vincasrazmabentley commented 1 year ago

Perspective should not cause additional problems - it would be similar to the reverse of current behavior, which becomes wide field of view (vertically) when switching from horizontal to vertical view. With this request it could appear reverse - reduce vertical but add horizontal areas to be visible when switching from vertical to horizontal view.

Current - "normal" field of view:

image

-> "wide" field of view vertically:

image

The goal with perspective could be similar to orthographic projection - no matter how the canvas is resized (e.g. in a desktop browser window), the model should stay the same size on screen, only cropped and shifted appropriately. This should apply to 3D and 2D viewports, of any kind.