スポンサードリンク

Category Archives: Google Maps API v3

Google Street View(ストリートビュー)のConnecting MapにMarkerを表示させるサンプルデモ(Demo)

コメントを頂いたので、StreetViewのコネクティングマップにマーカーを表示させてみます。

MySQLではソースが判りにくいかと・・・・・この記事で作成していた地図と このデモサンプル(マップコネクト)を掛け合わせて少し調整して完成。

  Read more »

目的地アイコン(マーカー)をクリックして、ルート検索結果と距離を表示させる方法の続き

この記事でご要求をいただいたので、記事を付けたし。

 

余計なソースを削除して、最低限のソースだけにしたサンプル地図

目的地アイコン(マーカー)をクリックして、ルート検索結果と距離を表示させるデモ

Read more »

目的地アイコン(マーカー)をクリックして現在地からのルート検索結果のルートポリライン(Polylines)と距離を表示させる方法/ルート検索API(Direction API)

 ◆Google Maps API V3  目的地アイコン(マーカー)をクリックして現在地からのルート検索結果のルートポリライン(Polylines)と距離を表示

DirectionsRendererオプションの3つの使い方(マーカ削除ルートポリライン削除インフォウィンドウの非表示)を覚えたところで、目的の地図を作成していきます。

<地図構成>

地図に複数のアイコン(マーカー)を読み込ませておき、それぞれのマーカーをクリックしたら、模擬でセットした現在地アイコンからのルートと距離を表示させます。

1.不要な緑色のディレクションアイコンを消す。

2.現在地を模擬でセット

3.アイコンをクリックしたらルート検索を行う。

4.距離変数を取り出してインフォウィンドウに表示させる

ってなところでしょうか。

Read more »

ストリートビューの青い道路を常に表示させるオーバーレイヤーに変わるImageMapType

◆Google Maps V3 ストリートビューの青い道路をImageMapTypeを使い地図に表示させる

v2では、streetviewのオーバーレイヤーを指定すれば、ストリートビューの対応している道路が青くハイライトされたのですが、Google Maps API V3では、簡単に1行では指定できないようです。

地図上でペグマンを持ち上げると青い道路が表示されますが、それでは不便。常にstreetview対応の青い道路がハイライト表示されるようにしてみます。

google先生のページを調べると「StreetViewTileData オブジェクトの仕様」というのがあります。 ここで、getTileUrl(pano:string, tileZoom:number, tileX:number, tileY:number)のメソッドを使い、 オーバーレイではなく、ImageMapTypeクラスを使い地図上に表示させる方法があるようです。

Read more »

交通渋滞情報レイヤーと交通情報ImageMapType

リアルタイムの交通渋滞情報を Google Maps API では TrafficLayer を使用して地図に取り込むことができます。いくつか方法があるようです。

◆その1

 簡単な方法としては、「交通レイヤー」を使います。既にあるソースのmap = new google.maps.Map(document.getElementById(“map_canvas”), myOptions); の下に、下記scriptを記述すればOKです。

Read more »

Google Maps APIサービスが使用可能なサポートされる国・都市の一覧表

Google Maps APIサービスがサポートする国・都市は、現在218の地域に広がっています。

ただし、APIサービスの内容は、地域によりまちまち。 map tiles、geocoding(ジオコーデイング)、street view(ストリートビュー)、traffic(交通情報)、driving directions(ルート検索)、biking directions(自転車ルート検索)の対応状況は下記リンクの表から確認で

きます。 Read more »

サンプルデモマップ/パノラミオ(panoramio)写真をタグで検索するInputフォームを追加する。

地図に表示させるパノラミオ(panoramio)のサムネイルをタグ指定するサンプル

個別ブログ記事に戻る

Google Maps API v3使い方のサンプルデモマップ一覧に戻る

Google Maps API v3の使い方の記事一覧に戻る

Read more »

サンプルデモマップ/地図に表示させるパノラミオ(panoramio)写真をタグで指定する。

地図に表示させるパノラミオ(panoramio)のサムネイルをタグ指定するサンプル

個別ブログ記事に戻る

Google Maps API v3使い方のサンプルデモマップ一覧に戻る

Google Maps API v3の使い方の記事一覧に戻る

Read more »

サンプルデモマップ/Google Map にパノラミオ(panoramio)の写真サムネイルを地図にオーバーレイ(overlay)表示させる

Google Map にパノラミオ(panoramio)の写真サムネイルを地図にオーバーレイ(overlay)表示させるサンプル

個別ブログ記事に戻る

Google Maps API v3使い方のサンプルデモマップ一覧に戻る

Google Maps API v3の使い方の記事一覧に戻る

Read more »

Google Map にパノラミオ(panoramio)の写真サムネイルを地図にオーバーレイ(overlay)表示させる

◆ Google Maps API v3  パノラミオ(panoramio)の写真オーバーレイ(overlay)を表示させる

Google Maps Api の日本語リファレンスにはありませんが、英語リファレンスでは、panoramio(パノラミオ)のライブラリーが使えるようになっています。左が日本語リファレンス、右が英語版。

英語版の右下方に、panoramioのレイヤー(写真ライブラリ)が使えるリファレンスがあります。地図上に小さな写真のサムネイルを表示することが出来、クリックするとインフォウィンドウの中に写真が表示されます。このレイヤーオプションのプロパティ設定で、検索タグ指定で特定の写真のみを地図上に選択して表示させたり、インフォウィンドウの非表示設定などが出来るようになっています。

、表示と、そのオプション(写真をクリック)

 

Read more »

3 / 1012345...10...最後 »

スポンサードリンク