ブラウザ上の特定のスクロール位置での画像取得（スクリーンショット)

Question

前提・実現したいこと

chromeの拡張機能で，javascriptを用いて，5秒毎にモニタに表示されているスクロール位置における画像を取得したいです．

発生している問題・エラーメッセージ

content_scriptsにてhtml2canvasを用いたのですが，指定したスクロール位置ではなく，一番上のスクロール位置の画像を取得してしまいます．取得した画像の大きさはモニタに表示されている大きさと同じにはなりました．
また，下記のようなエラーもでます．(msの数字は様々)
html2canvas以外にも方法がある場合は教えて欲しいです．

1771b0e9036 2302ms Error loading image

該当のソースコード

function screenshot(){
  var nowscroll = document.documentElement.scrollTop;
  html2canvas(
    document.body,{height: screen_height, scrollY: nowscroll, scale: 0.2}).then(function (canvas) {
      imgData = canvas.toDataURL();
  })
}
setInterval(screenshot,5 * 1000);

環境

html2canvas 1.0.0-rc.7

Answer 1

alternative to html2canvas.
Using the Screen Capture API
Using the Screen Capture API

Comments

[moko_7]

スクリーンショットのように画像として取得する方法がいまいちわかりません．
具体的に画像データを取得する方法を教えていただけると助かります．

[tanaka1107]

Sorry.Url is Mistake.
Please Look Examples in Url.

[moko_7]

画面のライブ動画として取得しているように見えるのですが，画像として取得することもできるのですか．

[tanaka1107]

CanvasRenderingContext2D.drawImage()

void ctx.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight);
image
An element to draw into the context. The specification permits any canvas image source (CanvasImageSource), specifically, a CSSImageValue, an HTMLImageElement, an SVGImageElement, an HTMLVideoElement, an HTMLCanvasElement, an ImageBitmap, or an OffscreenCanvas.

Answer 2

var nowscroll = document.documentElement.scrollTop;

動作確認していないので想像です。
・その座標は現時点のTOPが取得されますか？
・document.documentElementはどこを指定しているのか気になりました。
・エレメントの要素が動いていないため常に一定の値になっていたりしませんか？

Comments

[moko_7]

再確認してみたところ，5秒ごとのスクロール位置を取得できていることが確認できました．取得しているコードについてはこちらのサイトを参考にしました．https://shanabrian.com/web/javascript/window-scrollx-scrolly.php