お世話になります。
Google maps api v3を使用して、WEBサイトに地図をアップしたのですが、
お客様から印刷すると地図の表示がおかくしくなると指摘されました。
印刷プレビューから表示がおかしくなるとの事です。(その方はWinXP IE8)
いろいろ原因を探したのですがよく分からず、こちらでお力をお貸し頂ければと思います。
こちらで分かった事といえば、印刷時、設定用紙の半分もしくは3分の2より下に地図が
配置されていると、表示がおかしくなるということです。
(1枚目に地図が全部配置されているのに、2枚目にも地図の下部のみが移ってしまい、地図の直後にあるコンテンツを隠してしまう。その時、1枚目の地図もおかしい等)
(ただし、地図を設定用紙の半分より上に配置すると地図等は問題なく表示・印刷される。ポリゴンも隠れない)
この現象は私が作成したmapだけでなく、他のサイトのGoogle mapsでも同じ現象のような気がします。(たまたまでしょうか?)
回避方法等、どうぞお力をお貸しくださいませ。
<script type="text/javascript">
<!--
google.maps.event.addDomListener(window, 'load', function()
{
// 地図の設定
var mapOptions = {
zoom: 16,
center: new google.maps.LatLng(30.622401694889774, 138.72735120224),
mapTypeId: google.maps.MapTypeId.ROADMAP,
scaleControl: true
};
var mapObj = new google.maps.Map(document.getElementById('gmap'), mapOptions);
// 作成するポリゴン外枠座標の配列
var points = [
new google.maps.LatLng(30.62244094020011, 138.7270232439041),
new google.maps.LatLng(30.62266551021649, 138.7274872660637),
new google.maps.LatLng(30.6226175438582, 138.7275274991989),
new google.maps.LatLng(30.62263062559512, 138.72755163908005),
new google.maps.LatLng(30.622401694889774, 138.72773402929306),
new google.maps.LatLng(30.6224191372523, 138.72777426242828),
new google.maps.LatLng(30.622251254355135, 138.72789764404297),
new google.maps.LatLng(30.62193729058848, 138.7273102402687),
new google.maps.LatLng(30.622377711635124, 138.72697496414184),
new google.maps.LatLng(30.622410416071524, 138.72704201936722)
];
// ポリゴンのオプションを設定
var polygonOptions = {
path: points,
strokeWeight: 2,
strokeColor: "#ff0000",
strokeOpacity: 0.5,
fillColor: "#ff0000",
fillOpacity: 0.3,
title:"ポリゴン"
};
// ポリゴンを設定
var polygon = new google.maps.Polygon(polygonOptions);
polygon.setMap(mapObj);
// クリック処理・吹き出しのコメント設定
google.maps.event.addListener(polygon, 'click', function() {
new google.maps.InfoWindow({
content: '品川testホテル<br>〒141-0001<br>東京都品川区',
maxWidth : 200,
position: new google.maps.LatLng(30.622401694889774, 138.72735120224)
}).open(mapObj);
});
//polygonのみ最初から吹き出しを表示させる(擬似的にクリックイベントを発生させる)
google.maps.event.trigger(polygon,'click');
});
//-->
</script>
【CSS】
#gmap {
width: 630px;
height: 300px;
margin-left: 30px;
border: #ccc 1px solid;
}
※緯度・軽度は正確ではありません。申し訳ありません。
※地図の前後にはfloatが掛かったコンテンツがあります。(clearfixで解除済み)
※専門用語はよく分からないので、出来るだけ分かるように記載頂けると幸いです。
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時:
Google Maps API のプログラムは問題ないようです。
印刷に関しては、CSSの影響のが大きいので、それを中心に試してみるといいと思います。
印刷用のCSSを作るときに float は制御が難しいので、用紙サイズを限定して
position = absolute で配置を決めることをおすすめします。
http://www.lucky-bag.com/archives/2005/08/print_ …
http://blog.btmup.com/css/recover-browser-printi …
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・【大喜利】【投稿~11/12】 急に朝起こしてきた母親に言われた一言とは?
- ・好きな和訳タイトルを教えてください
- ・うちのカレーにはこれが入ってる!って食材ありますか?
- ・好きな「お肉」は?
- ・あなたは何にトキメキますか?
- ・おすすめのモーニング・朝食メニューを教えて!
- ・「覚え間違い」を教えてください!
- ・とっておきの手土産を教えて
- ・「平成」を感じるもの
- ・秘密基地、どこに作った?
- ・【お題】NEW演歌
- ・カンパ〜イ!←最初の1杯目、なに頼む?
- ・一回も披露したことのない豆知識
- ・これ何て呼びますか
- ・チョコミントアイス
- ・初めて自分の家と他人の家が違う、と意識した時
- ・「これはヤバかったな」という遅刻エピソード
- ・これ何て呼びますか Part2
- ・許せない心理テスト
- ・この人頭いいなと思ったエピソード
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・あなたの習慣について教えてください!!
- ・ハマっている「お菓子」を教えて!
- ・高校三年生の合唱祭で何を歌いましたか?
- ・【大喜利】【投稿~11/1】 存在しそうで存在しないモノマネ芸人の名前を教えてください
- ・好きなおでんの具材ドラフト会議しましょう
- ・餃子を食べるとき、何をつけますか?
- ・あなたの「必」の書き順を教えてください
- ・ギリギリ行けるお一人様のライン
- ・10代と話して驚いたこと
- ・家の中でのこだわりスペースはどこですか?
- ・つい集めてしまうものはなんですか?
- ・自分のセンスや笑いの好みに影響を受けた作品を教えて
- ・【お題】引っかけ問題(締め切り10月27日(日)23時)
- ・大人になっても苦手な食べ物、ありますか?
- ・14歳の自分に衝撃の事実を告げてください
- ・架空の映画のネタバレレビュー
- ・「お昼の放送」の思い出
- ・昨日見た夢を教えて下さい
- ・ちょっと先の未来クイズ第4問
- ・【大喜利】【投稿~10/21(月)】買ったばかりの自転車を分解してひと言
- ・メモのコツを教えてください!
- ・CDの保有枚数を教えてください
- ・ホテルを選ぶとき、これだけは譲れない条件TOP3は?
- ・家・車以外で、人生で一番奮発した買い物
- ・人生最悪の忘れ物
- ・【コナン30周年】嘘でしょ!?と思った○○周年を教えて【ハルヒ20周年】
- ・あなたの習慣について教えてください!!
- ・都道府県穴埋めゲーム
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
vba クリップボードクリアにつ...
-
Google ColaboでGUI作成
-
プログラミングについて プログ...
-
フロントエンドエンジニアをし...
-
VBAでパワーシェルを実行したい...
-
プログラミングのやり方ざっく...
-
アセンブリ言語について。
-
PythonのTkinter詳しい方へ。画...
-
AIのプログラムについて教えて...
-
テキストファイルの1行目のみを...
-
楽しくて最高のプログラミング...
-
プログラミングの進学について
-
過剰なオブジェクト指向脳から...
-
Web初心者です。 簡易的なWebペ...
-
Pythonでの文字列からfloatへの...
-
VBSでテキストファイルの2行目...
-
powershellスクリプトで出力し...
-
fortran write文について マチ...
-
コトリン言語について。
-
ExcelVBAでFormulaR1C1を列範囲...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
カンマ区切りのデータを配列に...
-
二つのbxsliderをレスポンシブ...
-
迷路探索プログラムを作るには...
-
googleMapでアイコン変更すると...
-
google maps api v3のルート検索
-
webサービス上のkmlをgooglemap...
-
Google maps api v3と印刷について
-
Googleマップのピンをクリック...
-
C言語の 配列の中 出力について
-
たくさんの経由地がある巡回ル...
-
Google Maps:同マップ内でそれ...
-
JavaScriptでtabindexの変更っ...
-
階層別の組織図の自動作成について
-
readyStateが4にならない原因
-
Javascriptを使ってQRコード読...
-
jQueryのアコーディオン一番目...
-
インラインフレームを自動更新...
-
JavascriptからPHPへのAjax通信...
-
SQLのmaxで求めた値を変数に代...
-
jQueryのblockUIをformのボタン...
おすすめ情報