前のページではGoogleマップを使って地図の座標を調べましたが、Google Maps APIにも中心座標を取得したり地図の表示領域(左下隅と右上隅の座標)を調べることができます。ここではGoogle Maps APIを使って座標などの情報を取得する方法について解説します。 1.地図の中心座標を取得 2.地図が表示されている領域を座標で取得 3.サンプルコード 地図の中心座標を取得 現在表示されている中心の座標を取得するにはgoogle.maps.Mapクラスで用意されているgetCenterメソッドを使います。 getCenter() Description: Returns the position displayed at the center of the map. Note that this LatLng object is not wrapped. See LatLng f
Google mapsを使っていて、マップの倍率を操作するsetZoomとgetZoomが使用できないことがありましたので、そのときの対策方法です。 まず、動かなかったコードですが、次のようになります。 map.fitBounds (bounds); if (map.getZoom() > 10){ map.setZoom(10); } fitBoundsを使って、指定した地点を自動的にすべて含むように調整した後、ズームしすぎていたらズームを調整するというものです。 しかし、これではズームの調整が上手くいきません。 これを解消するには次のようにコーディングします。 map.fitBounds (bounds); var listener = google.maps.event.addListener(map, “idle”, function() { if (map.getZoom() >
※本記事はアフィリエイトプログラムによる収益を得ています 一晩でやってくれました Google&スクウェア・エニックスのエイプリルフールネタとして公開された「Googleマップ8ビット」を使ったタワーディフェンスゲームがさっそく登場している。Google Maps APIを使い、「ドラクエ風」になった地図上でタワーディフェンスが楽しめる。 作ったのはプログラマーのDucan Barclay氏で、タイトルは「MapsTD」。最初にどこを本拠地にするか聞かれるので、好きな場所を選んでゲームスタート。右上の「START」を押すと、自動で設定された青いラインの上を敵が攻めてくるので、塔を配置してこれを迎え撃っていく。敵を倒しきれず、本拠地まで攻め込まれてしまうとゲーム・オーバーだ。 ためしに新宿で遊んでみた。自分の知っている場所で遊ぶと楽しい タワーは全部で6種類あって、それぞれ攻撃力や連射力など
システムエンジニア・プログラマです。 Webと地図が絡む話題を手広くフォロー。 技術に深入りしない程度に気軽にやっていきます。 ドキュメントを見ながら実験コードを書いていて、ちょっとやり方 を調べたのでメモ。 逆ジオコーディングや空間検索をするときに、地図上をクリックす ることでその位置を入力として受け取る状態であることを視覚的に わかってもらうために使います。 流れとして、逆ジオコーディングでいうと、①まず機能を起動する ボタンをユーザがクリック②地図上のクリックを受け付ける状態に (このとき、それがユーザにわかるようにマウスカーソルを指の形 に変更)③ユーザが地図をクリック(入力が終わったので、マウス カーソルを戻す)④クリックした位置に対応する住所をGoogle Maps APIの逆ジオコーディングの機能で取得する。 コード例(mapがgoogle.maps.Mapのインスタンスとし
昨日のエントリに久しぶりにGoogle Maps API v3のことを書いたんで、あれこれ見てたんだけど… 英語のリファレンスと日本語のリファレンスに差異があるのね。 日本語のリファレンスには、infowindowにsizeというプロパティがあるのに、英語版じゃmaxWidthしかない。 …っつーか、そもそもこのサイズ関係のプロパティって、動作が意味不明。 どうやらみんな同じようなことを思ってるようで、Googleグループでも色々と議論されているようです。 it seems no matter what i use for maxWidth for the infowindow it's always at least 200px wide. This is a problem for mobile phone that have small screens. Is there a way
InfoBox Examples API Reference Note: Be sure to include infobox.js or infobox_packed.js in your HTML document. <script src="/path/to/infobox.js" type="text/javascript"></script> The example below shows the typical use of an InfoBox — as an enhanced version of an InfoWindow. The background of the InfoBox is set to an 8-pixel high, mostly-transparent GIF that has an upward pointing arrow 140 pixels
地図に円を描く…地図上の任意の点を中心に、設定した半径の円を描けます。 なんちゃって☆原発ハザードマップ 緯度・経度・住所・標高を取得する…地図上の任意の点をクリックして、情報を表示します。 ルート検索 地図上を順にクリックしてルート検索 地図上の2点をクリックしてルート検索 コピペで使える? Google Maps API V3 サンプル集 移動ルートの取得 (DirectionService) google.maps.Ciecle で円を描く 大圏コースを描く 地図上の2点間の距離を求める マーカー関係 地図上にマーカーを表示させて、吹き出しに説明を出す 複数のMarkerそれぞれに吹き出しをつける 好きな画像をマーカーとして表示させる マーカーの画像を動的に変更する マーカーで円をドラッグさせる ジオコーディング(住所⇔緯度経度の変換) 住所から緯度経度への変換 緯度経度から住所への
郵便番号(三桁、四桁別々)と半径(キロメートル)を入力して、ボタンを押下すると、地図上に円を描くようにしてみる。 忘れないように、とりあえずfunctionだけ書いておく。 JavaScriptは始めたばかりなので、スマートかどうかは自信がない。 参考にしたのはここ。 Circle Object - Google Maps API V3 Reference - Google Maps JavaScript API V3 - Google Code Maps API V3 Overlays (Google Maps API Version3 日本語ドキュメント(非公式)) Google Maps API V3 Demo Gallery - Google Maps JavaScript API V3 - Google Code このページにリンクがはってるこのデモが一番参考になるのかな? Ci
I've recently switched to Google Maps API V3. I'm working of a simple example which plots markers from an array, however I do not know how to center and zoom automatically with respect to the markers. I've searched the net high and low, including Google's own documentation, but have not found a clear answer. I know I could simply take an average of the co-ordinates, but how would I set the zoom ac
Google マップはグーグルが提供している地図サービスです。この Google マップをカスタマイズして独自のマーカーを表示させたり、指定した区間のルート検索を行ったりすることができるように色々な API が提供されています。ここでは Google マップで提供されている API の中でもウェブサイトで利用者が操作可能な地図をカスタマイズして表示することができる Google Maps JavaScript API の使い方の解説します。 ※ Google マップを利用者として使う場合の使い方については「Googleマップの使い方」を参照されて下さい。 なお JavaScript の基本的な使い方については「JavaScript入門」を参照されてください。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く