① HalexDream!について

https://www.halex.co.jp/service/api.html

② JSONについて

JSONとはJavaScript Object Notationの略で、軽量なデータ記述言語の1つです。
JSONはJavaScript専用のデータ形式では決してなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しに使えるよう設計されています。
今回はWebブラウザを使用して情報を取得するためJSONPを使用します。
JSONPとは引数にJSONをとったコールバック関数のことで、主にWeb画面内のJavaScriptでJSONを使いたい場合に使用されます。

③ ハレックスのAPIを使ってみよう

仕様書：DreamAPI_jpwx簡易仕様書.pdf
リクエストURL：http://demo.halex.co.jp/wimage/hpd?sid=jpwx-api&rem=wx&lat=[緯度]&lon=[経度]&key=[アクセスキー]
[アクセスキー]：別途案内されているアクセスキーを設定してください。
[緯度][経度]：取得したい地点の緯度経度を設定してください。
（http,httpsでのリクエストが可能）

③-1 DreamAPIを使ってJSONデータを取得しよう

JavaScriptからDreamAPIを使って、JSONを画面に表示します。
ajaxを使って、JSONPでデータを取得します。
サンプルページはこちら

③-2 DreamAPIから本日18時の気温を取得しよう

JavaScriptからDreamAPIを使って、JSONを取得します。
取得したJSONから本日18時の気温を表示します。
サンプルページはこちら

③-2-1 DreamAPIから明日15時の予想気温を取得しよう

JavaScriptからDreamAPIを使って、JSONを取得します。
取得したJSONから本日18時の気温を表示します。
③-2で使用したhtmlファイルの中身を変更すると簡単です。

③-2-2 DreamAPIから明後日8時の予想風速を取得しよう

JavaScriptからDreamAPIを使って、JSONを取得します。
取得したJSONから明後日8時の予想風速を表示します。
③-2で使用したhtmlファイルの中身を変更すると簡単です。

④ 例題

③-2をベースとしたカスタマイズ用ファイルをご用意しています。
編集はカスタマイズ用をご利用ください。

④-1 1日分の1時間ごとの気温を取得しよう

DreamAPIを使って、当日1時間ごとの気温の情報を取得してください。
カスタマイズページを開く
回答例はこちら

④-2 1日分の1時間ごとの降水量を取得しよう

DreamAPIを使って、当日1時間ごとの降水量の情報を取得してください。
④-1から取得する要素を変更すると表示されます。
カスタマイズページを開く
回答例はこちら

④-3 前日から2日先までの1時間ごとの気温を取得しよう

DreamAPIは前日から2日先（明後日）までは1時間ごとの情報を取得することが可能です。
前日から2日先（明後日）までの気温を取得し、表形式で表示してください。
カスタマイズページを開く
回答例はこちら

④-4 前日から7日先までの最高気温を取得しよう

DreamAPIは前日から7日先までの日まとめの情報を取得することが可能です。
前日から7日先までの日まとめの情報を取得し、表形式で表示してください。
カスタマイズページを開く
回答例はこちら

⑤ その他

⑤-1 前日と当日の1時間ごとの気温をグラフで表示したい場合

DreamAPIで取得したデータを加工することにより、グラフで表示することも可能です。
本サンプルではChart.js（別サイト）を使用しています。
カスタマイズページを開く
サンプルはこちら

⑥ 注意事項

⑥-1 ライセンスに関して

今回配布したAPIキーはセミナー用となります。
二次配布や商用利用は行わないでください。

⑥-2 Googleマップで緯度経度の取得方法

1.Googleマップ（別サイト）で任意の地点上で右クリック
2.この場所についてをクリック
3.画面下部に選択した地点の緯度経度が表示される

⑥-3 主要都市一覧

都市名緯度経度
札幌43.06208141.354361
仙台38.268201140.869426
東京35.689486139.691705
名古屋35.181438136.90642
大阪34.693738135.502165
福岡33.590198130.401719
沖縄26.212523127.680771

※サンプルページの緯度経度の初期値は気象庁本庁（35.689704,139.761776）となっています。