The Google Maps Javascript API V3 - Google Maps JavaScript API V3 - Google Code
How Do I Start? Read the Developer's Guide. Follow the Tutorial. Consult the Reference. Join the announcements group to receive important updates. Featured Video Watch other Maps API presentations V3: The Solution for Maps Applications for both the Desktop and Mobile Devices Note: The Google Maps Javascript API Version 3 documented within these pages is now the official Javascript API. Version 2
Google Maps JavaScript API V3 をつかって飲食店検索インターフェースをつくってみる - Kangaroonote
バージョン 2 の頃から、そんなに使っていたわけではないので、具体的に何が変わったのか詳細まではわからないのだけれど、スマートフォン等の多様なデバイス向けに最適化され、インターフェースも強化されたということらしいので、せっかくなので試してみた。 マップ上に描画できたり、 2 点間の距離を計算したり、目的地までの経路を徒歩や車で移動する道順を出してくれたりだとか。他にもリバースジオコーディングもできたり、ストリートビューも操作できたり、他にもいろいろできるようになってるし、 iPhone の 3G 環境でみても重さを感じさせない。 今回つくったのは、ホットペッパーの API から情報をひっぱてきて Google Maps にマッピングして検索住所から一番近い店舗まで経路を表示。最大で 100 件までの情報を取得し、アイコンをクリックすると情報が切り替わるというもの。 距離の計算は API を
Googleマップで探すグルメサイトを作ろう！ (1/5)
「確か、あのヘンだったはずなんだけどなぁ……」 かつて訪れたことのあるお店の情報を調べたいけど、正確な名前も住所も分からない。そんなとき、お店の情報がまとめて掲載されている地図があれば便利です。地図ならおおよその場所の記憶から、直感的に目的の情報へたどり着くことができます。たとえば、複数の飲食店の情報を提供する「グルメガイド」のようなサイトであれば重宝されることでしょう。 ヤフーが運営する「Yahoo！グルメ」も、そんな「地図から探す」機能を持つサイトのひとつ。同サイトに掲載されている飲食店の情報は、地図上ですぐに調べることができます。今回はこの技をお手本にしましょう。 今回のお手本サイト：『Yahoo！グルメ』 飲食店のクーポン券のダウンロードから、料理レシピの検索、さらには出前の注文までできる総合グルメサイト。掲載されている飲食店やレシピの情報は「グルメぴあ」「E・レシピ」など、複数の
Google Maps API、じゃらん宿表示API、グルメサーチAPIで緯度・経度を使い回す方法
サンプルはすべて「国立競技場」のものですが、全部数字が違うんですよね・・・ 各APIの緯度・経度の変換方法 違いがわかったところで、これを一つ一つ調べていたのではやってられないし、マッシュアップの意味が無くなってしまうので、一つを基準に変換していくことにしました。 基準にしたのは、Google Map APIで使う「DEGREE形式（世界測地系）」です。ちなみに、サイト公開のところでも書きましたが、この数値だけはAPIで持ってこないでGeocodingで調べて転記しています。 ※Geocoding APIを使えば住所orランドマークから緯度経度を参照させることができます。 まずは、実際に使っているソースから $lat = <MTIfNonEmpty tag=”lat”><MTlat></MTIfNonEmpty>;//緯度 $lng = <MTIfNonEmpty tag=”lng”><M
手軽になった！Google Maps API V3 (1/2)
Web上で地図を表示するツールの定番といえば「Googleマップ」。独自の地図を簡単に作れる「Google Maps API」を使って、会社案内のページに地図を埋め込んだり、地図と連動するネットサービスを運営している方も多いでしょう。 このGoogle Maps APIの新バージョン「Version 3」（以下V3と略）が5月27日に公開されました。今回は、V3を使って地図を表示する基本的な手順を紹介しましょう。 Google Maps API V3の主な変更点 Google Maps API V3では、以下の点が新しくなりました。 （1）API Keyが不要 V2まででは、Google Maps APIを使うためにはAPI Keyを取得する必要がありましたが、V3では不要になりました。 （2）iPhone／Androidへの対応 iPhoneやAndroidで地図を高速に表示できるように
住所から座標を取得(getLatLngメソッド) - ジオコーディング(GClientGeocoder) - Google Maps JavaScript API入門
まずジオコーディングの機能を利用するためのGClientGeocoderクラスのオブジェクトを作成します。コンストラクタ関数は次のように定義されています。 GClientGeocoder(cache?:GGeocodeCache) Google サーバーと直接通信するジオコーダの新しいインスタンスを作成します。 オプションのキャッシュ パラメータにより、不明な住所のカスタムのクライア ント側キャッシュを指定できます。何も指定していない場合、 GFactualGeocodeCache が使用されます。 省略可能な引数であるcasheにはクライアント側で住所から座標への変換表を作成している場合などに指定します。ここでは取り合えず気にしないで下さい。 実際には次のように記述します。 var map = new GMap2(document.getElementById("map")); map.
Google Maps API(v3) で住所から地図にマーカーを置く！ « hampom TODAY
今後また使うかもしれないので、メモメモ。 google Maps API(v3)では APIキーが不要なので、テスト環境でのテストや本番に移行した際にAPIキーを取り直したりといったようなわずらわしさが無いのでお気に入りです(ただのものぐさです…) サンプルを設置しました！ → SAMPLE 早速、まずは javascript の読み込みを設定します！ <script type='text/javascript' src='http://www.google.com/jsapi'></script> <script type='text/javascript'>google.load('jquery', '1.3.2');</script> <script type='text/javascript' src='http://maps.google.com/maps/api/js?sens
ジオコーディング｜Google Maps JavaScript API v3｜Ajax｜PHP & JavaScript Room
指定した住所の緯度・経度を検索 ジオコード 2011/6/26 Google Maps JavaScript API V3 - Geocoderクラス ジオコードは、指定した住所を検索し、緯度・経度の地理的な座標に変換するサービスです。 ジオコードオブジェクトを作成し、geocode()メソッドで、Geocoderにリクエストを送信します。 addressプロパティには、検索する住所文字列を指定します。 住所に日本語を指定できるようにするには、languageプロパティに「ja」を指定します。 その他、国コード（regionプロパティ）、検索範囲（bounds）などを指定可能です。 /* ジオコードオブジェクト */ var geocoder = new google.maps.Geocoder(); geocoder.geocode( { 'address': 住所文字列, 'langu
WordPressにGoogle Maps & Earth API！ブログ素人のホームページ作成方法と地図対策
最近になって撮りためた写真をFlick上で整理しようとしていたら、UIの変更が・・・・判りにくい・・・。 まあそれは良しとして、クリエイティブ・コモンズ・ライセンスの設定をしてみようかと。商用利用でも、自分の写真が使われるのは面白いかもしれませんね。 設定は、写真を開いた右下。 通常は、最初から All Rights Reserved に設定されている。 Read more » Flickrの写真スライドショー flickr本体にもスライドショーの機能があるのですが、なぜか「Oh No! We couldn’t find anything」と表示されスライドショーが機能しない検索ワードがあります。 そこで見つけたのが、flickrにアップロードされている写真を手軽にブログやサイトに貼り付けることができるiframeタグを作成できるサイト。 Googleで「flickr スライドショー」で
[JavaScript] Google Maps API V3 で JSON/XML を読み込んで複数のマーカーを追加してみた | しゃけログ
JSONまたはXMLなどの外部データを読み込んで、複数のマーカーをGoogle Maps API V3 に追加してみました。 Google公式のリファレンスを参考にしました。 Google Maps JavaScript API V3 リファレンス バージョン3はIE6 サポート対象外なのでお気をつけ下さい。 JSONデータからMarkerを生成 JSONファイルを読み込んで、複数のMarkerをマップ上に追加してみました。 1. JSONファイルを読み込む Google Maps JavaScript API V3 から、XMLファイルの読み込み関数 と XMLパーサーのライブラリがなくなりました。 バージョン2でいうと、GDownloadUrl関数 や GXml.parse などです。 なので、jQueryでJSONファイルを読み込んでいきます。 map.json {"Marker":
Google Maps JavaScript API V3 ã®è¨äº - Google Maps JavaScript API V3 - Google Code
Google Maps API Premier Maps API ã®æ©è½ã«å ãããã¸ãã¹åãã®ãµãã¼ããæä¾ãããåºåã管çã§ãã¾ãã Google Maps JavaScript API V3 ã®è¨äº 注: ãã®ãã¼ã¸ã«è¨è¼ããã¦ãã Google Maps JavaScript API ãã¼ã¸ã§ã³ 3 ã¯ãæ£å¼ãª JavaScript API ã¨ãªãã¾ãããJavaScript API ãã¼ã¸ã§ã³ 2 ã¯ãGoogle ã®å»æ¢ããªã·ã¼ã«ããæ£å¼
Geekなぺーじ : Google MAPS APIプログラミング
ここでは、Google Maps JavaScript API(version 3)を使って遊ぶ方法を説明したいと思います。 Google Maps JavaScript APIを使うと、グーグル社が提供する衛星写真や地図を使ってホームページ上で色々なものを作れます。 対象とする読者は初心者もしくは入門者です。 Google Maps APIはJavaScriptを使って書いてあるので、JavaScriptの知識があった方がわかりやすいと思いますが、Java Scriptがわからなくても何と無くわかるような説明を目指したいと思っています。 基本編 Google Maps APIの単純な例 地図の種類を切り替える 地図の中心を移動する 地図上にふきだしを表示 地図がクリックされたときの処理 マップタイプコントロールを無効にする 緯度経度取得ツール 要望が多いので緯度経度情報を取得するツールを
Google Maps JavaScript API V3 サービス - Google Maps JavaScript API V3 - Google Code
Google Maps API Premier Maps API ã®æ©è½ã«å ãããã¸ãã¹åãã®ãµãã¼ããæä¾ãããåºåã管çã§ãã¾ãã Google Maps JavaScript API V3 ãµã¼ã㹠注: ãã®ãã¼ã¸ã«è¨è¼ããã¦ãã Google Maps JavaScript API ãã¼ã¸ã§ã³ 3 ã¯ãæ£å¼ãª JavaScript API ã¨ãªãã¾ãããJavaScript API ãã¼ã¸ã§ã³ 2 ã¯ãGoogle ã®å»æ¢ããªã·ã¼ã«ããæ£
サービス - Google Maps API - Google Code
Google Maps API Premier Maps API ã®æ©è½ã«å ãããã¸ãã¹åãã®ãµãã¼ããæä¾ãããåºåã管çã§ãã¾ãã ãµã¼ãã¹ã®æ¦è¦ Google Maps API ã¯æ°ããæ©è½ã®è¿½å ã«ãã£ã¦å®æçã«æ¡å¼µããã¦ãã¾ããå¤ãã®å ´åãããããæ©è½ã¯ãmaps.google.com ã§æåã«ãªãªã¼ã¹ããã¾ãããã®ã»ã¯ã·ã§ã³ã§ã¯ããããã®ãµã¼ã
Google Maps API V3 基本的な使用方法と設定についてのまとめ
APIの呼び出し方からマーカークリックで情報ウィンドウを表示するまでの基本的な使い方について、オプション設定の仕方を含めてまとめてみた。 Webサイトへの導入 API呼び出すscriptタグとwindow.onloadで実行される関数書いて～という手順はV2とまったく同じ。 シンプルな地図を表示するサンプル 下記ソースを元に解説します。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>Google Maps JavaScript API v3 Example</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script type="text/jav
Google Mapデモ
◆Google Maps JavaScript API V3 Example（Demo）一覧 ※本ページのiPhone（スマートフォン端末）用デモを見るには、ブラウザはGoogle Cｈromeを使用して下さい。 はじめに ともかく地図を表示する。（デフォルト：ナビ、地図タイプ、距離スケール表示） WordPressの記事内にGoogle Mapを表示させる アイコンとインフォウィンドウ アイコン（マーカー）+インフォウィンドウ コントロール アンドロイド”Android” コントロール（地図の拡大・縮小） 拡大・縮小用ズームコントロールボタン（地図の拡大・縮小） カスタムコントロール/地図内に現在地に戻るボタンを設置 全画面フルスクリーン表示を切り替えるボタンをGoogleマップ内に実装する マーカー（アイコン）の配列についての検証(２次元配列を理解してみる) for (var i =
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
