Делать несколько скриншотов изменения div с помощью библиотеки html2canvas? - PullRequest
0 голосов
/ 08 июля 2019

У меня есть 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()
           });

Я принимаю, чтобы получить изображения анимации, цикл проходит через

...