以前の記事「Google Street View（ストリートビュー）のConnecting MapにMarkerを表示させる」で作成したストリートビューのマップコネクトの地図がベースです。
複数の駐車場の入り口を紹介するために、ストリートビューと地図を使ったマップコネクトを使用します。地図の外に複数のボタンを設けて、クリックするとそれぞれの駐車場の入り口を表示させるものです。
スポンサードリンク
Tag Archives: Google Maps API ｖ3
ストリートビュー地図（マップコネクト）の外にペグマンの表示位置を切り替えるボタンを設置する
Posted by 管理人 on 2012年5月2日
None comments | 1,512 views
マウスドラッグでアイコン（マーカー）をスライドして移動可能にする。google.maps.MarkerのraiseOnDragの指定方法
Posted by 管理人 on 2011年2月20日
None comments | 2,384 views
◆Google Maps API V3 のアイコン（マーカー）をスライドして移動可能にする。raiseOnDragの指定
移動可能なマーカー（アイコン）をドラッグ＆ドロップ（飛び跳ねるアニメーションでなく、スライドさせる指定です。（飛び跳ねるアニメーションの場合はコチラ）
スケートリンクを移動させるイメージですな。
マーカー（アイコン）をスライドで移動できるようにするためには、draggableだけでなく、raiseOnDrag指定する必要があります。
なお、日本語リファレンスには、載っていないので英語版からの紹介です。
iPhone（アイフォン）でのユーザの現在座標位置を地図に表示する地理位置座標サービス（Geolocation）のGoogle Mapでの使い方とは？／watchPosition+clearWatchの切り替え方法
Posted by 管理人 on 2011年1月16日
1 comments | 8,748 views
◆Google Maps JavaScript API V3 + Geolocation （watchPosition+clearWatch）
iPhone（アイフォン）の地図が見れるようになりました。自分の座標位置をGPS情報から収得できるようにもなりました。
しかし、以前に学んだwatchPositionとcurrentPositionだけでは、iPhone（アイフォン）用として使いにくいことが判明。
getcurrentPosition()では、収得できる座標の制度が悪すぎる。100ｍ近くずれることがあります。
一方、watchPosition()を使うと、Google Mapで位置をずらすと数秒後に現在地に戻されてゆっくり地図を見ることもできません。
さて、どうすればいい？
完成したサンプルは、次のようなイメージ。左が追跡中。右がGeoLocation（地理位置座標サービス）の停止中。
詳しくは、下記参照。
ユーザの現在座標位置を収得する方法とは？／Geolocation + iPhone（アイフォン）+Google Maps API v3
Posted by 管理人 on 2010年11月6日
None comments | 13,872 views
◆Google Maps JavaScript API V3 + Geolocation （現在位置の座標情報を取得する）
iPhone（アイフォン）で地図が見れるようになりましたので、出かけたときに自分の位置をGPS情報から収得したいでうすよね。さて、どうすればいい？ いつものように、Google Maps JavaScript API V3のトップページからスタート。Google Maps JavaScript API V3 – 基本ページに、ユーザーの現在地の検出（Geolocation）について説明があり、下記のような内容。
- iPhone（アイフォン）で位置情報を収得するのは、Google Maps API では無い。
- iPhone（アイフォン）のブラウザsafariがサポートしている”W3C Geolocation 規格”の”Geolocation” を用いる。
- ”W3C Geolocation 規格”で位置を収得できない場合、Google Gears Geolocationを使う方法がある。
このページにあるサンプルコードをみると
// Try W3C Geolocation (Preferred) if(navigator.geolocation) { browserSupportFlag = true; navigator.geolocation.getCurrentPosition(function(position) { initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); map.setCenter(initialLocation); }, function() { handleNoGeolocation(browserSupportFlag); });
Apple iPhone（アイフォン）で正確な地理的座標位置を取得するメソッドの比較。／Googel Maps API v3 Geolocation
Posted by 管理人 on 2010年11月6日
1 comments | 5,197 views
◆ navigator.geolocation.getCurrentPosition() と navigator.geolocation.watchPosition()メソッド
iPhone（アイフォン）の座標収得で使用するnavigator.geolocation.getCurrentPosition()、と navigator.geolocation.watchPosition()メソッドの大きな違いは、都度、現在位置をユーザが読み込んで位置情報を収得するのか、それとも連続的に収得するだけだと思っていたが、正確な座標制度を得るには、navigator.geolocation.watchPosition()を使った方が良いとの記事を見つけた。 ＜記事URL＞ Read more »
Google Maps API V3の地図（マップ）をPC、スマートフォンで見れるように表示させるscriptとメタタグの設定
Posted by 管理人 on 2010年11月1日
None comments | 20,457 views
Google Maps API ｖ3の地図をiPhone（アイフォン）やスマートフォンで見れるように表示させるには、次のメタタグとscriptタグを<header>タグ内に記述しておく必要があります。
ここで注意点です。
Google先生のデフォルトは、
<meta name=”viewport” content=”initial-scale=1.0, user-scalable=no” />
<script type=”text/javascript” src=”http://maps.google.com/maps/api/js?sensor=set_to_true_or_false“></script>
となっています。
常にインフォウィンドウを1つだけ表示する方法／Google Maps JavaScript API V3
Posted by 管理人 on 2010年10月24日
1 comments | 10,747 views
◆インフォウィンドウを1つだけ表示する方法
Google Maps API ｖ3で気がついたのがインフォウィンドウの開き方。一度クリックファンクションであるマーカーのインフォウィンドウを開くと、次のアイコンをクリックしてもそのまま残ってしまう。
XMLファイルを読み込んで表示する練習をしていた時は、気づかなかった。何故かって、インフォウィンドウが常に一つだから。
しかし、アイコンの種類を変更するサンプルを作成時、次のアイコンをクリックしても前のインフォウィンドウが消えないことに気が付きました。
え～。V3では、わざわざcloseコマンドを使わなければ、インフォウィンフドウを閉じることが出来ないようだ。
良くわからんので、Googleのサンプルを探してたらありました。
ドラッグ＆ドロップマウスで移動可能なマーカ（アイコン）の指定方法／Google Maps API v3
Posted by 管理人 on 2010年10月23日
None comments | 3,721 views
マーカーのアイコン種類を変更する＋影指定／Google Maps JavaScript API V3
Posted by 管理人 on 2010年10月21日
None comments | 21,096 views
アイコン（マーカー）+インフォウィンドウ地図に表示／Google Maps JavaScript API V3
Posted by 管理人 on 2010年10月17日
None comments | 6,692 views
Google Maps API v3で地図を表示させたので、こんどはやはりマーカーとインフォウィンドウ（情報ウィンドウ）を表示させてみる。マーカとインフォウィンドウは最低限使います。
先生は、googleコードのインフォウィンドウの箇所。オーストラリアの中央にマーカーを表示し、マーカーをクリックすると情報ウィンドウが表示されるもの。
◆Google Maps V3 インフォウィンドウ
うーむ。気になったのは、インフォウィンドウの大きさ。
設定は、情報ウィンドウのサイズは自動調整だが、設定出来るようだ。なお、インフォウィンドウの縦・横スクロールを無効にするには、どうしたらいい？
スポンサードリンク
