Whats the Properly way to work with the zoom by the API

Development
1

I’ve been working with the zoom taking the current device width also the resizing of the screen but the zoom seems like behaving a bit wierd dou you know guys whats the proper way to work with the zoom, here I share the code that is working the best for me, but not as I want

Captura de Pantalla 2021-03-23 a la(s) 12.56.24 p. m.
Captura de Pantalla 2021-03-23 a la(s) 12.56.24 p. m.546×799 54.2 KB

2

Hi Joel, can you explain a little bit by what you mean when you say the zoom is behaving weird?

3

Hi @Will what I mean is that can not find the pattern of the zoom, for example I add an especific quantities for a screen width but it behaves different each time that I resize the screen

4

I see - can you explain to me what you would like to achieve by doing this? My assumption is when you are visiting the page on different devices the item in the player is not the correct size, am I right?

5

yeah! , some times it takes the right size sometimes it doesn’t, but must of all when you resize the image like when you turn your phone from vertical to horizontal

6

I see. I’ll ask the product team for some support on the zoom functionality but another potential way to do this would be to create a camera that contains the item in the viewport appropriately and set that camera to active when the position of the screen is rotated or changed.

Have you tried this approach or is there a reason you think it may not work?

7

hi @Will yes I though in that approach, but spite of this I need to work with the zoom, vertical or horizontal

8

I see. I got a code example from my team on how they implemented a zoom. This example is for clicking buttons for zoom in/out but conceptually I hope this helps and you can always refer to our docs for information.

const zoom = val => window.api.camera.zoom(val);
const handleClickZoomIn = () => zoom(1);
const handleClickZoomOut = () => zoom(-1);

If you play with this example the value of one does a minor zoom in/out, you can call the functions multiple times to continue zooming from the current position.

Please let me know if this is helpful.

9

ok, will i’m going to check this, but for example the client wants the player full width of the device screen, so depending of the screen the ‘zoom in or out’ could be more than 1 or -1, I saw this info in the docs, but my question now, the ‘zoom’ is just handle by 1 and -1 or could I use another values?

10

Yes you can use other values, whatever value you want. Perhaps I misunderstood your initial question.

11

thanks you so much @Will!!

1 Like