データの読み込みのおさらい
気象情報の入った外部テキストを読み込んでグラフを描きましょう。
全4問(STEP1~STEP4)
ステップが作れたらその都度、Slackでプログラムのソースを送ってください。
(先生からOKが返ってこなくても次に進んで良いです)
注意点
データは気象庁のHPから拝借しました。2021年の諏訪市のデータです。気温や湿度、気圧など、様々なデータが記録されています。また、先頭行はデータではなく見出しとなっています。プログラムで読み込むときは先頭は読み飛ばすなどの工夫をしてください。難しいようならデータファイルの1行目(先頭行)を消して使ってもらってもOKです。
日,気圧(現地),気圧(海面),降水量(合計),降水量(日),気温(1時間),気温(10分間),気温(日平均),気温(日最高),気温(日最低),気温(最高),気温(最低),湿度(平均),湿度(最小),風速(平均),風速(最大),風向(最大),風速(最大瞬間),風向(最大瞬間),日照時間,降雪,最深積雪
1,927.1,1019,45.5,16,2.5,0.5,-0.3,4.3,-4,11.1,-8.4,71,16,3.2,12.7,西北西,20.3,西南西,163.7,5,5
2,926.1,1017,35,20,5,1.5,2.1,7.8,-2.8,17.7,-7.9,61,14,3.9,14.3,西北西,22.5,西,204.7,2,2
3,928.7,1018.2,84.5,29.5,9.5,3,7,12.9,1.4,22.3,-2.8,69,17,3.8,14.1,西北西,17.2,西北西,199.4,--,--
4,929.3,1017.8,85,35.5,6,2.5,9.9,15.9,4.1,22.6,-1.9,62,11,4.2,14.2,西北西,19,西,240.3,--,--
5,923.5,1009.5,150.5,55,9.5,3.5,15.6,20.8,10.7,26.1,1.9,69,12,3.2,12.9,西,20.7,南,164.7,--,--
6,924.4,1009.1,114,30.5,13.5,9.5,19.5,25.1,15.5,28.8,10.5,73,24,2.8,9.9,北北西,15.9,南東,163.9,--,--
7,926,1009.6,215,59.5,26,13,23.2,28.3,19.8,33.3,17.5,80,31,2.4,12.8,北東,21.3,北東,166.8,--,--
8,926.1,1009.5,373.5,149.5,32.5,12,23.7,28.4,20.5,33.9,18,79,23,2.7,8.7,西北西,17.8,南,163.8,--,--
9,928.8,1013.9,220.5,57,18,7,19.5,24.1,16.4,27.7,11.8,79,26,2.6,8.6,西北西,12.6,北西,153.1,--,--
10,931.8,1019.1,69.5,28.5,14.5,4.5,14.1,19.4,9.8,27.4,1.3,77,32,3,11.4,西北西,14.4,西北西,191.8,--,--
11,928.5,1017.8,41.5,30,7.5,2.5,7.4,12.6,3,17.5,-4.3,71,29,2.9,9.8,西北西,15.5,東南東,192,--,--
12,927.2,1018.1,70,32,10.5,3,2.4,7.2,-2.1,12.6,-7.2,72,22,3.3,13.9,西,18.9,西,186.8,--,--STEP1

テキストファイルを読み込んで、図のような気温(日平均)のグラフを描きなさい。画面サイズ対応はしなくていいです。1月と12月のグラフが切れていてもOKです。(STEP2で直します)
条件は下記のとおりです。
- 画面サイズ:size(330, 300)
- 線の太さ:20px
- 線の間隔:30px
- 背景色:255, 250, 223
- 塗りつぶし色:247, 226, 105
- 気温(日平均)は見出しを参考に何番目なのか自分で調べなさい
- 気温は1度を10ピクセルに置き換えて長さを求めなさい(10倍)
ヒント
int()関数は文字を整数に変換しますが、float()関数は文字を実数(小数)に変換します。
size(500, 200)
background(255, 250, 223)
stroke(247, 226, 105)
strokeWeight(20)STEP2

STEP1を改良して画面サイズが変わっても描けるように改良しなさい。ついでに1月と12月のグラフが切れている部分も直しなさい。
- 画面サイズ:いろいろ
- 線の間隔:画面サイズ(幅)を12等分した長さ
STEP3

グラフの上に気温を表示しなさい。
- 文字サイズ:12px
- 文字色:0, 0, 0
STEP4
アレンジしてください。気温以外のデータを表示したり、色を変えたりしてみてください。