グーグルマップとホットペッパーAPIのマッシュアップをしてみました
ホットペッパーWebサービスAPIが公開されているようなので、早速Google Mapsと組み合わせてみました。
Google Maps APIを生成するGMapCreatorにホットペッパーMarkerを作れる機能を追加しました。 今回追加したのはホットペッパーに掲載されているお店の電話番号から自動的に緯度と経度を取得して地図上にマーカを追加する機能です。
まず、Hotpepper APIを使って電話番号から住所を取得しました。 取得した住所をGoogle Maps APIのGClientGeocoderに渡して緯度経度情報に変換しました。 変換した緯度経度情報を使ってマーカを設置して、openInfoWindowHtmlを使ってお店の情報を表示するようにしました。 さらに、マーカをクリックするとHotpepperのお店URLへ移動するようにしました。
一通りクリックして地図を作ったら「コード生成」ボタンを押すとGoogle Maps API入りのHTMLが出力されるので、ご自由にご利用下さい。 出力されたHTMLコードは必要に応じて改変して下さい。
あと、GMapCreatorに実装されているマッシュアップ系としては、地図上を左クリックしてAmazonへのアソシエイトリンクも作れるようになっています。 じゃらんのAPIもHotpepperと同様な感じで作ろうと計画しています。
楽しんで頂ければ幸いです。 遊んでみてbugなどを発見したら教えていただけると非常に嬉しいです。
P.S. GMapCreatorで途中保存機能に関して数人の方からリクエストを頂いています。 復活の呪文みたいな感じで作ろうとしていますが、まだ頭の中で設計が作りきれてないので、、、いつ出来るかは不明です。 ごめんなさい。
最近のエントリ
- Interop 2023のShowNetバックボーン詳解
- Interop Tokyo 2023 ShowNet取材動画
- 「ピアリング戦記 - 日本のインターネットを繋ぐ技術者たち」を書きました!
- 1.02Tbpsの対外線!400GbE相互接続も - Interop ShowNet 2022
- Alaxala AX-3D-ViewerとAX-Sensor - Interop 2022
- SRv6を活用し、リンクローカルIPv6アドレスだけでバックボーンのルーティング - Interop ShowNet 2022
過去記事