スポンサードリンク

Tag Archives: ストリートビュー

ストリートビュー地図(マップコネクト)の外にペグマンの表示位置を切り替えるボタンを設置する

以前の記事「Google Street View(ストリートビュー)のConnecting MapにMarkerを表示させる」で作成したストリートビューのマップコネクトの地図がベースです。

複数の駐車場の入り口を紹介するために、ストリートビューと地図を使ったマップコネクトを使用します。地図の外に複数のボタンを設けて、クリックするとそれぞれの駐車場の入り口を表示させるものです。

Read more »

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

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

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

  Read more »

V2 Street View 自動走行

V2 ですが、出発地点の地名、目的地の地名(または座標)を入力してボタンを押せば、自動でStreet View画面が切り替わり、 自動走行気分が味わえます。

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 »

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

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

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

きます。 Read more »

WordPressの記事内にGoogle MapやストリートビューをGoogle Maps API V3で表示させる方法(php+MySQl+XML)

◆ Google Maps API v3  / WordPressの記事内にGoogle Mapやストリートビュー(streetview)を表示させる方法。

WordPressの記事内にGoogle Mapやストリートビュー(streetview)を表示させようとしてスムースに行かなかったのでメモ。 記事内にGoogle Mapやストリートビュー(streetview)を表示させるための方法ですが、ポイントは次の通り。様々なやりかたがあると思いますが参考までに。 Read more »

カーナビのようにposition_changedイベントでペグマンを常に地図の中心座標に配置する/ストリートビュー(streetView)

◆ Google Maps API v3  / ストリートビュー(streetview)position_changedイベントでペグマンを地図の中心座標に配置

ストリートビュー(streetview)と地図(マップ)を同時に表示させるマップコネクトのストリートビューサンプルですが、ストリートビューをクリックして進んでいくと地図からペグマンがアウトしてししまいます。そこで、ストリートビューを動かしても常にペグマンが地図の中心座標にいるようにposition_changedイベントのソースを加えます。

(WordPress内でのストリートビューマップコネクト動作はコチラ
Read more »

ストリートビュー(streetview)だけを表示する

◆ Google Maps API v3  / ストリートビュー(streetview)だけを表示する

ストリートビュー(streetview)もV3で試していきます。残念なのは、iPhone(アイフォン)ではまだ見れないようですね。

ちょいといじって気がついたのが、ズームレベルが増えていたり、ピッチの設定が逆?になっていたことでしょうか。上向きが正の値になりますね。

それでは、基本から徐々に勉強していきます。

最初は、ともかくストリートビュー(streetview)表示するだけのサンプルについてです。基本は大事ですからね。

google先生のサンプルデモからもっともシンプルなストリートビューのソースは次のようになっています。StreetViewPanoramaOptionsは今回、positionとpovだけですが、まだまだいろいろありますので今後試していきたいと思いますが、日本語版は英文版よりプロパティの説明が抜けていますので、英文版を参考とした方がいいでしょう。

Read more »

Google マップ ストリートビュー 記事中にJavascript<script>を記述する

Google マップ ストリートビューのScriptをWordpressの記事の中に記述したら動作しなかったです。困ってたら、Scriptファイルを外部に置けば良いとのアドバイスが・・・・。

しかし、それでも動かん。 scrで外部URLを指定してもだめ・・・・。

しかし、知ってる方がいらっしゃいました。divで囲うとのこと。感謝!!

<div>
<script type=”text/javascript” src=”/script/hoge.js”></script>
</div>

その結果、動作! こんな感じ。 ↓

◆「Google マップ ストリートビュー + 地図」

ストリートビュー画面に合わせて、マップ上の青三角形が移動します。 オーバーレイ(青い道路)表示: 

スポンサードリンク