使用 CCapture.js 从 PIXI 画布录制视频不起作用

时间:2021-06-10 13:48:54

标签: javascript canvas video pixi.js

我被一项任务困住了,也许有人有经验可以帮助我。

我使用 CCapture.js 录制视频,但是当我启动它时,一切都停止了,没有错误。

我的基本代码如下。

我还创建了其他示例,您也可以看到它也停在了开头:

https://codepen.io/fjtwmjzf-the-lessful/pen/zYZJwvQ

const
    videoContainer = document.getElementById('videoContainer'); 
    vw = 1280,
    vh = 720,
    videoUrl = 'assets/video/landscape.mp4';

PIXI.settings.RESOLUTION = 2;

app = new PIXI.Application({
  width: vw,
  height: vh,
  backgroundColor: bgColor,
});

const videoBg = PIXI.Texture.from(videoUrl);
const videoSprite = new PIXI.Sprite(videoBg);
const videoControler = videoSprite._texture.baseTexture.resource.source;

videoContainer.appendChild(app.view);

let capturer = new CCapture( { format: 'webm' } );

let n = 0;

app.ticker.add(() => {

    if(n == 0){
        capturer.start();
    }

    capturer.capture(app.view);

    if(videoControler.currentTime >= videoControler.duration){

        capturer.stop();

        capturer.save();

        app.ticker.destroy();

    }

    n += 1;

});

0 个答案:

没有答案
相关问题