使用html2canvas库获取更改div的多个屏幕截图？

Question

我有一个带有动画的div。我想拍摄每个动画周期更改的屏幕截图以生成图像。

下面是我要实现的代码

function getScreenshot() {

  html2canvas( $("#toBeZoomedOut") , {
        onrendered : function (canvas) {
                       console.log(" screenshot updated");
                       var extra_canvas= 
                        document.createElement("canvas");
                       extra_canvas.setAttribute('width', 300);
                        extra_canvas.setAttribute('height', 300);



                      var ctx = extra_canvas.getContext('2d');
                      ctx.drawImage(canvas, 0, 0, 300, 300, 0, 0, 300, 300);


        // the object that has been modified is in:



          document.querySelector("#toBeZoomedOut")
           .appendChild(extra_canvas)
    var image = Canvas2Image.convertToImage( extra_canvas , 
     extra_canvas.width , extra_canvas.height)
    //$("#img-out").append(extra_canvas);        
    document.querySelector("#toBeZoomedOut").removeChild(extra_canvas)

              }
          })
           }
       new ResizeSensor(jQuery('#toBeZoomedOut'), function(){ 
           console.log('content dimension changed');
          console.log("updated width", $("#toBeZoomedOut").width() )
           console.log("updated height" , $("#toBeZoomedOut").height() )
          getScreenshot()
           });

我接受获取动画周期div经历的图像