Question about creating and rendering a participant canvas

Currently, all participants’ videos are being rendered on one canvas.

Which Web Video SDK version?

Additional context
At first, the canvas was created through the participant array rendering and rendered by giving the participant userId as an id value to the canvas, but the re-rendering and the phenomenon that the rendered camera image stops when the 2nd participant out of the 3 users leaves is repeated. . Currently, the participant’s videos are superimposed on one canvas.
I want to render the component that is created every time a participant comes in. Is there a better way than assigning the userId to the corresponding canvas id value? I’ve seen the sample app, but I’m getting my understanding wrong.
I’m still inexperienced, so I hope you can help.

Hey @Deneb

Thanks for your feedback.

What’s your concern about video rendering? The dimension and position of the video depending on the parameters of stream.renderVideo. We suggest using a single canvas to hold these videos.

As the way of the sample app does, an array of participants serve as the state of videos. Listen to the user-added, user-updated and user-removed events to obtain participants’ video status. Then figure out the layout of each video cell. Finally, invoke the stream.renderVideo method to draw the video.


Thank you very much for your reply. Are you saying that you need to output video of multiple participants in one canvas?
In the first attempt, the screens of several participants overlapped on one canvas, so I assigned each canvas as userId. After hearing the answers, I found the correct way. Is there a guideline source that divides the participant’s screen into one canvas? I’ve been looking for it, but I can’t find it

1 Like

Hey @Deneb ,

Happy to hear you found the correct way! :slight_smile:

Yes! We have a great example of gallery view on our Video SDK Sample App:


thank you. May your day be full of good things :blush::blush:

1 Like

Happy to help! :slight_smile:


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