Removing Web3DOverlay "resolution" property


We’re planning on removing the “resolution” property from Web3DOverlays and changing how their “dpi” property works so that they match web entities. If you are using Web3DOverlays, it is likely that this change will affect their dimensions. You should be setting the dimensions of the overlay (in meters, as per usual), and then fine tuning the dpi as desired. If you change the dimensions of the overlay and want the web surface to scale accordingly, you’ll need to update the dpi, too.

This change will be made in this PR, but we wanted to give you a heads up:

Currently, the way these properties work is:
- dpi does not actually affect the resolution of the surface. Instead, a higher dpi will just make the overlay smaller.
- resolution both changes the actual resolution of the surface and the dimensions of the overlay.
- the rendering bounds of the overlays do not properly match their visual bounds. This means that sometimes a web overlay will disappear while it is still in view.

After the change:
- resolution is removed
- dpi correctly corresponds to “dots per inch.” If an overlay is 1 inch x 1 inch with a dpi of 30, it will be 30 pixels x 30 pixels.

After the change, by setting the dimensions and dpi of a web overlay, you’ll still have full control over the pixel resolution of the surface.

I know Fluffy and HumbleTim were experimenting with web overlays, but I am not aware of any other content that uses them. If you have any questions or concerns about this change, let us know!


So, if we set the dimensions to say 1by1.5 meters and the dpi to 20 will the webpage/webimage/web fill up the whole overlay or will it still do that thing where the overlay is bigger than the webview in it?


This PR seems to work well for me when using web entities, I’ve not tried it with overlays. It makes things actually usable, almost.

The one problem I still have is that if the entity takes up the whole screen / client window in desktop, it becomes hard to get out of the view because once you interact with it, any keyboard presses only interact with the web entity and not your position / view. It might not be a problem in HMD but I’ve not tried it.

I thought I knew a simple fix for this but I was not able to replicate or remember it now. But yes, for me it is better.


Right, after this change the web content will completely fill the overlay. Pixel-wise, in your example, 1m x 1.5m = 39.3701 in x 59.0551 in. 39.3701 in x 59.0551 in * (20 px/in) = 787.402 px x 1181.102 px.

With the script in the first step of that PR’s test plan, you can see how changing the dpi effectively changes the resolution of the web content without modifying its dimensions.


This PR doesn’t affect web entity functionality, but I’m glad to hear things are working better! We’ve been making a bunch of other changes that are hopefully helping.

And that’s a good point. Would something like a keyboard shortcut for relinquishing keyboard focus help? I can discuss solutions with our UX designers.

Are there other issues you see with web entities/overlays?


There’s still the issue of web3doverlays showing tablet ui and causing a crash if you keep recreating a web3doverlay, Tim did a pr to fix that I believe if you want to take a look.

So if we can’t set the resolution, how do we set the equivalent? Via the dpi? If so will there be a helper function for this? My web stuff uses a set resolution atm and not too sure how to adjust this without making the whole lot dynamic…


Sure thing, I will talk with Tim about the PR (I assume you mean

I’m not sure what you mean by helper function or dynamic. You can use editOverlay to set the dpi, like before. Where is the helper function for setting the resolution?

To set the equivalent, you just need to perform the calculation. Choose your overlay’s dimensions and its desired resolution in pixels, and then dpi = resolution / (dimensions * 39.3701 inches/meter). If, for example, you want the overlay to scale with your avatar, you can look at how the tablet handles it.


I was meaning the webpage itself, it’s set to work only with a desired resolution, if I can’t set the res directly I still need a way to set the dpi to make it the correct res otherwise I have to make the html rescale itself all dynamically which causes more issues than it solves.

By helper function I was meaning it would be useful to have something like, Overlays.resolutionToDPI({x:1920,y:1080},{x:1.5,y:1,z:0}) which would then output the correct dpi for the res you need?


A web page that only works at one resolution?! :open_mouth: That sounds the exact opposite of how HTML is supposed to work (though, sadly, not at all surprising in this day-and-age :sob:)


My page was made only to be used in HiFi on this web3Doverlay… My pages that aren’t was made with normal scaling and stuff in mind…


The new change means that pixels have to be square. In other words, you can’t make a 1.5m x 1m web surface that is 1920px x 1080px because 1.5/1 != 1920/1080.

If you need your surface to always be 1920px x 1080px, pick the desired width (or height), and calculate the dpi. For example, dpi = 1920 / (width * 39.3701 inches/meter). You can calculate the height from the aspect ratio.

closed #12

This topic was automatically closed after 30 days. New replies are no longer allowed.