Search code examples
ioshtmlhtml5-videoeaseljscreatejs

CreateJS EaselJS draw bitmap video in iOS

some code:

            video = document.createElement('video');
            video.setAttribute('webkit-playsinline');
            video.src = 'movie.mp4';
            var Video = new createjs.Bitmap(video);

            stage.addChild(Video);

I'm working on a rich media web app for iPad with CreateJS. On desktop browsers drawing a bitmap video to the canvas/stage works fine, but on iOS it does "nothing". I want to have an animated object above the video, so this is why, I think, the video needs to be drawn inside the canvas.

Does anyone have experience with that?

How can I achieve integrating a video with EaselJS and get it working on iPad/iPhone … ?

Solution

  • The function drawImage() isn't available to iOS and therefore, the method of drawing the video to the canvas directly isn't possible on iOS. See the explanation from this link below.

    Note: Video as a source for the canvas drawImage() method is not currently supported on iOS.