① 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を使ってみよう(世界版jpwx)

仕様書:DreamAPI_jpwx(世界版)簡易仕様書.pdf
リクエストURL:https://fspweb03.halex.co.jp/wimage/hpd?sid=jpwx-p-world&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から明日15時の気温を表示します。
③-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日先までの日まとめの情報を取得し、表形式で表示してください。
カスタマイズページを開く
回答例はこちら

⑤ ハレックスのAPIを使ってみよう(雨雲画像)

仕様書:DreamAPI_6時間data簡易仕様書.pdf
リクエストURL:https://fspweb01.halex.co.jp/wimage/hpd?sid=wimage-p-service&rem=all&key=[アクセスキー]&lat=[緯度]&lon=[経度]
[アクセスキー]:別途案内されているアクセスキーを設定してください。
[緯度][経度]:取得したい地点の緯度経度を設定してください。
(http,httpsでのリクエストが可能)

⑤-1 DreamAPIを使って雨雲画像を取得しよう

JavaScriptからDreamAPIを使って、最新の雨雲画像を地図上に表示します。
ajaxを使って、JSONPで画像を取得します。
サンプルページはこちら

⑤-2 6時間先の雨雲画像を取得しよう

DreamAPIは1時間毎に6時間先までの雨雲画像を取得することが可能です。
6時間先の雨雲画像を取得し、地図上に表示してください。
カスタマイズページを開く
回答例はこちら

⑥ 注意事項

⑥-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
都市名緯度経度
アメリカ ワシントンDC(ホワイトハウス)38.897748-77.03658
アメリカ ニューヨーク(タイムズスクエア)40.758219-73.985547
ブラジル サンパウロ(サンパウロ美術館)23.557308-46.65613
オーストラリア シドニー(オペラハウス)-33.856526151.215232
中国 北京(天安門広場)39.906193116.397568
ロシア モスクワ(赤の広場)55.75413637.620741
イギリス ロンドン(ビッグ・ベン)51.501143-0.12469
南アフリカ ケープタウン(V&A ウォーターフロント)-33.89943918.421451
インドネシア ジャカルタ(モナス)-6.175294106.827139

※サンプルページの緯度経度の初期値はワシントンD.C(38.897748,-77.036580)となっています。