js使用的canvas实现录像功能

录影这里通过 html2canvas 将视频区域绘制到canvas 上，然后再通过requestAnimationFrame方法进行持续执行当前绘制方法，注意结束定时器的条件。最后通过 RecordRTC(self.canvasEl, { type: 'canvas' }); 将当前画布中执行的过程录制下来。可以参考下边这个demo示例。 

   
<style>
    html, body {
        margin: 0!important;
        padding: 0!important;
    }

    video {
        width: auto;
        max-width: 100%;
    }
</style>

<title>HTML Element Recording | RecordRTC</title>
<h1>HTML Element Recording using RecordRTC</h1>

<br>

<button id="btn-start-recording">Start Recording</button>
<button id="btn-stop-recording" disabled>Stop Recording</button>

<hr>
<div style="display: none;">
    <video controls autoplay playsinline id="preview-video"></video><