• ベストアンサー

マップの縦幅

Google Maps API V3で表示しているマップの縦幅のサイズをスプリクトを変更する方法が知りたいです。

  • AJAX
  • 回答数1
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
noname#206842
noname#206842
回答No.1

意味がよくわからないのですが?・・・ <section id="map"> </section> の中に、widthとheight,altを書けばいいのでは?・・・ 閲覧者の環境に合わせるのであれば、ResponsiveLyoutにすればいいのではないでしょうか?・・・ 表示するものは、文章であれ、図形であれ、地図であっても収縮は自在に、閲覧者環境に対応します。

関連するQ&A

  • Facebookでgoogle MAP

    Facebookページで、google MAPの複数マーカー表示を作りました。 しかしサーバーに上げ、ページを表示させようとすると、 このウェブサイトには別の Google Maps API キーが必要です。新しいキーは http://code.google.com/apis/maps/documentation/javascript/v2/introduction.html#Obtaining_Key で作成できます。 という文章が出て、地図が表示されません。 <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=APIキー" type="text/javascript"></script> Facebookではこの表記じゃダメなのでしょうか? ちなみにFacebookページはiframeで作っています。

  • Google static maps api と Google map api

    携帯用サイトでGoogle static maps API を使っているのですが, サイト内にテキストフォームを用意して住所を入力すると <img src="http://maps.google.com/staticmap? center=34.6663690,133.918588 ←ここを変更したい &size=250x300 &zoom=13 &maptype=mobile &key=..... > の内容を変更してその住所のマップを再表示するようにしたいと思っています. Google map APIで取得したlat, lngなどの情報を<img>内に反映させることって出来るのでしょうか?

  • Google Mapのマーカー非表示

    JavaScriptは初心者ですが、質問させてください。 Google Mapでルート表示をし、かつマーカー(おたまじゃくし)を非表示にしたいのですがGoogle Maps APIで可能でしょうか?またソースの例も教えていただけると嬉しいのですが。 よろしくお願いいたします。

  • google map の最新コントローラ

    こんにちは。 googlemapの最新コントローラって表示可能なのでしょうか? http://maps.google.co.jp/maps ここにでている左上のコントローラです。 ストリートビューと普通のマップに表示させたいです。 APIや、その他方法をもしご存知でしたらよろしくお願いします。

  • グーグルマップは以前のマップは無くなったのですか

    Google Mapsを以前のマップに固定戻してずっと使っていたのですが、 ついさっき使ったら、新しいのに勝手に変更されていました もしかして、以前のマップはもう使えなくなってしまったのでしょうか? もしそうだとしたら、サイドバーをずっと出しておく方法を教えてもらえますでしょうか?

  • GoogleMapAPI V3 にて、マップの表示がずれてしまいます。

    GoogleMapAPI V3 にて、マップの表示がずれてしまいます。 Google Map を表示させるタブをクリックすることで、 下記ソースの「id="gmap"」の箇所を display :block で表示させるようにしているのですが、 その際に、マップの表示がくずれてしまいます。 (もちろん「id="gmap"」を初期表示としていた場合はくずれません) V2では、 こちらや、 http://okwave.jp/qa/q4513879.html こちらで http://d.hatena.ne.jp/nitoyon/20050917/p2 解決出来たのですが、V3での解決方法が分かりません。。 どなたかご教授願えないでしょうか。 よろしくお願いいたします。 ----------------------------------------------- <head> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false" charset="utf-8"></script> <script type="text/javascript"> var latlng = new google.maps.LatLng(lat, lng); var mapOptions = { zoom: 18, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, }; var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); </script> </head> <body> ~略~ <--! 写真を表示させるタブ --> <div id="photo" style="display: block;"> ~略~ </div> <--! /写真を表示させるタブ --> <--! Google Map を表示させるタブ --> <div id="gmap" style="display: none;"> ~略~ <div id="inner"> <div id="map_canvas" style="width:600px; height:400px;"></div> ~略~ </div> </div> <--! /Google Map を表示させるタブ --> </body> -----------------------------------------------

  • Google Map APIのエラーについて

    6月20日以降にドメイン取得したサイトで、Google Mapの埋め込み表示が、添付画像のようなエラーになります。 調べてみて、 Google Map API キーが必要とありましたので、その手順でキーを取得しました。Google Mapを表示させるHTMLの<head>内の最下部に、Google Map API キーを以下のように書いてあります。 <script src="https://maps.googleapis.com/maps/api/js?key=(キー部)" type="text/javascript"></script> エラーの原因が、わかりません。 教えてください。 【関連情報】 ローカルPCでは、以下のソースできちんと表示されています。 <script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script> ・DOCTYPE 宣言文は、関係しますか? ・サイトはブロックされていません、 <meta name="ROBOTS" content="INDEX,FOLLOW">を記載。 ・1HTMLに2個の地図があります。複数のマーカーを立てています。 過去のサイトでは、エラーはありませんでした。 以上、エラ回避方法を教えてください!!!!!!

  • google map api v3の表示の不具合について教えてください

    google map api v3の表示の不具合について教えてください。 google map api v3を実装してマーカーをつけたのですが、あれこれ直していたら表示されない箇所ができてしまいました。(下記画像参照) ソースは下記です。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>××</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css/page.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> google.maps.event.addDomListener(window, 'load', function() { var mapdiv = document.getElementById("map"); var myOptions = { zoom: ズーム, center: new google.maps.LatLng(緯度, 経度), mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true }; var map = new google.maps.Map(mapdiv, myOptions); var marker = new google.maps.Marker({ position: new google.maps.LatLng(緯度, 経度), map: map, title: '名称' }); }); </script> </head> <div id="map"></div> お手数かけて申し訳ありませんが、ホームページ初心者なのでご指導いただければ助かります。 なにとぞよろしくお願い致します。

  • オリジナルの広告

    有料のサイトにおいてGoogle Maps API V3でマップ内の上か下にオリジナルの広告を表示する方法が知りたいです。

    • ベストアンサー
    • AJAX
  • Google マップにマーカーと同心円を入れたい

    2回目の質問です。前回の掲載期間で、解決できなかったため。 超初心者的質問ですが、教えてください。 Google マップのある地点を中心に、 マーカーと1km/5km/10kmなどの同心円(半透明で外側ライン)の2種を表示をしようとしています。 おのおの単独で表示することは、例がありわかりましたが、 その2つを同時に表示するために、scriptを変更するのがわかりません。 1. マーカーを表示するscript <script src="http://maps.google.com/maps?file=api&v=2&key=[あなたのAPIキー]" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { //地図を作成 var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng( 緯度 , 経度 ), 地図サイズ ); //マーカーを追加(国会議事堂) var marker = new GMarker(new GLatLng( 緯度 , 経度 )); map.addOverlay(marker); } } //]]> </script> 2. 同心円を表示するscript <script type='text/javascript' src='http://maps.google.com/maps/api/js?sensor=false'></script> <div id='map' style='width:700px; height:400px;'><br /></div> <script type="text/javascript"> var myLatLng = new google.maps.LatLng( 緯度 , 経度 ); var myMap = new google.maps.Map(document.getElementById('map'), { zoom: 地図サイズ, center: myLatLng, mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true, scrollwheel: false }); new google.maps.Circle({ center: myLatLng, // 中心点(google.maps.LatLng) fillColor: '#ff0000', // 塗りつぶし色 fillOpacity: 0.5, // 塗りつぶし透過度(0: 透明 ⇔ 1:不透明) map: myMap, // 表示させる地図(google.maps.Map) radius: 95330, // 半径(m) strokeColor: '#ff0000', // 外周色 strokeOpacity: 1, // 外周透過度(0: 透明 ⇔ 1:不透明) strokeWeight: 1 // 外周太さ(ピクセル) }); </script> この2ヶのscriptをどのようにつなげば、解決できるか教えてください。 JavaScriptの基本知識不足のため、書いていただければ助かります。

専門家に質問してみよう