# Inconsistent rendering positioning & dimensions in Layers API

**URL:** <https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325>\
**Category:** Zoom Apps\
**Created:** [May 30, 2023, 9:15pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325 "2023-05-30T21:15:43Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![vandalayindustries](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vandalayindustries/32/39002_2.png) [@vandalayindustries](https://devforum.zoom.us/u/vandalayindustries)\
**Post date:** [May 30, 2023, 9:15pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/1 "2023-05-30T21:15:43Z")

</div>

Layers API seems to render incorrect position and dimensions on Mac zoom clients.

Details:  
Example zoomConfig response:

 ![Screenshot 2023-05-30 at 12.55.04 PM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/e/a/ea21c27ff6ed5cfbc71c0ed2e7d60c5aec70d4d6.png)

`drawParticipant` is called given the following positions:

```auto
height: 552.84375
participantUUID: "10ADB150-7DDA-064D-924A-9651B65E6566"
width: 781.21875
x: 43.390625
y: 282.46875
zIndex: 2

```

This should position the participant in the middle of the following box, but as you can see the X, Y positions AND the width, height positions are off by exactly a factor of 2:

 ![Screenshot 2023-05-30 at 2.05.52 PM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/1/3/13b7b89291faece812c42f5e479f3801e8013aaa.jpeg)

The correctly expected behavior occurs on some windows clients. Example (running the EXACT same code as above)

 ![Screenshot 2023-05-30 at 1.07.04 PM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/7/e/7e4c6edbdb0cd519dae6019b811880f3e8be2539.png)

 ![Screenshot 2023-05-30 at 2.11.25 PM](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/1/0/10e5a31bd3758a34acca3a9c77d047bd29809214.jpeg)

---

<div class="post-metadata">

**Author:** ![vandalayindustries](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vandalayindustries/32/39002_2.png) [@vandalayindustries](https://devforum.zoom.us/u/vandalayindustries)\
**Post date:** [June 3, 2023, 4:47pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/2 "2023-06-03T16:47:50Z")

</div>

To further clarify after more testing:

- Rendering positions work as would be expected on Windows 10
- On Windows 11 and Mac devices all dimensions require a factor of 2 to render correctly
- There doesn’t seem to be any way to detect whether this factor of 2 is needed on a particular device, resulting in a very poor user experience

---

<div class="post-metadata">

**Author:** ![vandalayindustries](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vandalayindustries/32/39002_2.png) [@vandalayindustries](https://devforum.zoom.us/u/vandalayindustries)\
**Post date:** [August 14, 2023, 9:51pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/3 "2023-08-14T21:51:33Z")

</div>

@MaxM , @Robert.Wallis , or anyone from Zoom team: this seems like a pretty fundamental issue with the layers API unless I’m missing something. Rendering on Windows clients seems to be inconsistent between Mac and PC clients making a nonfunctional experience for many users. Can you comment?

---

<div class="post-metadata">

**Author:** ![Robert.Wallis](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/robert.wallis/32/38438_2.png) [@Robert.Wallis](https://devforum.zoom.us/u/Robert.Wallis)\
**Post date:** [August 14, 2023, 10:59pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/4 "2023-08-14T22:59:48Z")

</div>

Does `window.devicePixelRatio` give you the factor of 2 you’re looking for? [Window: devicePixelRatio property - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio)

---

<div class="post-metadata">

**Author:** ![vandalayindustries](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/vandalayindustries/32/39002_2.png) [@vandalayindustries](https://devforum.zoom.us/u/vandalayindustries)\
**Post date:** [August 15, 2023, 7:49pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/5 "2023-08-15T19:49:44Z")

</div>

@Robert.Wallis : genius. Yes it does.

---

<div class="post-metadata">

**Author:** ![MaxM](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/maxm/32/42303_2.png) [@MaxM](https://devforum.zoom.us/u/MaxM)\
**Post date:** [August 16, 2023, 5:31pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/6 "2023-08-16T17:31:09Z")

</div>

You can also check this sample app for examples of working with the Layers API as it pertains to multiple device sizes:

> <https://github.com/zoom/zoomapps-customlayout-js/blob/28aff71df50c5e55a2a72c5030a206d5276a8b18/public/js/lib/canvas.js#L294C1-L309C7>

---

<div class="post-metadata">

**Author:** ![acannonier](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/acannonier/32/58917_2.png) [@acannonier](https://devforum.zoom.us/u/acannonier)\
**Post date:** [April 21, 2024, 4:30pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/7 "2024-04-21T16:30:20Z")

</div>

Sorry to revive this for this reason but i did not have luck finding it on my own. The screenshot at the top of this post has a console with icons that label the data type. What browser / setting / extension is that?

---

<div class="post-metadata">

**Author:** ![acannonier](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/acannonier/32/58917_2.png) [@acannonier](https://devforum.zoom.us/u/acannonier)\
**Post date:** [April 21, 2024, 5:14pm UTC](https://devforum.zoom.us/t/inconsistent-rendering-positioning-dimensions-in-layers-api/89325/8 "2024-04-21T17:14:33Z")

</div>

Hey all I found it. It is the safari console. TY.
