0

あなたが提供できるどんな助けにも前もって感謝します！うまく機能しているように見えるマップツールを作成しました。地図、ドラッグ可能なルート、複数のウェイポイント、および完全で動的なdirections_panelを取得します。ユーザーがこのWebページを印刷して、map_canvasとdirections_panelを取得できるようにしたいと思います。テストでは、印刷プレビューにmap_canvasが含まれていましたが、途中のどこかで、Webページを印刷するとmap_canvasが表示されなくなりました。印刷時に表示するにはどうすればよいですか？

これが私のHTMLです。

<div id="map-route-page">
<div id="map_canvas"></div>
<div class="clear"></div>
<div class="map-buttons">
<input type="submit" id="showform" value="Edit Map">
<a href="javascript:if(window.print)window.print()"><input type="submit" id="printpage" value="Print this Page"></a>
</div>
<div class="clear"></div>
<div id="directions_panel"></div>
</div>

更新：CSSをいじって、「position：relative」と「-webkit-transform：translateZ（0）;」を削除すると、マップが印刷可能になることがわかりました。#map_canvasから。残念ながら、これにより印刷されたページ全体が奇妙に見えます（マップが大きすぎて位置がずれています）。これを修正するために追加する必要のある別のタグまたはCSSはありますか？

4

1 に答える 1

1

ふぅ！試行錯誤の末、解決策を見つけました。main.css ファイルで #map_canvas の幅と高さを指定しましたが、print.css ファイルではこれらの属性を指定していませんでした。これを機能させるために、position:relative または -webkit-transform 属性を編集しませんでした。

于 2013-01-14T14:29:15.387 に答える