ストレス無しでGoogleマップを使ったサイトが作れる「gmaps.js」:phpspot開発日誌
gmaps.js ? the easiest way to use Google Maps ストレス無しでGoogleマップを使ったサイトが作れる「gmaps.js」 Googleマップのサイトへの実装が本当に簡単で、かつ多機能なライブラリのご紹介です 簡単なマップを出すのに必要なコードは以下。 表示させるdivと緯度経度を指定するだけです 出来ることリストは以下 マップのクリック、ドラッグ時のイベントハンドラ実装 マーカー付与 ジオロケーション・ジオコーディング マップオーバーレイ マップ上のコンテキストメニュー実装 地図上の区画指定 目的地までのルート描画 静的な画像をマップ表示 などなど超多機能。 Googleマップ使うかもしれない場合は覚えておいて損はありません 関連エントリ Googleマップ関連のjQueryプラグインとチュートリアル集 スマホやタブレットでGoogleマップ風
Google Maps APIで逆ジオコーディングが可能に - F.Ko-Jiの「一秒後は未来」
IDEA*IDEAに「Google Maps上でクリックした地点の住所を知る方法 | IDEA*IDEA」という記事があったので調べてみると、数日前から Google Maps API に逆ジオコーディング(緯度・経度から住所を求める)機能が追加されていたみたいです。 » Google Geo Developers Blog: Geocoding… in Reverse! 早速、むかし作った「飲食店検索 – この辺で」の中に組み込みました。(元々別の逆ジオコーディングサービスを使わせてもらっていたのですが、しばらく前に使えなくなっていて機能を外していたんです。) var $ = function(id) { return document.getElementById(id); } var map = new GMap2($("map")), var geocoder = new GCli
Google Maps APIで日本の住所から緯度・経度を求める方法 - F.Ko-Jiの「一秒後は未来」
[追記: 2006/12/08] 日本でも Google Maps API でのジオコーディングが正式にサポートされました。下記は Google AJAX Search API を利用したジオコーディングの方法です。 Google Maps API のクラスを使う方法は「Google Maps APIで地名から緯度・経度が取得可能に」をご覧ください。 以前のエントリーでも触れていますが、ちゃんと書いておこうかと思います。Google Maps API標準のジオコーディングクラスが日本に対応するまでの応急措置です。 ジオコーディングにはGoogle AJAX Search APIのローカル検索を利用します。 1. http://code.google.com/apis/ajaxsearch/のページにある「Sign up for a Google AJAX Search API key」をク
[JS]Googleマップにさまざまなオプションを追加して簡単に設置できるスクリプト -GMAP3
Google Mapsにオリジナルのマークやポリゴン、任意の画像などを簡単に加えて設置できるjQueryのプラグインを紹介します。 GMAP3 -jQuery plugin to manage Google Map API デモ [ad#ad-2] GMAP3はGoogle Map APIを使用するため、使用するページに外部ファイルとして記述します。 <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> Googleマップの設置は簡単で、空のdiv要素にidを指定して配置します。 下記に簡単な例を紹介します。 HTML <div id="test1"></div> JavaScript $.gmap3.setDefault({ init:{ center:
Googleマップを使った経路案内も一瞬で実装できるjQueryプラグイン「jGmaps」:phpspot開発日誌
jGmaps | jQuery Plugins Googleマップを使った経路案内も一瞬で実装できるjQueryプラグイン「jGmaps」 必要なライブラリを読み込んで、次のようにjgmapsメソッドを呼び出すとGoogleマップによる経路案内の地図と文字による案内情報が出ます。 $('#mapa').jgmaps( { width: 300, height: 300, directions:{ address: ['東京都新宿区', '東京都港区'], usePanel: true, panelId: 'panelDirections' } } ); 次のように、経路が地図に表示されます。 文字による案内情報も表示できます。 会社案内や会場案内なんかもこれで速攻実装できそうですね。 ダウンロードできるサンプルをいじくってみましょう。 地名に日本の場所を漢字で使う場合、文字コードはUTF-
このURLのページは表示することが出来ませんでした。 IP分散サーバーならIQサーバー｜クラスCの完全分散が月額139円～
このURLのページは表示することが出来ませんでした。 IQサーバー
Google Static Maps API - Google Code
Static Maps API ãããããã¼ ã¬ã¤ã Google Static Maps API ãããããã¼ ã¬ã¤ãã«ãããããGoogle Static Maps API ã使ç¨ããã¨ãçããã®ã¦ã§ããã¼ã¸ã«ã Google ãããã®ç»åãåãè¾¼ããã¨ãã§ãã¾ããJavaScript ãåçãªãã¼ã¸ã®èªã¿è¾¼ã¿ã¯ä¸è¦ã§ããGoogle éçããããµã¼ãã¹ã¯ãæ¨æºã® HTTP è¦æ±ã«ãã£ã¦é
Google Maps API を使って、地図のカラーバリエーションを楽しもう。
メディア関係者向けお問い合わせ先 メールでのお問い合わせ: pr-jp@google.com メディア関係者以外からのお問い合わせにはお答えいたしかねます。 その他すべてのお問い合わせにつきましては、ヘルプセンターをご覧ください。
Google Map API version 3 Overlay Example3 | 株式会社フォレスト・コンサルタンツ
「Google Map API version 3 Overlay Example」「Google Map API version 3 Overlay Example2」の続きです。 今回は、InfoWindow（吹き出し）を表示する際、選択したOverlayを強調してみます。 Google Maps API v3 Example: Overlay4 tika.tisoku.net/overlay/?id=4 追加されたのは「OverlayBackground(num)」と「OverlayBackgroundNo(num)」。zIndexで表示順を、backgroundで背景色を変更しています。 【ソース】 Google Maps API v3 Example: Overlay4 <html> <head> <meta http-equiv="content-type" content="
Google Map API version 3 Overlay Example2 | 株式会社フォレスト・コンサルタンツ
にある通り、「map」上において指定された「id」のInfoWidowをopenし、以前に開かれていたInfoWidowについては閉じるという処理を行っています。 取り合えず、これでMarkerを使うことなく、InfoWindowを開くことができるのですが、注意点が２つあります。 IE6などでメモリリークが発生する。 InfoWidowを開いた際に、地図画面が動いた場合、新たにOverlayをクリックしてもInfoWidowが開かない場合がある。 前者については、回避方法が思い浮びません。公式サンプルの「Google Maps JavaScript API v3 Example: Info Window Simple」code.google.com/intl/en/api... でも、IE6でInfoWidowを開くとメモリリークが発生するので仕方ないのかも。 後者は、「google.ma
Google Map API version 3 Overlay Example | 株式会社フォレスト・コンサルタンツ
最近、Google Map APIを活用することが多いのですが、最新版のversion 3（v3）に関する日本語の情報が少ないので結構苦労しています。 v3を使用した実感としては、version 2と比較して、地図の描画速度が速いです。ただし、私の記述方法がダメダメなためか、大量のMarker（マーカー）を使うと遅くなってしまいます。 と言うことで、Markerと同様に使え、描画速度が速いような気がするOverlay（オーバーレイ）を活用することにしました。以下、簡単なサンプル。 Google Maps API v3 Example: Overlay1 tika.tisoku.net/overlay/?id=1 地図を読む込むたびに、１０個のOverlayを、その地点の緯度経度と共にランダムに表示させるようにしています。 ポイントは「AddOverlay.prototype = new g
もうひとつの Marker Manager (hPod)
地図コンテンツを Google Maps で作る時に、いつも悩ましく思っていたことに、たくさんの印（マーカーやポリライン）を置けないということがあった。置ける事は置けるけれども、闇雲に置いてしまうと、地図上がマーカーだらけになったり、ポリラインもそれだけでうちのブラウザの動作を重たくするので、なにかしらの工夫を施さなければならない。 つまるところ、密集するマーカーと、巨大なトラックログの描画、というふたつのテーマが、当初からの大きな課題の二本柱だった。──いっぺんにそれらを置こうとしなければいいのだろうけれど、いっぺんに置きたいのだもの。 ポリラインのほうは、エンコードすることで、劇的に扱いやすくなってひとまずの解決をみた。なにより巨大なトラックログも描画できるレベルになったのが、いち日に、数千トラックポイントを集めて来るじぶんにとっては、革命的だった。 一方、マーカーのほうはどうか。 し
JSON形式を使って全てをマーカー表示する - American Life in the Summertime
以前書いたある地点から指定した距離の施設検索という記事に関連して、追記する。 指定した緯度経度、そして距離を使って、その範囲内にある施設を検索する。 それは以前に記事に書いた通り。 取得したその結果を使って、今度は地図上にマーカーを置く。 その際、JSON形式のデータを試してみる。 例-10 JSON形式のデータを読み込んで、マッピングする - Google Maps 活用講座 ここにJSON形式のデータを使う例が示されている。 今回は以前に取得した内容をJSON形式に置き換えて、それを表示する方法に変更してみる。 データの形式はこんなカンジ。 CREATE TABLE `markers` ( `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY , `name` VARCHAR( 60 ) NOT NULL , `address` VARCHAR( 8
実は想像しているよりもすごかったGoogleマップの裏技10連発！ | ライフハッカー・ジャパン
Googleマップを日々便利に活用しておられる方は、かなりたくさんいらっしゃるかと思いますが、実は日常で使っている機能以外にもGoogleマップには数多くのデータが埋め込まれているのです。今回はバケーションに、スプレッドシート好きに、バイカーに役立つ隠れ機能を一挙にご紹介しちゃいます！ ■1. うろ覚えの記憶の代わりにスター付きのアドレスを活用（日本未対応） 些細なことのように思えるかも知れませんが、Googleマップのロケーションリストの隣に表示されるスターアイコンをクリックするとかなり時間の節約が出来ます。Android、BlackBerry、Windows MobileやSymbianなどの携帯(iPhoneは近い将来に対応予定）から、行き方を知りたいアドレスを調べる場合、スターを付けたアイテムを呼び出すのは、住所を入力して検索していくよりもかなりスピーディーです。行きたい場所の一時
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
Google Maps API V3でV2時代のclearOverlays()の代替方法はこれでいい？ 質問と回答(Q&A) [okyuu.com]
http://googlemaps.googlermania.com/google_maps_api_v3/
http://homepage.mac.com/hwat/maps/MarkerReducer/
google-maps-utility-library-v3 - Project Hosting on Google Code
http://googlemaps.googlermania.com/google_maps_api_v2/map_example_12.html