マップの作り方と細かな設定

var map_center = new google.maps.LatLng(35.701846, 139.626761); var map_options = { mapTypeId: google.maps.Map…

Read more

Google Maps オリジナルデザインにカスタマイズ

Google Mapを描画する関数内に http://code.prostaff1.com/sample/10_google-map/styledmaps/ こちらで生成したjsonコードを記入(次のコードは例) // …

Read more

埋め込んだGoogle Mapのコントロールアイコンが崩れているとき

自サイトのCSS原因のようです。 参考したサイトでは以下のように指定すると直るとかいてありました。 mapField は表示するGoogle MapのIDに変更して下さい。 #mapField img { max-wid…

Read more

GoogleMap 情報ウィンドウを表示させるときの注意

開発中に情報ウィンドウが、一瞬変な所に表示される問題がありました。 これは、情報ウィンドウの場所を開く前に伝えられていなかった事が問題の原因だったようです。 //最初のコード infowindow.setContent(…

Read more

google map 上で情報ウィンドウが表示された後すぐに消えてしまう

情報ウィンドウが表示された後、すぐに消えてしまうことがありました。 jQuery(document).ready(function($) { $.ajax({ type: ‘POST’, url: url, dataTy…

Read more

情報ウィンドウの表示

忘れていたandよく使うので、初歩的な内容ですがハックに残しておきます。 // objectの生成 var infowindow = new google.maps.InfoWindow({ content: ‘hell…

Read more

Google Mapで表示する情報ウィンドウのデザインをカスタマイズする

Google Map APIで地図上に表示する情報ウィンドウのデザインのカスタマイズは、マーカーの場合とは少し異なります。 マーカーのようにアイコンを指定することはできないようです。 // 情報ウィンドウの中身の設定 v…

Read more

Google Map 情報ウィンドウの表示と非表示

Google Maps APIで情報ウィンドウを扱う際の表示と非表示についてです。特にcloseの処理を忘れると一度に複数の情報ウィンドウが表示されてしまうこともあるので注意が必要です。 // mapで情報ウィンドウを表…

Read more

Googleマップの色やスタイルを簡単にテストできる「スタイル化マップ ウィザード」

Google Maps APIで作成しているGoogleマップは、地形の色やラベルの色を自由に変更することができます。 0から変更していきたいという場合は以下のサイトが分かりやすかったです。 Googleマップをイラスト…

Read more

Get_Bounds()の使用上の注意

get_Bounds()を使えば、右上及び左下の座標を取ることが可能です。しかし、これを用いて実際値を取得しようとしたのですが上手くいかず、、、、 結果として原因は、地図のズーム処理によるものでした。getBounds(…

Read more

Google mapの情報ウインドウのCloseボタンをカスタマイズする

CSSに以下を加えます .gm-style-iw + div img { display: none; } .gm-style-iw + div &:after { content: ‘×’; font-size…

Read more

Google Map エラー対処

まず自分で処理できたエラーから。 You have included the Google Maps API multiple times on this page これは、index.html内でGoogle Mapの…

Read more

Google Map カスタマイズ icon編

function create_marker(lat, lng, title) { var icon = new google.maps.MarkerImage(‘iconのurl'(pathでもok), /*アイコンの…

Read more

Google Mapのカスタマイズ MapStyle編

var styleOptions =[ ………(適当なコード) ]; var styledMapOptions = {name: ‘適当につけてOK ‘}; var sampleType = new goog…

Read more

Googleマップで表示領域に中にマーカーがあるかどうか

mapとmarkerは定義しれあるものとします。 mapからgetBoundsで表示領域を取得し表示領域の中にcontains関数でバウンスの中に含まれるかどうかを判定します。 containsの引数はlatlngオブジ…

Read more