Framing issues with External videos , External video sources are getting cropped in the call

Video SDK Web
1

Framing issues with external video, while giving the video input as other external video sources, video is getting cropped. Video is out of frame and unable to watch entire framing video.

2

Hey @sivakrishna

Thanks for your feedback.

Are you using Firefox or Safari or a mobile browser? VSDK will crop the video to the 16/9 ratio by default, Setting the originalRatio option in stream.startVideo method can enable the original ratio when capturing video.

Thanks
Vic

3

Hi Vic,
Thank you for the response. We have implemented 16/9 ratio and We are using Chrome, Safari both web and mobile browsers.

This issue is still there. Any further leads will be really helpful.

4

Hey @sivakrishna

Can you test on the official WebRTC sample to check whether the same issue occurs with the external video?

Thanks
Vic

5

Hi Vic,

Thank you for the response. We have already integrated the code OriginalRatio. Still we are unable to achieve the full video without cropping.

Our Code Sample is :
this.stream.startVideo({ originalRatio: true, ptz: true, hd: true, videoElement: document.querySelector(‘#self-view-video’) }).then(()

6

I have verified with the OfficialWebRTC Sample check for external video. Here in WebRTC, I can see sample video without cropping. Means I can able to see full video. Where as in Zoom call using Video sdk, External Videos are getting cropped in top and bottom frame.

I’m unable to upload screenshots here for better understanding but I’m facing an error while upload them here in my reply.

7

Hi,

I have tried, devforms suggestions for our problem. We are followed all the points mentioned in devforms and still no luck. here the code what we are using at the moment in our application. Please let us know, should we need to add any additional properties or attributes to achieve full frame video.

if ((!this.stream.isSupportMultipleVideos() && (typeof (window as any).OffscreenCanvas === ‘function’))) {
this.stream.startVideo({ originalRatio: true, ptz: true, hd: true, videoElement: document.querySelector(‘#self-view-video’) }).then(() => {
if (!(typeof (window as any).MediaStreamTrackProcessor === ‘function’)) {
this.stream.renderVideo(document.querySelector(‘#self-view-canvas’), this.client.getCurrentUserInfo().userId, 1920, 1080, 0, 0, 3).then(() => {
this.isVideoStarted = true;
this.spinner.show();

8

Hey @sivakrishna

Sorry for the late reply.

I saw the screenshot provided by our service engineer, the camera captured video steam in 4/3 ratio, but in Video SDK, the stream was cropped in 16/9 ratio.

A workaround for this is setting the captureHeight and captureWidth parameters when calling stream.startVideo method, For example, “captureWidth= 640,captureHeight=480” for the cameras that are not supported HD video.

Thanks
Vic

9

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