Dreamweaver記事

AIRチュートリアル Dreamweaver 第５回　アプリケーションを完成させよう！～Yahoo!Mapとマッシュアップ～

第５回の完成画面

制作に入る前に、まずは今回のチュートリアルの完成画面を見てみましょう。

第4回で追加した、「SEARCH」ボタンをクリックすると、施設の一覧が表示され、さらに施設名をクリックすると、施設の詳細情報と「Yahoo!地図」が表示されるようになります。

大まかなステップ

第5回の大まかなステップとしては、以下の4つとなります。

1. Yahoo!地図情報Webサービスを登録する
2. 地図情報を表示する場所を作成する
3. 検索した施設の位置情報を取得し地図情報を表示する
4. 表示効果を追加する

Yahoo!地図情報Webサービスに登録しよう！

まずは「Yahoo!地図情報Webサービス」を利用するために、Webサービスのサイトにてアカウントを登録し、「アプリケーションID」を取得します。

※Yahooでは「APIキー」を「アプリケーションID」と呼びます。

Yahoo! JAPAN Webサービスでは、Yahoo!サイトの各種サービス利用されている「Yahoo! JAPAN ID」を入力後、登録ができるようになります。

※Yahoo! JAPAN IDをお持ちでない方は、Webサービスを利用する前に登録が必要となります。

• 【Yahoo!Japan ID登録】

※利用規約等をお読みいただき、画面の手順に従ってご登録ください。

「Yahoo! JAPAN ID」をお持ちの方は、下記よりアプリケーションIDを登録します。

• 【Yahoo!地図情報Webサービス】

※利用規約等をお読みいただき、画面の手順に従ってご登録ください。

「APIキー（アプリケーションID）」は、第2回でも利用しましたね。利用方法は同じです。
「アプリケーションID」を登録しそのIDを控えておいて下さい。本チュートリアルでは「アプリケーションID：**************」と記載されていた場合、取得した値と入れ替えてご利用ください。

ファイルの準備

第4回のサンプルファイルをDreamweaverで、サイト定義します。

※第2回から作成している場合は、第2回からのファイルをサイト定義してください。

「chapter4.html」の名前を変更し「chapter5.html」として保存します。これで準備が整いました。さあここからAIRアプリを完成させていきましょう！

ページ 2 / 5

前のページ

次のページ