雨なので気象庁の公開データを Javascript を使って見てみる。
気象データを問い合わせるのに、定数になっている日本全国の場所のコード( pathCode )を見てみる。
なぜなら、それをしらないとエリアごとの気象データを問い合わせできない。
const axios = require("axios");
const url = "https://www.jma.go.jp/bosai/common/const/area.json";
(get_area = async () => {
try {
const response = await axios.get(url);
console.log(response.data);
} catch (error) {
console.error(error);
}
})();
terminal:
> node tenki-area.js > tenki-area.json
Rf:
https://mindtech.jp/?p=1754
require "json"
require "net/http"
area_code_url = "https://www.jma.go.jp/bosai/common/const/area.json"
response = Net::HTTP.get_response(URI.parse(area_code_url))
h_area = JSON.parse(response.body)
pp h_area["offices"]
require "json"
require "net/http"
area_code_url = "https://www.jma.go.jp/bosai/common/const/area.json";
response1 = Net::HTTP.get_response(URI.parse(area_code_url))
h_area_code = JSON.parse(response1.body)
uri = "https://www.jma.go.jp/bosai/forecast/data/forecast/"
#area = "260000" #Kyoto
h_area_code["offices"].each {|v|
area = v[0]
begin
response2 = Net::HTTP.get_response(URI.parse("#{uri}#{area}.json"))
h_area_data = JSON.parse(response2.body)
h_area_data.each {|vv|
pp vv["publishingOffice"]
pp vv["reportDatetime"]
vv["timeSeries"].each {|x|
x["areas"].each {|xx| pp xx['area']}
}
puts
puts "--------------------------------------------------"
puts
}
rescue
puts
end
}
import requests
import json
area_code_url = "https://www.jma.go.jp/bosai/common/const/area.json";
headers = {"content-type": "application/json; charset=utf-8"}
response = requests.get(area_code_url, headers=headers)
data = response.json()
print(json.dumps(data['offices'],ensure_ascii=False,indent = 4))
#nim -d:ssl
import httpclient,strutils,uri
import json
const area_code_url = "https://www.jma.go.jp/bosai/common/const/area.json"
let client0 = newHttpClient()
let response = client0.get(area_code_url)
let jsObj = parseJson(response.body)
client0.close()
echo jsObj["offices"].pretty()
Rf:
https://qiita.com/youtoy/items/932bc48b03ced5a45c71
例えば京都という場所の天気を問い合わせる。
const axios = require("axios");
const url = "https://www.jma.go.jp/bosai/forecast/data/forecast/";
const area = "260000"; // Kyoto
(getWeatherForecast = async () => {
try {
const response = await axios.get(`${url}${area}.json`);
console.log(response.data);
console.log(response.data[0].publishingOffice);
console.log(response.data[0].timeSeries[0].areas);
for(const area of response.data[0].timeSeries[0].areas){
console.log(`----${area.area.name}----`);
for(const weather of area.weathers){
console.log(weather);
}
}
} catch (error) {
console.error(error);
}
})();
terminal:
> node tenki.js
> node tenki.js
[
{
publishingOffice: '京都地方気象台',
reportDatetime: '2022-04-26T17:00:00+09:00',
timeSeries: [ [Object], [Object], [Object] ]
},
{
publishingOffice: '京都地方気象台',
reportDatetime: '2022-04-26T17:00:00+09:00',
timeSeries: [ [Object], [Object] ],
tempAverage: { areas: [Array] },
precipAverage: { areas: [Array] }
}
]
京都地方気象台
[
{
area: { name: '南部', code: '260010' },
weatherCodes: [ '300', '311', '100' ],
weathers: [
'雨 所により 夜遅く 雷を伴い 激しく 降る',
'雨 昼前 から くもり 後 晴れ 所により 明け方 まで 雷を伴い 激しく 降る',
'晴れ'
],
winds: [ '南の風 後 南西の風', '南西の風 後 北西の風', '北の風' ]
},
{
area: { name: '北部', code: '260020' },
weatherCodes: [ '300', '311', '100' ],
weathers: [
'雨 所により 夜遅く 雷を伴い 激しく 降る',
'雨 昼前 から くもり 後 晴れ 所により 明け方 まで 雷を伴い 激しく 降る',
'晴れ'
],
winds: [ '南の風 やや強く 海上 では 南の風 強く', '南西の風 後 北東の風 海上 では 南西の風 やや強く', '北の風' ],
waves: [ '1.5メートル 後 2メートル', '2メートル 後 1.5メートル', '1 .5メートル' ]
}
]
----南部----
雨 所により 夜遅く 雷を伴い 激しく 降る
雨 昼前 から くもり 後 晴れ 所により 明け方 まで 雷を伴い 激しく 降る
晴れ
----北部----
雨 所により 夜遅く 雷を伴い 激しく 降る
雨 昼前 から くもり 後 晴れ 所により 明け方 まで 雷を伴い 激しく 降る
晴
これをサンプルにして Javascript を学習する。
node.js で動いたプログラムを browserify によってブラウザで動作するようにする。
Browsers don't have the require method defined, but Node.js does. With Browserify you can write code that uses require in the same way that you would use it in Node.
インストール
terminal:
> npm install -g browserify
他の言語である println のように使っているコンソール.ログがブラウザでどうなるのかわからないので、require しておいてみる。
const console = require("console");
const axios = require("axios");
const url = "https://www.jma.go.jp/bosai/forecast/data/forecast/";
const area = "260000"; // Kyoto
(getWeatherForecast = async () => {
try {
const response = await axios.get(`${url}${area}.json`);
// console.log(response.data);
// console.log(response.data[0].publishingOffice);
// console.log(response.data[0].timeSeries[0].areas);
for(const area of response.data[0].timeSeries[0].areas){
console.log(`----${area.area.name}----`);
for(const weather of area.weathers){
console.log(weather);
}
}
} catch (error) {
console.error(error);
}
})();
tenki_2.js
をブラウザ仕様の javascript ファイル bundle.js
に変換する。
terminal:
> browserify tenki_2.js -o bundle.js
bundle.js
https://pastebin.com/szscGNsR
html ファイルを作って、 bundle.js を読み込むようにする。
例えば tenki という名前でフォルダを作って、index.html, bundle.js を tenki フォルダに配置する。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>tenki_area browserify example</title>
<script src="bundle.js"></script>
</head>
<body>
</body>
</html>
chrome ブラウザーで tenki フォルダの中の html ファイルを開く。
chrome browser:
CTRL
+ shift
+ i
DevTools
index.html
:
Crieitは誰でも投稿できるサービスです。 是非記事の投稿をお願いします。どんな軽い内容でも投稿できます。
また、「こんな記事が読みたいけど見つからない!」という方は是非記事投稿リクエストボードへ!
こじんまりと作業ログやメモ、進捗を書き残しておきたい方はボード機能をご利用ください。
ボードとは?
コメント