【GAS】天気予報を表示するアプリを作る~jsonの中身のチェック~【第1回】

前回までは、APIを扱う練習として、画像のURLを受け取りHTMLで表示するアプリを作っていました。今回からは気象庁からjsonを受け取り、その内容を表示するアプリを作っていきたいと思います。

気象庁

気象庁のjsonファイルが利用可能になっているとの情報を得て、やっていきます。気象庁の利用規約に則って利用してください。

地域コードについて

地域コードは、気象庁の地域のページを開いた時のURLが対応しています。以下は東京地方の天気予報のURLですが、「area_code=130000」となっており、地域コードが「130000」であることがわかります。

https://www.jma.go.jp/bosai/#area_type=offices&area_code=130000&pattern=forecast

また、以下のリンクに地域コードが一覧で掲載されているので、こちらでも確認できます。

jsonの中身を見る

早速、jsonの中身を見ていきたいと思います。今回は見やすくするためにこちらを利用させていただきました。

以下は6月13日に取得した、東京の天気予報データの一部です。

[
	{
		"publishingOffice": "気象庁",
		"reportDatetime": "2022-06-13T05:00:00+09:00",
		"timeSeries": [
			{
				"timeDefines": [
					"2022-06-13T05:00:00+09:00",
					"2022-06-14T00:00:00+09:00"
				],
				"areas": [
					{
						"area": {
							"name": "東京地方",
							"code": "130010"
						},
						"weatherCodes": [
							"101",
							"212"
						],
						"weathers": [
							"晴れ 時々 くもり",
							"くもり 夜 雨"
						],
						"winds": [
							"南東の風 23区西部 では 南東の風 やや強く",
							"北の風 後 東の風"
						],
						"waves": [
							"0.5メートル 後 1メートル",
							"0.5メートル"
						]
					},

今まで扱ってきたjsonファイルよりかなり難解ですが、予報の時間や、予報エリア、天気予報などの情報が詰まっていることがわかりますね。

さらに下の方を見ていくと、降水確率が出てきました。降水確率は、天気予報よりは細かく設定されているようですね。

				"timeDefines": [
					"2022-06-13T06:00:00+09:00",
					"2022-06-13T12:00:00+09:00",
					"2022-06-13T18:00:00+09:00",
					"2022-06-14T00:00:00+09:00",
					"2022-06-14T06:00:00+09:00",
					"2022-06-14T12:00:00+09:00",
					"2022-06-14T18:00:00+09:00"
				],
				"areas": [
					{
						"area": {
							"name": "東京地方",
							"code": "130010"
						},
						"pops": [
							"0",
							"0",
							"10",
							"10",
							"20",
							"40",
							"50"
						]
					},
					{
						"area": {
							"name": "伊豆諸島北部",
							"code": "130020"
						},
						"pops": [
							"10",
							"10",
							"20",
							"50",
							"50",
							"60",
							"80"
						]
					},

さらに見ていきます。次に出てきたのは気温の予報ですね。こちらは最高気温、最低気温ではなく、時間ごとの気温の予報です。

				"timeDefines": [
					"2022-06-13T09:00:00+09:00",
					"2022-06-13T00:00:00+09:00",
					"2022-06-14T00:00:00+09:00",
					"2022-06-14T09:00:00+09:00"
				],
				"areas": [
					{
						"area": {
							"name": "東京",
							"code": "44132"
						},
						"temps": [
							"27",
							"27",
							"17",
							"21"
						]
					},
					{
						"area": {
							"name": "大島",
							"code": "44172"
						},
						"temps": [
							"25",
							"25",
							"17",
							"22"
						]
					},

他にも、週間天気予報や最低気温、最高気温などが含まれていました。

最後に

今回はjsonの中身を見るだけで終わってしまいましたが、次回からは中身のデータを表示できるようにしていこうと思います。