2

このメソッドで html2canvas を使用してスクリーンショットを作成しています:

 makeScreenshot: function (button) {
        html2canvas(document.body, {
            onrendered: function(canvas) {
                new Ext.Window({
                    title: 'Screenshot',
                    width: 800,
                    height: 600,
                    resizable: true,
                    autoScroll: true,
                    preventBodyReset: true,
                    html: '<img src="' + canvas.toDataURL("image/png") + '" height="800"/>'
                }).show();
            }
        });
    }

このスクリーンショットを取得する (スクリーンショットという名前のダイアログ/ウィンドウの左側の画像) ここに画像の説明を入力

ご覧のとおり、Google マップは生成されず、円だけです。また、チャートはスクリーンショットにありません。なにが問題ですか？

4

3 に答える 3

3

useCORS: trueを追加すると、この問題は解決します。

makeScreenshot: function (button) {
    html2canvas(document.body, {
        useCORS: true,
        onrendered: function(canvas) {
            new Ext.Window({
                title: 'Screenshot',
                width: 800,
                height: 600,
                resizable: true,
                autoScroll: true,
                preventBodyReset: true,
                html: '<img src="' + canvas.toDataURL("image/png") + '" height="800"/>'
            }).show();
        }
    });
}
于 2014-03-08T08:37:20.103 に答える
3

マップ タイルは、別のドメインにあるため、レンダリングできない画像です。

ドキュメントから：

制限事項

スクリプトが使用するすべての画像は、プロキシの助けを借りずに読み取ることができるようにするには、同じオリジンに存在する必要があります。

于 2013-09-11T15:40:59.160 に答える