html2canvasで、google map が表示できない

Question

ワードプレスの投稿詳細ページにhtml2canvasとjsPDFを使って、一部のHTMLをPDF化しようとしています。
このhtmlの中にGoogle mapが埋め込んでいますが、canvas作成しても、Google mapは表示できず、空白のままです。

試したこと　その１

調べたところ、クロスドメインの問題で、表示できないとの記事があり、
html2canvasのオプションであるuseCORS：trueを付与すれば解決できるとのことでした。
以下、コードを試しましたが、一瞬コンソールに何かエラーが出るのですが、すぐ消えてしまうので、確認できない状態です。そして、google mapは空白のまま、canvasに出力され、解決できませんでした。

 $(function(){
      $('#js-pdf').on('click', function() {
        html2canvas(document.getElementById("printarea"),{
            scale:2,
            useCORS: true,
            allowTaint: false,
          }).then(function(canvas) {
              const imgData = canvas.toDataURL('image/png');
              const doc = new jsPDF();
              const width = doc.internal.pageSize.width;
              doc.addImage(imgData, 'PNG', width*0.05, width*0.05, width * 0.9, 0);
              doc.save("sample.pdf");
        });
      });
    });

試したこと　その2

また、クロスドメインで画像を直接ロードしようとする代わりに、ローカルプロキシを使用して画像を取得し、保存してhtml2canvasに渡すことができるhtml2canvas-proxyを使用すれば、解決策の記事がありましたので、
同階層にhtml2canvas-proxyからダウンロードしてきたhtml2canvasproxy.phを配置し、
cacheディレクトリ（html2canvas-proxyのREADMEの設定欄にdefine('H2CP_PATH', 'cache');が画像が保存されるフォルダと記入がありましたので、これでいいのかわからないですが、とりあえずこの名前にしました。）も同階層に作成して、以下のコードで試しました。
コンソールのエラーは無くなりましたが、google mapは空白のままで、なぜかその部分にワードプレスのTOP上部の画像がcanvasに出力される状態になりました。
ワードプレスのTOP上部の画像ではなく、google mapの地図画像を表示したいのですが、うまくいきません。

$(function(){
      $('#js-pdf').on('click', function() {
        html2canvas(document.getElementById("printarea"),{
            scale:2,
            proxy: './html2canvasproxy.php',
            useCORS: false,
          }).then(function(canvas) {
              const imgData = canvas.toDataURL('image/png');
              const doc = new jsPDF();
              const width = doc.internal.pageSize.width;
              doc.addImage(imgData, 'PNG', width*0.05, width*0.05, width * 0.9, 0);
              doc.save("sample.pdf");
        });
      });
    });

問題が解決できず、困っております。
こちら解決のご協力、アドバイスありましたら、大変助かります。

※情報不足がありましたら、申し訳ございません。

補足情報（ツールのバージョン）

html2canvas 1.0.0-alpha.12

Comments

[nonoshu]

「うまくいきませんでした。」の部分をもう少し詳しく書くと
解決方法の提案がより多く集まると思います。
例えば、エラーが出てプログラムが中断された、エラーも出ず画像も保存されなかった、などなど

[yamatatu]

アドバイスありがとうございます！
エラー内容も書き込むように致します。

Answer 1

自己解決致しました。
Google mapの埋め込みの表示は諦めて、html2canvasを実行する前に、google mapのiframeの表示を削除し、google map api staticのmapの画像を配置してからhtml2canvasを実行することで解決できました。

$(function(){
     $('#js-pdf').on('click', function() {
        $('#map').find('iframe').css('display','none');
        $('#map').append(`<img src="https://maps.googleapis.com/maps/api/staticmap?key=〇〇
                              &center=adress
                              &size=600x240
                              &zoom=14
                          />`)

        html2canvas(document.getElementById("printarea"),{
            scale:2,
            useCORS: true,
            allowTaint: false,

          }).then(function(canvas) {
            const imgData = canvas.toDataURL('image/png');
            const doc = new jsPDF();
            const width = doc.internal.pageSize.width;
            doc.addImage(imgData, 'PNG', width*0.05, width*0.05, width * 0.9, 0);

            const $failname = <?php echo date_i18n("YmdHi"); ?>+'.pdf'
            doc.save($failname);
        });

        
        
        setTimeout(function() {
          $('#map').find('iframe').css('display','inline');
          $('#map').find('img').css('display','none');
        }, 50);
        
      });
    });