I'm working on canvas with two layer which is one over the other. I'm having video from the video, I'm trying to get the stream using drawImage in a canvas, and that video is coming from another peer so it will be in the media stream and I'm using draw Image, I got that media stream in my canvas. I'm making this canvas as transparency. For that
passctx.drawImage($this, 0, 0);
var imageData = passctx.getImageData(0, 0, canvas1.width, canvas1.height);
var data = imageData.data;
var removeBlack = function () {
for (var i = 0; i < data.length; i += 4) {
f (data[i] + data[i + 1] + data[i + 2] <10) {
data[i + 3] = 0; // alpha
}
}
passctx.putImageData(imageData, 0, 0);
};
//removing the alpha channel from the canvas
removeBlack();[enter image description here][1]
This works fine with Chrome, Opera and Firefox, these all receive only objects/diagrams in canvas without the black screen but not on safari it still returning the media stream with a black screen. Help will be greatly appreciated.