google map(iframe部分)が印刷できない

Question

現在HTML,javascriptでwebページを作成しています。
GoogleMapをgoogleMapAPIを使って緯度経度から該当住所の地図を表示しており、iframeタグに実装している形になっています。
このページの地図部分を印刷したいと思っているのですが、地図が左上の一部しか印刷されません。

そこで質問があるのですが、
google map(iframe部分)を印刷するためにはどうしたらいいでしょうか？

iframeタグにはonloadイベントが設定されておりおり、緯度経度から地図を作成するメソッドを呼び出しています。
また特定エリアのみを印刷するため、printThis.jsを使っています。
https://increment-log.com/jquery-print-this/

bodyタグの1番下に以下を記述

<script src="js/jquery.printThis.js"></script> <script> $(function(){ $("#print-btn").on("click",function(){ $("#map").printThis(); }); }); </script>

bodyタグに埋め込みでonloadイベントがインラインで書かれているので、地図が読み込まれてからprintThisの処理が走ってると思うので、いけそうなものなのですが、
chromeの印刷プレビューを見ると、地図の左上が映っているだけです。

読み込み順が原因で、地図が読み込み終わる前に、印刷部分を切り取ったのかなと思ったのですが。

iframeタグに関するものなのでしょうか？いろいろ模索はしているのですが、解決できていません。
チカラを貸してください。もしわかる方、アドバイス頂ける方がいらっしゃいましたらよろしくお願い致します。

Answer 1

印刷用CSSを使う方法にシフトしました。
media＝printを使ってCSSを呼び出し、印刷時だけサイド部分を非表示にします。
その方法だとうまくいきそうです。