Screen capture - quality is very bad, how to improve it?

[SProgrammer]

Used screen capture but the quality is so poor its impossible to use, how to make the quality better and do it higher resolution? See the screen capture shot with webRTC (tested Linux, Windows) same no better quality (Google chrome 32, and Canary tested)

Thank you

[Benjamin Schwartz]

Chrome defaults to capturing at a maximum of 640x480.  To allow higher resolutions, set the maxWidth and maxHeight getUserMedia constraints.  See https://simpl.info/getusermedia/constraints/ .

--
 
---
You received this message because you are subscribed to the Google Groups "discuss-webrtc" group.
To unsubscribe from this group and stop receiving emails from it, send an email to discuss-webrt...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

[SProgrammer]

I have done the HD format. But still no improvement, it remain exactly same quality. Please see below:

function start() {
 trace("Requesting local stream");
 btn1.disabled = true;
 
 var vgaConstraints  = {
  video: {
    mandatory: {
      maxWidth: 640,
      maxHeight: 360
    }
  }
 };


  var video_constraints = {
      mandatory: {
        chromeMediaSource: 'screen',
        maxWidth: 1280,
        maxHeight: 720
      },
      optional: []
  };
 
  navigator.webkitGetUserMedia( { audio: false,
    video: video_constraints
   }, gotStream, function(e){
    console.log("getUserMedia error: ", e);
  });
}

[Silvia Pfeiffer]

That should work - are you sure you're not accidentally using
vgaConstraints somewhere?

Here are the constraints that worked for me:

var constraints =
{ audio: false,
video: {
mandatory: {
chromeMediaSource: 'screen',
maxWidth: screen.width,
maxHeight: screen.height,
minFrameRate: 1,
maxFrameRate: 5
}
}
};

with screen.width and screen.height taken from the actual screen object.

Cheers,
Silvia.

[SProgrammer]

Hello Silvia,

NOT  - solved yet.

Thank you for your feedback. I am sure i am doing it right and also applied your suggestion but its not working. The Quality remain bad, like the resolution is very low and trying to maximize, the main source capture by default is broken, must be a BUG.

Tried: (see screen shot the quality is not good you cant read the fonts)

var video_constraints =

                      { audio: false,
                        video: {
                          mandatory: {
                            chromeMediaSource: 'screen',
                            maxWidth: screen.width,
                            maxHeight: screen.height,
                            minFrameRate: 1,
                            maxFrameRate: 5
                          }
                        }
                    };

 
  navigator.webkitGetUserMedia(video_constraints, gotStream, function(e){

    console.log("getUserMedia error: ", e);
  });

Also tried: while trying this method, it does not even start to capture by saying permission denied

  var video_constraints = {
    mandatory: {
      chromeMediaSource: 'screen',

      minWidth: 1024, // above 640 causes permission denied
      minHeight: 768,
      //minAspectRatio: 1.333, maxAspectRatio: 1.334,
    },
    optional: []
  };

or tried:

   

var video_constraints = {
    mandatory: {
      chromeMediaSource: 'screen',

      minAspectRatio: 1, maxAspectRatio: 3
    },
    optional: [
        { minFrameRate: 60 },
        { maxWidth: 1920 },
        { maxHeigth: 1080 },
        { minWidth: 1280},
        { minHeight: 720}
    ]
  };  

None of them above worked to have quality local capture of screen.

But i have used as following which worked even i do not need that for my use case:

Step 1: https://www.webrtc-experiment.com/Pluginfree-Screen-Sharing/  - in Windows PC broad-case screen

Step 2: https://www.webrtc-experiment.com/Pluginfree-Screen-Sharing/  - in Linux PC download Windows PC's screen

Step 3: i have better quality 

but if

Step 1: https://www.webrtc-experiment.com/Pluginfree-Screen-Sharing/  - in Linux PC broad-case screen

Step 2: https://www.webrtc-experiment.com/Pluginfree-Screen-Sharing/  - in Windows PC download Linux PC's screen

Step 3: i have very very very BAD quality

FYI - I only need to have quality image in my local machine (i do not need SDP or broadcasting it to pc to pc2)

Thank you

Best regards

/Sham

[SProgrammer]

Wed Feb  5 09:32:13 CET 2014 - Tested the code (local capture and playback only, not remote broadcast).

1) BAD Quality =  Google Chrome 32, Linux kernel 3.5.0.17-generic quality is bad 

2) Frozen, slow =  Google Chrome 32, Google Canary Windows 7 64-bit PC

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66

<!DOCTYPE html> <html> <head> <meta http-equiv="X-UA-Compatible" content="chrome=1" /> <base target="_blank"> <title>Screen capture</title> <script> btn1.disabled = false; var localstream; function start() { console.log("Requesting local stream"); btn1.disabled = true; var video_constraints = {

audio: false, video: { mandatory: { chromeMediaSource: 'screen',

maxWidth: 1024, maxHeight: 768, minWidth:800, minHeight:400, minFrameRate: 1, maxFrameRate: 2, //minAspectRatio: 1.333, maxAspectRatio: 1.334, } } }; navigator.webkitGetUserMedia(video_constraints, function(stream){ console.log("Received local stream"); vid1.src = webkitURL.createObjectURL(stream); localstream = stream;

}, function(e){ console.log("getUserMedia error: ", e); }); }

</script> </head> <body> <!-- Step 0 --> <button id="btn1" onclick="start()">Start</button> <video id="vid1" autoplay ondblclick="webkitEnterFullscreen();" width="1024" height="768"></video> <canvas id="canvas" width="800" height="400" ondblclick="webkitEnterFullscreen();"></canvas> <!-- Step 1 --> <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script> <script> //var canvas = $("#canvas"); //var ctx = canvas.get()[0].getContext('2d'); //var video = document.getElementById('vid1'); //setInterval(function () { //ctx.drawImage(video, 0, 0); //var data = canvas[0].toDataURL("image/jpeg"); //$.post( "http://upload.frame.per.second.to.web.server/ajax/preview", { username: 'TP1', preview:data} ); //},5000); </script> </body> </html>

[Vikas]

Thanks for the feedback,  i suggest that you file a bug regarding quality issue in the webrtc issue tracker.I will also try to recreate with the below code. Just to be clear, you are no more getting a permission denied error when trying to use a resolution higher than VGA? 

/Vikas

[SProgrammer]

Dear Vikas,

OK - Sure i will do that.

1) you are no more getting a permission denied error when trying to use a resolution higher than VGA?

mandatory: if i try lower or above VGA resolution i do not get permission denied error 

but if i use "minAspectRatio and maxAspectRatio" i get permission error

or this following line also cause permission denied error

var video_constraints = { audio: false, video: { mandatory: { chromeMediaSource: 'screen', minWidth: 1280, minHeight: 720, //minAspectRatio: 1.333, maxAspectRatio: 1.334, } } }; 

FYI - if you use some random choice with optional and mandatory i think you can simulate the permission denied error, i faced it some time but now unable to find those combination i tried yesterday.

2) Windows to Linux 

- stream works, but Windows 7 64-bit PC while testing i have noticed it get frozen or slow, specially you cant click anything at all. 

i have used resoltuions 640x480 or 800x400 or 1024x768 and luckily out of many retry sometimes i can screen capture + i can click other windows etc most of 

time i was frozen or slow when i started to screen capture.

3) Linux to Windows no way its not working at all, i am completely lost cause its very random not following my code at all

- i have never a problem with FROZEN issue or SLOW issue

- but i have quality problem quality is not equal like Windows

- also i have tried all combination of resolution, frame rate , none helped to have quality image

+ i have also used other's implementation of webRTC screen share they failed too, means something is wrong happening in Linux Version 32.0.1700.77

Thanks

Kind regards

/Sham

[Vikas]

Hi Sham,

Thanks, I have been able to recreate the error when using getUserMedia for screen sharing with minAspectRatio/maxAspect ratio, filed issue 2897. For the quality issue, you might want to add these details to a new issue. 

/Vikas

[Serge Lachapelle]

When you file the issues. Could you also add your test results from the Dev build of Chrome.

/Serge from my phone.

--

[Rob Retter]

Did anyone ever actually solve the poor-quality issue?  It's three years later and I'm experiencing it on Chrome 57.  And Googling leads to random complaints about such experiences, but no solutions.

[Leon van Kammen]

Same here on a chromebook (chrome 59).
Screencapture extentions like screencastify allows configuring the resolution, but whatever you select will result in 640x480.

It seems to work correctly for webcam but for desktop share it doesn't sadly.