Can't set resolution of WebcamTexture on WebGL build Unity

Unity Engine
,
1

I’ve been working on this Windows app and was recently tasked to switch it over to WebGL.

Everything has been going smoothly except for the Webcam Resolution which I can’t seem to get working… I need a 16:9 resolution but no matter what I do it seems to default to 480 x 640.

Here’s my code that works in editor, windows and android builds:

public IEnumerator RefreshCamera()
    {
        if (camTexture != null)
        {
            Display.texture = null;
            camTexture.Stop();
            camTexture = null;
        }
        else
        {

            WebCamDevice device = WebCamTexture.devices[currentCamIndex];
            camTexture = new WebCamTexture(device.name, 576, 1024, 24);
            camTexture.requestedHeight = 576;
            camTexture.requestedWidth = 1024;
            camTexture.requestedFPS = 24;
            Display.texture = camTexture;
            camTexture.Play();
        }

        yield return new WaitForEndOfFrame();
    }

While I am setting the requested resolution when setting the camTexture variable this does not work on any platforms and defaults to 480 x 640. The lines that follows however seem to do the trick on Windows, editor and android. WebGL just ALWAYS defaults to 480 x 640 no matter what I do…

I’ve seen on documentation that IOS does not support requestedHeight/requestedWidth but there’s no mention of WebGL to be found.

Help is greatly appreciated.

Thank you

1 Like
2

Webcams tend to fall back to the lowest supported (most compatible) resolution if you request a resolution (and framerate!) that they do not support. Check the specs for supported resolutions and use only those, such as 1280x720 @ 30Hz.

3

Indeed! I guess I should’ve mentioned that I tried different resolutions with no success (including the one you used as an example)… I don’t mind the resolution at this point I just need a true 16:9 aspect ratio.

1 Like
4

have you found any solution? I currently have the same problem

5

Hey there. I did find a solution. It turns out the API Unity is using to translate to WEBGL has an issue and defaults back to standard resolution settings regardless of the settings you try to force by code.

To fix this you must edit the compiled code on the framework.js file in your build folder.

You want to find this piece of code in the framework.js file :

navigator.mediaDevices.getUserMedia({
        audio: false,
        video: videoInputDevices[deviceId].deviceId ? {
            deviceId: { exact: videoInputDevices[deviceId].deviceId }
    } : true
}).then(function(stream) {...}

And edit it depending on your needs:

navigator.mediaDevices.getUserMedia({
        audio: false,
        video: videoInputDevices[deviceId].deviceId ? {
            deviceId: {
                exact: videoInputDevices[deviceId].deviceId
            },
            width: {  min: 640, ideal: 1280, max: 1920 },
            height: { min: 480, ideal: 720, max: 1080 },
    } : true
}).then(function(stream) {...}

Hope this helps!

1 Like