canvas element to stream

burak guder

Hi Flah Phoner

I actively use your system and I am very satisfied. I am developing a product and I want to use flashphoner for it.
I want to add screen sharing and camera to canvas element and to send this element as a stream

I attached an image



Staff member
Good day.
Please look at this doc to learn how capture stream from canvas. Also please look at the code example whish shows how to draw video to canvas from another video element.
So you can capture screen to one invisible video element, capture webcam to another one, then add play event listener to both elements like this:
    videoElement.addEventListener("play", function () {
        var $this = this;
        (function loop() {
            if (!$this.paused && !$this.ended) {
                canvasContext.drawImage($this, 0, 0);
                setTimeout(loop, 1000 / 30); // drawing at 30fps
    }, 0);
Note that you cannot set resolution/bitrate to canvas stream.