サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
買ってよかったもの
nyanjiro.no-blog.jp
経路マップ on Google Maps Googleマップに経路の書き込みが可能なWeb上のツール Googleマップ自動生成ツール Googleマップのコードが簡単に生成できるWeb上のツール お天気速報掲示板 各地のお天気情報をリアルタイムにシェアする掲示板 とーいっ君 ~試験自動採点ツール~ TOEICの解答を入力すると、自動で採点してくれるツール 前回は、Google App Engine for Java(GE4J)の開発環境構築から「Hello World」表示までの手順を解説したが、今回はブラウザ(クライアント側)からのデータ送信とGE4J(サーバ側)でのデータ取得とレスポンス送信についての流れを解説する。 クライアント側は、JavascriptのライブラリとしてjQueryを利用しているので、以下の手順で使えるようにする。 jQueryをここから拾ってくる。 ファイル名が
アメリカで人気のネットラジオサービスにPandoraというものがあるが、日本からアクセスすると下記のように「このサービスはアメリカ以外からはアクセスを許可できないんだ。ごめんね。」というメッセージが表示されて利用することができない。 しかし、これとは別に世界中からPandoraにアクセスできるGlobalPandoraというものがあると聞いたので早速試してみた。 最初にこのサイトにアクセスすると、下記のように「Create a New Station」という画面になるので、テキストボックスに好きなアーティストや曲名を入れて「Listen Now」ボタンを押すだけ。 しばらくすると勝手に音楽が流れ出す。 使い勝手も良いので、BGMにいい感じ。
Google Static Maps APIに経路が描けるようになったので、経路マップを携帯対応にしてみた GoogleマップAPIの公式ブログによると、Google Maps Static API(地図をJavascriptではなく画像で表示するやつ)を使って経路が描けるようになったというので、久々に経路マップを改良して、作成した経路地図を携帯からも閲覧できるようにしてみた。 やり方は従来と全く同じように、目的の場所に移動して、経路を記入し、「この地図のURL」ボタンを押すだけ。 すると、こんな感じで生成される。 そして、右側の「この地図のURL」の2段下に「-携帯用-」というテキストボックスがあるので、ここに表示されているURLをメールで携帯に送ってやれば、携帯から下記のような経路地図を見ることができる。 ちなみに、このGoogle Maps Static APIの使い方は非常に簡単で
今まで有料($20)のGoogle Earth Plusでしか利用できなかったGPSデータの取り込みが、無料版(Google Earth 5.0)でも利用できるようになった。★Explore your travels with GPS in Google Earth (Google Lat Long Blog)やり方は、メニューバーの[ツール]から[GPS]を選ぶと「GPSインポート」ダイアログボックスが表示されるので、必要事項にチェックを入れて[インポート]ボタンを押すだけ。 以下は、東京~伊豆間を新幹線で移動したときのGPSデータを実際に取り込んだもの。(青い線の部分) Google Earth 5.0では200機種以上のGPSが対応しており、ガーミンやマゼランなどメジャーなGPSは大体対応しているようだ。 ちなみに上記で使ったGPSはガーミンのGeko201 。地図の表示はできないが
Googleマップをブログとかに貼り付けるとき、Google Maps APIでJavascriptを使って貼り付けることができるが、環境によっては表示されるまで時間がかかったりする。 だからといって、画面をハードコピーして画像に変換してから貼り付けるのも面倒くさい。 そんなとき「Google Static Maps API」を使えば簡単に下記のような感じで、地図を画像として貼り付けることができる。(ってGoogle Maps API Blogに紹介されてた。) やり方は、こちらのStatic Map Wizardを使って、下記のような手順で画像ファイルのリンクを生成する。 表示させたい地図の住所を入力して[Create Marker Here]ボタンを押す 地図のサイズを指定する 「I agree ~」のチェックを入れて、自分のサイトのURLを入力して[Generate Key]を押す
Google AJAX Search API の公式ブログにサイト閲覧者のIPアドレスから位置情報(緯度、経度、国名、地域名など)を取得する方法が紹介されていたので、早速試してみた。 ★Where is my current user? やり方は無茶苦茶簡単。 国名を取得したければ google.loader.ClientLocation.address.country を、緯度を取得したければ google.loader.ClientLocation.latitude を呼び出すだけ。 以下にサンプルコードを示す。 10: onload = function() { 11: document.getElementById("country").value = google.loader.ClientLocation.address.country; 12: document.getEle
先日Googleからモバイルデバイス用ソフトウェアスタックのAndroidプラットフォームが発表されたが、Googleより公開されているSDK(Software Development Kit)を使えばモバイル端末のエミュレータを使ってWindows上で簡単に試せるということなので、早速試してみた。 あれだけ派手に報道されたので、プログラミングをやったことのない人の中でも興味がある人がいると思うので、細かい理屈は抜きにして本当にゼロから始めて、とりあえず動かせるまでの手順を解説したいと思う。 細かい理屈の知りたい方は、Androidの公式サイト(英語)を参照して下さい。(そういう人は言われなくても読んでいると思うが...) Android SDKを利用可能な環境としては、Windows XP or Vista、Mac OS X 10.4.8以降、Linux(Ubuntu Dapper Dr
Javascriptで開発をするとき、コーディングを終え、FirefoxのFirebugでエラーが出なくなったので、さてリリース前にIEでも確認しとくか、とIEで動かしてみたら全く動かなくて、しかもIEにはいい感じのデバッガが無く、なかなかバグがとれなくて益々IEが嫌いになるという経験をした方も多いと思うが、遂にIEにもFirebugライクなスクリプトデバッガがリリースされた。 ★IE用JavaScriptデバッガ「Companion.JS 0.2」リリース これを使えば、例えば下記のような宣言していない"aaa"という変数にアクセスしようとした場合、 <script type="text/javascript"> window.onload = function(){ alert(aaa); } </script> 下記のようにメッセージを表示してくれる。 サポートしているIEのバージョ
前回でAndroid SDKを利用するための準備が整ったので、今回はこれらの開発ツールを使って、モバイル端末エミュレータに任意の文字列を表示させる手順を解説する。 2. Androidプロジェクトの作成 まずは、前回インストールしたeclipseを立ち上げる(eclipseディレクトリ内のeclipse.exeをダブルクリック)。 初めて起動して下記のようなWelcom画面の場合は、画面右側にあるWorkbenchをクリックしてWorkbench画面へ移っておく。 次に以下の手順でAndroidアプリケーション用のプロジェクトを作成する。 メニューの[File] > [New] > [Project]を選んで、「New Projectダイアログ」を開き、中央のツリービューから「Android」の左の"+"を押して"Android Project"を選択した状態で、「Next >」ボタン
■返り値 ●"type=xml"のとき <response> |-<result> 「"OK" or "NG"」 |-<postcode> 「郵便番号」 |-<reson> 「NGのときの理由」 |-<addresses> 「取得したアドレスと経度・緯度の集合(複数の場合あり)」 |-<address> 「住所」 |-<latitude> 「緯度」 |-<longitude> 「経度」 XML形式の例 ●"type=json"のとき {'response': { 'result': 「"OK" or "NG"」, 'postcode': 「郵便番号」, 'reason': 「NGのときの理由」, 'addresses': 「取得したアドレスと経度・緯度の集合(複数の場合あり
今回から数回に分けて、iGoogle用ガジェットの作り方を説明したいと思う。 Googleが提供するがジェットは、iGoogle用の「ユニバーサルガジェット」とGoogleデスクトップ用の「ガジェット」(呼び方が無い?)があり、ここではユニバーサルガジェットのみについて説明する。(ユニバーサルガジェットという呼び方は一般的ではない気がするので、ここではiGoogle用ガジェットと呼ぶ) ちなみにガジェット作成の詳細な説明は、公式のGoogleガジェットAPI開発者向けガイドやiGoogleガジェットコンテストのサイトに非常に詳しく掲載されているので、気合を入れてガジェットを作りたい人はこれらを参考にして欲しい。 ここでは、理屈抜きで動くものを作りたい人用に解説したいと思う。 ただ、ガジェット用経路マップを作る上でわかったちょっとしたノウハウも追々説明していくので、ある程度の経験者でも役に立
Google AJAX Search APIのブログにJavaScriptだけで自ホスト以外のRSSフィードを扱うことができる「Google AJAX Feed API」を公開したというので、早速試してみた。 JavaScriptはセキュリティのため、同じホストのデータにしかアクセスできなくなっているため、サーバサイドのアプリと組み合わせないと他サイトのRSSなどを扱うことができないのだが、このAPIを使えばそれが簡単にできる。 例えば、このAPIを使ってengadget日本語版のRSSフィード(http://japanese.engadget.com/rss.xml)を読み込んだ結果がこれになる。 このAPIを利用するにはAPIキーを取得する必要があるので、その手順を以下で説明する。 (1)サインアップ ・Google AJAX Search APIサインアップページで、利用条件に理不尽
GoogleマップのHTMLコードを生成するツールを作ってみた。 「タイトル」や「APIキー」、「マーカーの位置」などの入力するだけで簡単に生成できるようになっている。 地図の初期位置やマーカの位置は、いちいち座標を入れなくてもよいように、地図をクリックすれば良いだけにした。 また、住所を入力して地図を移動するジオコーディングにも対応させてある。 これを使って作ったサンプルサイトがこんな感じ。 これを使えばコーディングの経験の無い人も、生成されたコードをコピペするだけで簡単にGoogleマップを自分のサイトに貼り付けることができる。 ★Google Maps Code Generator - Googleマップ自動生成ツール Rhさん。こんにちは。 このツールは、地図サイトを丸ごと生成するとき用のものなので、そのままではブログなどの記事に挿入することはできません。 そういった用途には、こ
Google Maps Hacksを読んでいたらHACK#17に2点間の距離の計測方法が出ていた。 経路マップに実装したら便利だと思い、この本を参考に実装してみたのだが、こんな地球の半径から三角関数を使って計算しなくても、GLatLngクラスのdistanceFrom()メソッドであっさり実装できることがわかった。 やり方は、単純に二つのポイント(GLatLngオブジェクト)を指定するだけで、メートル単位の距離が返ってくる。
GoogleマップAPI公式ブログに、「Double-click to zoom」機能と「Continuous zoom」機能が追加されたというので、早速試してみた。 ちなみに「Double-click to zoom」機能とは、地図上で左ボタンでダブルクリックすると拡大され、右ボタンでダブルクリックすると縮小される機能で、「Continuous zoom」機能とは、左上のコントローラで拡大もしくは縮小するとスムーズに拡大・縮小が行われる機能のこと。 実装は非常に簡単で、下記のようにGMap2クラスのインスタンスからenableDoubleClickZoom()とenableContinuousZoom()メソッドを呼び出すだけである。 var map = new GMap2(document.getElementById("map")); map.enableContinuousZoom
DANGER DO NOT TOUCH Not only will this kill you, it will hurt the whole time you're dying. 危険 さわるな これはあなたを殺すだけでなく あなたが死んでも 苦しめ続ける Google AJAX Search API の公式ブログにサイト閲覧者のIPアドレスから位置情報(緯度、経度、国名、地域名など)を取得する方法が紹介されていたので、早速試してみた。 ★Where is my current user? やり方は無茶苦茶簡単。 国名を取得したければ google.loader.ClientLocation.address.country を、緯度を取得したければ google.loader.ClientLocation.latitude を呼び出すだけ。 以下にサンプルコードを示す。 10: onlo
前回の記事で紹介したように、Google AJAX Search APIを使えばGoogleマップ検索の結果を取得できることがわかったので、「経路マップ on Google Maps」と組み合わせてみた。 今までは経路を書き込みたい場所まで地図をドラッグしていく必要があったため、非常に面倒くさかったが、Search APIを使って検索ボックスで住所を入れるだけで目的の場所まで飛べるようになったので、非常に便利になった。 例えば、検索ボックスに「東京都新宿区歌舞伎町」と入力して[移動]ボタンを押せば、歌舞伎町の地図が現れる。 Search APIの基本的な使い方は、前回の記事で書いたので、今回は検索結果をどのようにGoogleマップに反映させるかを中心に書く。 Googleマップ検索は、GlocalSearchクラスのオブジェクトを生成し、execute()メソッドに検索キーワードを渡すこと
先日、Googleが検索用APIである「Google AJAX Search API」を公開したので、早速試してみた。 使い方は、Google Maps APIと同じように、サインアップページでAPIキーを取得して、Search APIを使ったページのヘッダに貼り付ける必要がある。 このSearch API用のキーはMaps API用のキーと同じアルゴリズムで生成されているようで、全く同じキーが生成された。 サンプルページを動かすまでの手順を下記に示す。 (1)サインアップ ・Google AJAX Search APIサインアップページで、利用条件に理不尽なことが書いてないと信じて、画面下の方の「I have read and agree with the terms and conditions」の左のチェックボックスにチェックを入れる。 ・「My web site URL:」欄に自サ
今まで紹介したGoogleマップAPIの内容を応用して、地図に経路を書き込み可能で、しかもURLでその経路つき地図を共有できるツールを作ってみた。 ★経路マップ on Googleマップ 例えば東京駅八重洲中央口からポケモンセンター(?)への行き方を人に教えたければ、下記のアドレスをメールかなんかで送るだけで、場所だけでなく行き方まで教えられる。 http://nyanjiro.net/pathway/pathway_map2.html?uid=5f939838913d4b786a5496b61e438e83 今まで人にメールで道の行き方を説明するとき、Googleマップなどの地図を[PrintScreen]でコピーし、「ペイント」に貼り付けて経路を書き込みなんてやっていたけど、このツールを使えば直接地図に線が書け、人にはメールでURLを教えるだけなので、非常に簡単♪ ちなみに経路情
Web2.0と言えば、マッシュアップ。 マッシュアップと言えば、当然Googleマップだろう。 ということで、GoogleマップAPIに挑戦してみた。 ところでGoogleの地図サービスはGoogleローカルになったはずなのにGoogleのトップページを見ると「マップ」になってる。 何だろうと思って調べたらユーザーの要望で変更したらしい。 これは余談。 で、肝心なGoogleマップAPIについてだが、「日経ソフトウエア」を参考に作ったら意外と簡単にできた(ちょっとした表示だけだが)。 手順は以下。 0. 事前にWebページを準備する 1. Google Maps APIのページでサインアップとAPIキーの取得を行う 1) 左上の方にある「Sign up for an API key」をクリック。 2) 英語でごちゃごちゃ書いてあるが理不尽なことは書いてないと信じて「I have r
このページを最初にブックマークしてみませんか?
『The Star of Web2.0』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く