はじめに
Yahoo! Open Local Platform（以下、YOLP）Hacksの第4回です。前回はiOS Map SDKを使ってスライドショーアプリを30分で作るというトピックを紹介しました。
今回はWebページに地図を設置し、ローカルサーチAPIを使っていろいろなお店の情報を表示する方法を紹介していきたいと思います。YOLPでは、お店や施設の情報をPOIと呼んでいます。ローカルサーチAPIにはさまざまなオプションパラメーターがあり、それを組み合わせることで思い通りのPOIを地図上にマッピングできます。ぜひお試しください。
基本機能を利用する
アプリケーションIDの登録
ローカルサーチAPIを利用するには、YJDNのページでアプリケーションIDを事前に登録いただく必要があります。アプリケーションIDが未登録の方、新しいアプリケーションIDの登録を希望する方は、YJDNの「アプリケーションIDとは」「アプリケーションIDを登録する」を参考にして、アプリケーションIDを登録してください（※注）。
アプリケーションIDを登録するためには、Yahoo! JAPAN IDでログインする必要があります。
地図に表示するデータを選択する
ローカルサーチAPIで利用可能なデータは、YOLPカセットギャラリーで公開されています。データはカセットという単位で管理されており、複数のカセットを組み合わせて選択できます。ご自身の情報をアップロードして、他のカセットと組み合わせることもできます。
カセット名のリンクをクリックすると、そのカセットの詳細な情報が表示されます。［プレビュー］ボタンをクリックすると、そのカセットのPOIを地図上で確認できます。
［ストックする］ボタンをクリックすると、ページ下のストックボックスに選択したカセットが表示されます。同じ地図に表示させたいカセットをストックボックスに追加した後、［まとめてプレビュー］ボタンをクリックすると、選択したカセットをまとめて地図上で確認できます。左カラムにはPOIのリストが表示され、検索ボックスに任意の文字列を入力して［検索］ボタンをクリックすると、該当するPOIのみを表示できます。下の例では、「Yahoo!ロコ プレイス店舗/施設情報Ver.1」と「マクドナルド店舗情報」の2つのカセットを選択しました。
プレビュー画面の下の「アプリケーションIDを入力してください」というテキストボックスに、取得したアプリケーションIDを入力し、利用条件を確認した後、［ダウンロード］ボタンをクリックすると、プレビューで表示している地図を動かすためのファイルがZIPファイルにてダウンロードできます。
ZIPファイルを解凍して取り出したHTMLファイルを自身のWebサイトにアップロードするだけで、プレビューと同じ検索機能付きの地図ページを表示できます。
