{"id":5557,"date":"2016-07-01T01:51:43","date_gmt":"2016-06-30T16:51:43","guid":{"rendered":"http:\/\/r-dimension.xsrv.jp\/classes_j\/?p=5557"},"modified":"2020-06-01T23:46:21","modified_gmt":"2020-06-01T14:46:21","slug":"data_visual","status":"publish","type":"post","link":"https:\/\/r-dimension.xsrv.jp\/classes_j\/data_visual\/","title":{"rendered":"5.6\u3000\u30c7\u30fc\u30bf\u306e\u8996\u899a\u5316\uff08\u30c7\u30fc\u30bf\u30fb\u30d3\u30b8\u30e5\u30a2\u30e9\u30a4\u30bc\u30fc\u30b7\u30e7\u30f3\uff09"},"content":{"rendered":"\n

\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u3068\u30c7\u30b6\u30a4\u30f3\u306e\u5f79\u5272\u306e\u4e00\u3064\u306b\u300c\u30c7\u30fc\u30bf\u306e\u8996\u899a\u5316<\/strong>\u300d\u304c\u3042\u308a\u307e\u3059\u3002\u4e00\u822c\u7684\u306b\u300c\u30a4\u30f3\u30d5\u30a9\u30b0\u30e9\u30d5\u30a3\u30c3\u30af\u300d\u3068\u547c\u3070\u308c\u308b\u3082\u306e\u3067\u3059\u304c\u3001\u30d7\u30ed\u30b0\u30e9\u30e0\u3092\u3046\u307e\u304f\u4f7f\u3048\u3070\u30a4\u30f3\u30bf\u30e9\u30af\u30b7\u30e7\u30f3\u306e\u3042\u308b\u30a4\u30f3\u30d5\u30a9\u30b0\u30e9\u30d5\u30a3\u30c3\u30af\u3092\u4f5c\u308b\u3053\u3068\u3082\u53ef\u80fd\u3067\u3059\u3002\u7279\u306b\u3001\u8fd1\u5e74\u306f\u30a4\u30f3\u30bf\u30fc\u30cd\u30c3\u30c8\u306e\u666e\u53ca\u306b\u3088\u3063\u3066\u5927\u91cf\u306e\u30c7\u30fc\u30bf\u304c\u65e5\u3005\u751f\u307f\u51fa\u3055\u308c\u3066\u3044\u308b\u72b6\u6cc1\u306b\u304a\u3044\u3066\u3001\u305d\u308c\u3089\u306e\u30c7\u30fc\u30bf\u3092\u5206\u304b\u308a\u3084\u3059\u304f\u8996\u899a\u5316\u3059\u308b\u5fc5\u8981\u6027\u304c\u91cd\u8981\u8996\u3055\u308c\u3066\u3044\u307e\u3059\u3002
\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u3068\u30c7\u30b6\u30a4\u30f3\u306e\u7d50\u3073\u3064\u304d\u306e\u4e00\u3064\u306e\u53ef\u80fd\u6027\u3068\u3057\u3066\u3001\u5b9f\u969b\u306b\u8996\u899a\u5316\u3092\u4f53\u9a13\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n

5.6.1\u3000\u30c7\u30fc\u30bf\u8996\u899a\u5316\u306e\u5b9f\u4f8b<\/h1>\n\n\n\n

\u307e\u305a\u306f\u3001\u30c7\u30fc\u30bf\u53ef\u8996\u5316\u306e\u5b9f\u4f8b\u3092\u53c2\u7167\u3057\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n

\u25cfRadiation & Food Map in Japan<\/h4>\n\n\n\n

http:\/\/foodradiation.org\/map\/<\/a><\/p>\n\n\n\n

\u798f\u5cf6\u7b2c\u4e00\u539f\u767a\u4e8b\u6545\u5f8c\u304b\u3089\u73fe\u5728\u306b\u81f3\u308b\u307e\u3067\u306e\u65e5\u672c\u5168\u56fd\u306e\u98df\u54c1\u4e2d\u653e\u5c04\u6027\u7269\u8cea\u691c\u67fb\u306e\u7d50\u679c\u3092\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u30de\u30c3\u30d7\u306b\u3057\u305f\u3082\u306e\u3002\u7d04157\u4e07\u4ef6\uff082017\u5e741\u6708\u73fe\u5728\uff09\u306e\u691c\u67fb\u7d50\u679c\u304c\u8996\u899a\u5316\u3055\u308c\u3066\u3044\u308b\u3002\u81ea\u8eab\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3002<\/p>\n\n\n\n

\"2016_10_03_19_09\"<\/a><\/figure>\n\n\n\n
\u56f35.6-a<\/div>\n\n\n\n\n\n\n\n

\u25cf\u30d1\u30b9\u30b1\u30c3\u30c8\u30dc\u30fc\u30eb\u306b\u304a\u3051\u308b\u30b7\u30e5\u30fc\u30c8\u30dd\u30a4\u30f3\u30c8\u306e\u8996\u899a\u5316<\/h4>\n\n\n\n

http:\/\/www.nytimes.com\/interactive\/2012\/06\/11\/sports\/basketball\/nba-shot-analysis.html<\/a><\/p>\n\n\n\n

\"2016_10_03_19_10\"<\/a><\/figure>\n\n\n\n
\u56f35.6-b<\/div>\n\n\n\n

\u25cf\u30ac\u30f3\u30b8\u30b9\u5ddd\u306e\u6c34\u8cea\u6c5a\u67d3<\/h4>\n\n\n\n

https:\/\/graphics.reuters.com\/INDIA-RIVER\/010081TW39P\/index.html<\/a><\/p>\n\n\n\n

\u30a4\u30f3\u30c9\u653f\u5e9c\u306f\u300110\u5104\u306e\u30d2\u30f3\u30ba\u30fc\u6559\u5f92\u304c\u5d07\u62dd\u30574\u5104\u4eba\u306e\u6c34\u6e90\u306e\u30ac\u30f3\u30b8\u30b9\u5ddd\u3092\u6551\u3046\u305f\u3081\u306b\u95d8\u3063\u3066\u3044\u308b\u3002\u3053\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306f\u3001\u5ddd\u304c\u65e5\u5e38\u7684\u306b\u51e6\u7406\u3057\u306a\u3051\u308c\u3070\u306a\u3089\u306a\u3044\u6c5a\u67d3\u3068\u3001\u6c34\u8cea\u304c\u3044\u304b\u306b\u60aa\u3044\u304b\u3092\u8996\u899a\u5316\u3057\u3066\u3044\u308b\u3002<\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n
\u56f35.6-c<\/div>\n\n\n\n

\u25cf\u30aa\u30d0\u30de\u653f\u6a29\u306b\u304a\u3051\u308b2013\u5e74\u306e\u56fd\u5bb6\u4e88\u7b97\u63d0\u6848\u306e\u5185\u8a33<\/h4>\n\n\n\n

http:\/\/www.nytimes.com\/interactive\/2012\/02\/13\/us\/politics\/2013-budget-proposal-graphic.html<\/a><\/p>\n\n\n\n

\"2016_10_03_19_13\"<\/a><\/figure>\n\n\n\n
\u56f35.6-d<\/div>\n\n\n\n

\u25cf\u30a2\u30e1\u30ea\u30ab\u306b\u304a\u3051\u308b\u4f1d\u67d3\u75c5\u306e\u62e1\u6563\u3068\u30ef\u30af\u30c1\u30f3\u306e\u95a2\u4fc2\u3092\u8996\u899a\u5316\u3057\u305f\u30de\u30c3\u30d7<\/h4>\n\n\n\n

http:\/\/graphics.wsj.com\/infectious-diseases-and-vaccines\/<\/a><\/p>\n\n\n\n

70\u5e74\u4ee5\u4e0a\u306e\u7f79\u60a3\u8005\u6570\u306e\u30c7\u30fc\u30bf\u304c\u5dde\u3054\u3068\u306b\u8272\u5206\u3051\u3055\u308c\u3066\u3044\u308b\u3002\u3053\u306e\u3088\u3046\u306a\u624b\u6cd5\u306f\u4e00\u822c\u7684\u306b\u30d2\u30fc\u30c8\u30de\u30c3\u30d7\u3068\u547c\u3070\u308c\u308b\u3002<\/p>\n\n\n\n

\"2017_01_02_17_52\"<\/a><\/figure>\n\n\n\n
\u56f35.6-e<\/div>\n\n\n\n

\u25cf\u30a4\u30ae\u30ea\u30b9\u306e\u30a8\u30cd\u30eb\u30ae\u30fc\u6d88\u8cbb<\/h4>\n\n\n\n

http:\/\/www.evoenergy.co.uk\/uk-energy-guide\/<\/a><\/p>\n\n\n\n

\"2016_10_03_19_16\"<\/a><\/figure>\n\n\n\n
\u56f35.6-f<\/div>\n\n\n\n

\u25cf\u8996\u899a\u5316\u306e\u69d8\u3005\u306a\u5b9f\u9a13\u7684\u30b5\u30a4\u30c8<\/h4>\n\n\n\n

http:\/\/infosthetics.com\/http:\/\/datavisualization.ch\/showcases\/http:\/\/www.visualcomplexity.com\/vc\/<\/a><\/p>\n\n\n\n

\u3069\u3046\u3067\u3057\u3087\u3046\u304b\u3002\u69d8\u3005\u306a\u8996\u899a\u5316\u306e\u5b9f\u4f8b\u304c\u3042\u308a\u307e\u3059\u306d\u3002<\/p>\n\n\n\n

5.6.2\u3000\u68d2\u30b0\u30e9\u30d5\u3092\u30d7\u30ed\u30b0\u30e9\u30e0\u3067\u8a18\u8ff0\u3057\u3066\u307f\u308b<\/h1>\n\n\n\n

\u305d\u308c\u3067\u306f\u3001\u5b9f\u969b\u306e\u8996\u899a\u5316\u306e\u7b2c\u4e00\u6b69\u3068\u3057\u3066\u68d2\u30b0\u30e9\u30d5\u3092\u30d7\u30ed\u30b0\u30e9\u30e0\u3067\u8a18\u8ff0\u3059\u308b\u3068\u3053\u308d\u304b\u3089\u59cb\u3081\u307e\u3059\u3002<\/p>\n\n\n\n

\"2017_01_02_22_50\"<\/a><\/figure>\n\n\n\n
\u56f35.6-g<\/div>\n\n\n\n
\u30ea\u30b9\u30c85.6-a<\/div>\n\n\n\n
int a = 10;    \/\/a\u301cf\u306f\u305d\u308c\u305e\u308c\u306e\u30d0\u30fc\u306e\u5024\nint b = 14;\nint c = 20;\nint d = 80;\nint e = 2;\nint f = 18;\nfloat bar_w;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\n \nsize(400, 400);\nbackground(255);\n \nbar_w = 40;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\u309240\u30d4\u30af\u30bb\u30eb\u306b\u3059\u308b\n \nfill(127);    \/\/\u30b0\u30ec\u30fc\u3067\u63cf\u753b\nrect(0, height - a, bar_w, a);    \/\/\u4e00\u3064\u305a\u3064\u30d0\u30fc\u3092\u63cf\u753b\nrect(bar_w, height - b, bar_w, b);\nrect(bar_w*2, height - c, bar_w, c);\nrect(bar_w*3, height - d, bar_w, d);\nrect(bar_w*4, height - e, bar_w, e);\nrect(bar_w*5, height - f, bar_w, f);<\/code><\/pre>\n\n\n\n
\u3053\u308c\u3092\u3001\u914d\u5217\u3067\u66f8\u304d\u63db\u3048\u3066\u307f\u307e\u3057\u3087\u3046\u3002\u30b3\u30fc\u30c9\u306f\u304b\u306a\u308a\u77ed\u304f\u306a\u308a\u307e\u3059\u3002\u3053\u3046\u3044\u3063\u305f\u7528\u9014\u3082\u3001\u914d\u5217\u306e\u5229\u70b9\u3092\u8868\u3057\u3066\u3044\u307e\u3059\u3002\u307e\u305f\u3001\u6570\u5024\u3082\u30d0\u30fc\u306e\u4e0a\u306b\u8868\u793a\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n
\u30ea\u30b9\u30c85.6-b<\/div>\n\n\n\n
PFont myFont;    \/\/\u30d5\u30a9\u30f3\u30c8\u7528\u5909\u6570\nint[] value = {10, 14, 20, 80, 2, 18};\nString[] s = {\"a\", \"b\", \"c\", \"d\", \"e\", \"f\"};\n \nfloat barW;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\n \nsize(400, 400);\nbackground(255);\n \nmyFont = createFont(\"Arial\", 12);    \/\/\u30d5\u30a9\u30f3\u30c8\u4f5c\u6210\ntextFont(myFont, 12);  \/\/\u30c6\u30ad\u30b9\u30c8\u306e\u30b5\u30a4\u30ba\u3092\u8a2d\u5b9a\ntextAlign(CENTER);\n \nbarW = 40;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\u309240\u30d4\u30af\u30bb\u30eb\u306b\u3059\u308b\n \n\/\/\u30d0\u30fc\u3068\u30c6\u30ad\u30b9\u30c8\u3092\u63cf\u753b\u3002value.lengh\u306f\u914d\u5217\u306e\u8981\u7d20\u6570\u3092\u8fd4\u3059\nfor (int i = 0; i < value.length; i ++) {\n \n  \/\/\u30d0\u30fc\u306ex\u5ea7\u6a19, y\u5ea7\u6a19\u3092\u8a08\u7b97\n  float x = barW*i;\n  float y = height - value[i];\n \n  fill(127);    \/\/\u30b0\u30ec\u30fc\u3067\u63cf\u753b\n  rect(x, y, barW, value[i]);\n \n  \/\/\u30c6\u30ad\u30b9\u30c8\u8868\u793a\n  fill(255, 0, 0);    \/\/\u8d64\u3067\u63cf\u753b\n  text(s[i] + \" = \" + value[i], x + barW\/2, y - 10);\n}<\/code><\/pre>\n\n\n\n
\u6b21\u306b\u3001\u3082\u3046\u5c11\u3057\u67d4\u8edf\u306a\u8868\u793a\u304c\u53ef\u80fd\u306b\u306a\u308b\u30d7\u30ed\u30b0\u30e9\u30e0\u306b\u66f8\u304d\u63db\u3048\u3066\u307f\u307e\u3059\u3002\u30d0\u30fc\u306e\u30b5\u30a4\u30ba\u304c\u753b\u9762\u306e\u6a2a\u5e45\u306b\u5fdc\u3058\u3066\u5909\u5316\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
\"2016_06_27_19_44\"<\/a><\/figure>\n\n\n\n
\u56f35.6-h<\/div>\n\n\n\n
\u30ea\u30b9\u30c85.6-c<\/div>\n\n\n\n
PFont myFont;    \/\/\u30d5\u30a9\u30f3\u30c8\u7528\u5909\u6570\nint[] value = {10, 14, 20, 80, 2, 18};\nString[] s = {\"a\", \"b\", \"c\", \"d\", \"e\", \"f\"};\n \nfloat barW;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\n \nsize(400, 400);\nbackground(255);\n \nmyFont = createFont(\"Arial\", 12);    \/\/\u30d5\u30a9\u30f3\u30c8\u4f5c\u6210\ntextFont(myFont, 12);  \/\/\u30c6\u30ad\u30b9\u30c8\u306e\u30b5\u30a4\u30ba\u3092\u8a2d\u5b9a\ntextAlign(CENTER);\n \nbarW = width\/float(value.length);  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\u3092\u6c7a\u5b9a\n \n\/\/\u30d0\u30fc\u3068\u30c6\u30ad\u30b9\u30c8\u3092\u63cf\u753b\u3002value.lengh\u306f\u914d\u5217\u306e\u8981\u7d20\u6570\u3092\u8fd4\u3059\nfor (int i = 0; i < value.length; i ++) {\n \n  \/\/\u30d0\u30fc\u306ex\u5ea7\u6a19, y\u5ea7\u6a19\u3092\u8a08\u7b97\n  float x = barW*i;\n  float y = height - value[i];\n \n  fill(127);    \/\/\u30b0\u30ec\u30fc\u3067\u63cf\u753b\n  rect(x, y, barW, value[i]);\n \n  \/\/\u30c6\u30ad\u30b9\u30c8\u8868\u793a\n  fill(255, 0, 0);    \/\/\u8d64\u3067\u63cf\u753b\n  text(s[i] + \" = \" + value[i], x + barW\/2, y - 10);\n}<\/code><\/pre>\n\n\n\n
\u3053\u306e\u307e\u307e\u3060\u3068\u3061\u3087\u3063\u3068\u9ad8\u3055\u304c\u4f4e\u304f\u3066\u5dee\u304c\u5206\u304b\u308a\u3065\u3089\u3044\u306e\u3067\u3001\u30d0\u30fc\u306e\u9ad8\u3055\u3092\u753b\u9762\u306e\u9ad8\u3055\u306b\u5408\u308f\u305b\u3066\u62e1\u5927\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
\"2016_06_27_19_45\"<\/a><\/figure>\n\n\n\n
\u56f35.6-i<\/div>\n\n\n\n
\u30ea\u30b9\u30c85.6-d<\/div>\n\n\n\n
PFont myFont;    \/\/\u30d5\u30a9\u30f3\u30c8\u7528\u5909\u6570\nint[] value = {10, 14, 20, 80, 2, 18};\nString[] s = {\"a\", \"b\", \"c\", \"d\", \"e\", \"f\"};\n \nfloat barW;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\nfloat barH;\nfloat resize = 4.0; \n \nsize(400, 400);\nbackground(255);\n \nmyFont = createFont(\"Arial\", 12);    \/\/\u30d5\u30a9\u30f3\u30c8\u4f5c\u6210\ntextFont(myFont, 12);  \/\/\u30c6\u30ad\u30b9\u30c8\u306e\u30b5\u30a4\u30ba\u3092\u8a2d\u5b9a\ntextAlign(CENTER);\n \nbarW = width\/float(value.length);  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\u3092\u6c7a\u5b9a\n \n\/\/\u30d0\u30fc\u3068\u30c6\u30ad\u30b9\u30c8\u3092\u63cf\u753b\u3002value.lengh\u306f\u914d\u5217\u306e\u8981\u7d20\u6570\u3092\u8fd4\u3059\nfor (int i = 0; i < value.length; i ++) {\n \n  \/\/\u30d0\u30fc\u306ex\u5ea7\u6a19, y\u5ea7\u6a19\u3092\u8a08\u7b97\n  float x = barW*i;\n  float y = height - value[i]*resize;\n  barH = value[i]*resize;\n \n  fill(127);    \/\/\u30b0\u30ec\u30fc\u3067\u63cf\u753b\n  rect(x, y, barW, barH);\n \n  \/\/\u30c6\u30ad\u30b9\u30c8\u8868\u793a\n  fill(255, 0, 0);    \/\/\u8d64\u3067\u63cf\u753b\n  text(s[i] + \" = \" + value[i], x + barW\/2, y - 10);\n}<\/code><\/pre>\n\n\n\n
\u3055\u3089\u306b\u3001\u5de6\u53f3\u3068\u4e0b\u306e\u4f59\u767d\u3001\u30d0\u30fc\u540c\u58eb\u306e\u4f59\u767d\u3082\u4f5c\u3063\u3066\u307f\u307e\u3057\u3087\u3046\u3002<\/p>\n\n\n\n
\"2016_06_27_20_08\"<\/a><\/figure>\n\n\n\n
\u56f35.6-j<\/div>\n\n\n\n
\u30ea\u30b9\u30c85.6-e<\/div>\n\n\n\n
PFont myFont;    \/\/\u30d5\u30a9\u30f3\u30c8\u7528\u5909\u6570\nint[] value = {10, 14, 20, 80, 2, 18};\nString[] s = {\"a\", \"b\", \"c\", \"d\", \"e\", \"f\"};\n\nfloat barW;  \/\/\u30d0\u30fc\u306e\u6a2a\u5e45\nfloat barH;\nfloat resize = 3.0; \nfloat margin = 20.0;  \/\/\u5de6\u53f3\u3068\u5e95\u8fba\u306e\u4f59\u767d\nfloat space = 4.0;\n\nsize(400, 400);\nbackground(255);\n\nmyFont = createFont(\"Arial\", 12);    \/\/\u30d5\u30a9\u30f3\u30c8\u4f5c\u6210\ntextFont(myFont, 12);  \/\/\u30c6\u30ad\u30b9\u30c8\u306e\u30b5\u30a4\u30ba\u3092\u8a2d\u5b9a\ntextAlign(CENTER);\n\n\/\/\u30d0\u30fc\u306e\u6a2a\u5e45\u3092\u6c7a\u5b9a\nbarW = (width - margin*2 - (value.length - 1)*space)\/float(value.length);\n\n\/\/\u30d0\u30fc\u3068\u30c6\u30ad\u30b9\u30c8\u3092\u63cf\u753b\u3002value.lengh\u306f\u914d\u5217\u306e\u8981\u7d20\u6570\u3092\u8fd4\u3059\nfor (int i = 0; i < value.length; i ++) {\n\n  \/\/\u30d0\u30fc\u306ex\u5ea7\u6a19, y\u5ea7\u6a19\u3092\u8a08\u7b97\n  float x = (barW + space)*i + margin;\n  float y = height - value[i]*resize - margin;\n  barH = value[i]*resize;\n\n  fill(127);    \/\/\u30b0\u30ec\u30fc\u3067\u63cf\u753b\n  rect(x, y, barW, barH);\n\n  \/\/\u30c6\u30ad\u30b9\u30c8\u8868\u793a\n  fill(255, 0, 0);    \/\/\u8d64\u3067\u63cf\u753b\n  text(s[i] + \" = \" + value[i], x + barW\/2, y - 10);\n}<\/code><\/pre>\n\n\n\n
5.6.3\u3000\u30c7\u30fc\u30bf\u30d5\u30a9\u30fc\u30de\u30c3\u30c8<\/h1>\n\n\n\n
\u4e00\u822c\u7684\u306b\u81a8\u5927\u306a\u30c7\u30fc\u30bf\u3092\u8996\u899a\u5316\u3059\u308b\u969b\u306b\u306f\u3001\u30d5\u30a1\u30a4\u30eb\u304b\u3089\u30c7\u30fc\u30bf\u3092\u8aad\u307f\u8fbc\u3093\u3067\u304b\u3089\u30d7\u30ed\u30b0\u30e9\u30e0\u4e0a\u3067\u6570\u5024\u3092\u5f62\u614b\u3001\u8272\u5f69\u3001\u904b\u52d5\u3001\u30a4\u30f3\u30bf\u30e9\u30af\u30b7\u30e7\u30f3\u306b\u5909\u63db\u3057\u307e\u3059\u3002\u3053\u306e\u9805\u3067\u306f\u3001\u30c7\u30fc\u30bf\u30d9\u30fc\u30b9\u3092\u6271\u3046\u3068\u304d\u306b\u4f7f\u308f\u308c\u308b\u4ee3\u8868\u7684\u306a\u30c7\u30fc\u30bf\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\uff08\u5f62\u5f0f\uff09\u3092\u5b66\u7fd2\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
XLS\uff08XLSX\uff09<\/h4>\n\n\n\n
Microsoft Excel\u306a\u3069\u3067\u4f7f\u308f\u308c\u3066\u3044\u308b\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\u3067\u3059\u304c\u3001\u3053\u308c\u3082\u30c7\u30fc\u30bf\u30d9\u30fc\u30b9\u306e\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\u3068\u8a00\u3048\u307e\u3059\u3002\u30c6\u30fc\u30d6\u30eb\u306b\u4fdd\u5b58\u3057\u307e\u3059\u304c\u3001Excel\u4e0a\u3067\u64cd\u4f5c\u3057\u3084\u3059\u3044\u306e\u304c\u5f37\u307f\u3067\u3059\u3002<\/p>\n\n\n\n
\"\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8_2016_06_30_20_51\"<\/a><\/figure>\n\n\n\n
\u56f35.6-k<\/div>\n\n\n\n
CSV (comma-separated values)<\/h4>\n\n\n\n
\u30c7\u30fc\u30bf\u540c\u58eb\u304c\u30ab\u30f3\u30de\u3067\u533a\u5207\u3089\u308c\u3066\u3044\u308b\u3060\u3051\u306e\u3001\u975e\u5e38\u306b\u5358\u7d14\u306a\u69cb\u9020\u3092\u3057\u3066\u3044\u308b\u30c7\u30fc\u30bf\u5f62\u5f0f\u3067\u3059\u3002\u73fe\u72b6\u3001\u30a4\u30f3\u30bf\u30fc\u30cd\u30c3\u30c8\u4e0a\u3067\u5165\u624b\u3067\u304d\u308b\u30c7\u30fc\u30bf\u306f\u3001\u3053\u306e\u5f62\u5f0f\u306b\u306a\u3063\u3066\u3044\u308b\u3053\u3068\u304c\u591a\u3044\u3068\u3044\u3048\u307e\u3059\u3002<\/p>\n\n\n\n
\"weather_month_csv\"<\/a><\/figure>\n\n\n\n
\u56f35.6-l<\/div>\n\n\n\n
XML (Extensible Markup Language)<\/h4>\n\n\n\n
\u6bd4\u8f03\u7684\u6b74\u53f2\u306e\u6d45\u3044\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\u3067\u3059\u304c\u3001\u30a4\u30f3\u30bf\u30fc\u30cd\u30c3\u30c8\u306e\u767a\u5c55\u3068\u3068\u3082\u306b\u5e83\u307e\u3063\u3066\u304d\u307e\u3057\u305f\u3002\u8a18\u8ff0\u5f62\u5f0f\u306fHTML\u3068\u3082\u826f\u304f\u4f3c\u3066\u3044\u307e\u3059\u3002\u3053\u306e\u5f62\u5f0f\u3067\u30c7\u30fc\u30bf\u3092\u516c\u958b\u3057\u3066\u3044\u308b\u516c\u5171\u6a5f\u95a2\u3082\u5c11\u306a\u304f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n
\"weather_month_xml\"<\/a><\/figure>\n\n\n\n
\u56f35.6-m<\/div>\n\n\n\n
JSON (JavaScript Object Notation)<\/h4>\n\n\n\n
\u73fe\u5728\u4e3b\u6d41\u306b\u306a\u308a\u3064\u3064\u3042\u308b\u30d5\u30a9\u30fc\u30de\u30c3\u30c8\u3067\u3059\u3002XML\u3068\u3082\u4f3c\u3066\u3044\u307e\u3059\u304c\u3001\u4e00\u822c\u7684\u306bXML\u3088\u308a\u3082\u9ad8\u901f\u306b\u51e6\u7406\u304c\u53ef\u80fd\u3068\u3044\u308f\u308c\u3066\u3044\u307e\u3059\u3002\u7279\u306b\u30a4\u30f3\u30bf\u30fc\u30cd\u30c3\u30c8\u3067\u5e83\u304f\u5229\u7528\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n
\"weather_month_json\"<\/a><\/figure>\n\n\n\n
\u56f35.6-n<\/div>\n\n\n\n
\u305d\u308c\u305e\u308c\u306b\u7279\u5fb4\u304c\u3042\u308a\u307e\u3059\u304c\u3001\u3053\u3053\u3067\u306fXML\u5f62\u5f0f\u3068JSON\u5f62\u5f0f\u306e\u30c7\u30fc\u30bf\u3092Processing\u306b\u8aad\u307f\u8fbc\u3093\u3067\u8996\u899a\u5316\u3092\u304a\u3053\u306a\u3063\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n
5.6.4\u3000XML\u306e\u30c7\u30fc\u30bf\u3092\u8aad\u307f\u8fbc\u3080<\/h1>\n\n\n\n
\u30b9\u30c6\u30c3\u30d71<\/h4>\n\n\n\n
\u307e\u305a\u306f\u3001XML\u30d5\u30a1\u30a4\u30eb\u306e\u30c7\u30fc\u30bf\u3092\u8aad\u307f\u8fbc\u3093\u3067\u307f\u307e\u3057\u3087\u3046\u3002\u30b5\u30f3\u30d7\u30eb\u306eXML\u30d5\u30a1\u30a4\u30eb\u306f\u30012015\u5e74\u306e\u6771\u4eac\u306e\u5e73\u5747\u6c17\u6e29\u3068\u5e73\u5747\u98a8\u901f\u3092\u4fdd\u5b58\u3057\u305f\u3082\u306e\u3067\u3059\u304c\u3001\u307e\u305a\u306f\u6c17\u6e29\u306e\u60c5\u5831\u3060\u3051\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n
\"2016_06_30_20_38\"<\/a><\/figure>\n\n\n\n
\u56f35.6-o<\/div>\n\n\n\n
\u6c17\u6e29\u3068\u98a8\u901f\u306e\u30c7\u30fc\u30bf\u306f\u6c17\u8c61\u5e81\u306e\u30b5\u30a4\u30c8\u304b\u3089\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3057\u307e\u3057\u305f\u3002
http:\/\/www.data.jma.go.jp\/gmd\/risk\/obsdl\/<\/a><\/p>\n\n\n\n
CSV\u30d5\u30a1\u30a4\u30eb\u3092XML\u306b\u5909\u63db\u3059\u308b\u969b\u306b\u306f\u6b21\u306e\u30b5\u30a4\u30c8\u3092\u5229\u7528\u3057\u307e\u3057\u305f\u3002
http:\/\/tools.nissuk.info\/csv-xml\/<\/a><\/p>\n\n\n\n
\u307e\u305a\u3001loadData\u3068\u3044\u3046\u95a2\u6570\u3092\u4f5c\u308a\u307e\u3059\u3002\u3053\u3053\u3067\u306f\u3001\u6c17\u6e29\u306e\u5024\u3092\u5165\u308c\u308b\u914d\u5217\u300ctemp\u300d\u3092\u4f5c\u3063\u3066\u3001\u305d\u3053\u306b\u5024\u3092\u5165\u308c\u307e\u3059\u3002<\/p>\n\n\n\n
void loadData() {\n\n  xml = loadXML(\"weather_month.xml\");  \/\/\u30d5\u30a1\u30a4\u30eb\u306e\u8aad\u307f\u8fbc\u307f\n\n  \/\/weather\u30bf\u30b0\u5185\u306e\u8981\u7d20\u3092\u53d6\u5f97\n  XML[] children = xml.getChildren(\"weather\");\n\n  \/\/\u8981\u7d20\u6570\u3092\u53d6\u5f97\u3057\u3066\u914d\u5217\u3092\u751f\u6210\n  temp = new float[children.length];\n\n  \/\/\u914d\u5217\u306b\u5024\u3092\u5165\u308c\u308b\n  for (int i = 0; i < temp.length; i++) {\n\n    \/\/\u6c17\u6e29\n    XML tempXml = children[i].getChild(\"temp\");\n    temp[i] = tempXml.getFloatContent();\n  }\n}<\/code><\/pre>\n\n\n\n
\u3053\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u3010list5_6_f\u3011\u3068\u3044\u3046\u30d5\u30a1\u30a4\u30eb\u540d\u3067\u4fdd\u5b58\u3057\u3066\u304a\u304d\u307e\u3059\u3002\u305d\u3057\u3066\u3001\u6b21\u306e\u30ea\u30f3\u30af\u5148\u306e\u300cdata.zip\u300d\u30d5\u30a1\u30a4\u30eb\u3092\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3001\u89e3\u51cd\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n
data<\/a>
\u89e3\u51cd\u3055\u308c\u305fdata\u30d5\u30a9\u30eb\u30c0\u306e\u4e2d\u306b\u306f\u6b21\u306e\u30d5\u30a1\u30a4\u30eb\u304c\u5165\u3063\u3066\u3044\u308b\u306e\u3067\u3001\u300clist5_6_f.pde\u300d\u30d5\u30a1\u30a4\u30eb\u3068\u540c\u3058\u968e\u5c64\u306b\u304a\u304d\u307e\u3057\u3087\u3046\u3002
weather_month.csv \/ weather_day.csv
weather_month.xml \/ weather_day.xml
weather_month.json \/ weather_day.json<\/p>\n\n\n\n
\u6b21\u306b\u3001\u63cf\u753b\u3059\u308b\u90e8\u5206\u3082\u8a18\u8ff0\u3057\u3066\u3044\u304d\u307e\u3059\u3002XML\u30d5\u30a1\u30a4\u30eb\u304b\u3089\u8aad\u307f\u8fbc\u3093\u3060\u6c17\u6e29\u306e\u30c7\u30fc\u30bf\u3092\u8272\u306b\u5909\u63db\u3057\u307e\u3059\u3002
\u6700\u7d42\u7684\u306a\u30b3\u30fc\u30c9\u306f\u6b21\u306e\u901a\u308a\u3067\u3059\u3010\u30ea\u30b9\u30c85.6-f\u3011\u3002<\/p>\n\n\n\n
\u30ea\u30b9\u30c85.6-f<\/div>\n\n\n\n
float[] temp;    \/\/\u6c17\u6e29\nfloat highTemp;  \/\/\u6700\u9ad8\u6c17\u6e29\nfloat lowTemp;  \/\/\u6700\u4f4e\u6c17\u6e29\nfloat barW = 40;            \/\/\u30d0\u30fc\u306e\u5e45\nfloat barH = 200;            \/\/\u30d0\u30fc\u306e\u9ad8\u3055\nXML xml;\n \nvoid setup() {\n  size(480, 200);\n  colorMode(HSB, 360, 100, 100);  \/\/HSB\u30e2\u30fc\u30c9\u306b\u3059\u308b\n  noStroke();\n  loadData();  \/\/xml\u30d5\u30a1\u30a4\u30eb\u304b\u3089\u30c7\u30fc\u30bf\u8aad\u307f\u8fbc\u307f\u3001\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u5316\n \n  \/\/\u4e00\u756a\u4f4e\u3044\u6c17\u6e29\u3068\u9ad8\u3044\u6c17\u6e29\u3092temp\u914d\u5217\u5185\u3067\u691c\u7d22\u3057\u3001\n  \/\/lowTemp\u3001highTemp\u306b\u5165\u308c\u308b\n  lowTemp = min(temp);\n  highTemp = max(temp);\n}\n \nvoid draw() {\n  background(0, 0, 100);\n \n  for (int i = 0; i < temp.length; i ++) {\n \n    float x = i*barW;  \/\/x\u5ea7\u6a19\u3092\u6c7a\u5b9a\n \n    \/\/\u6c17\u6e29\u3092\u8272\u306b\u5909\u63db\n    fill(createColor(temp[i], lowTemp, highTemp), 100, 100);\n    rect(x, 0, barW, barH);\n  }\n}\n \nvoid loadData() {\n \n  xml = loadXML(\"weather_month.xml\");  \/\/\u30d5\u30a1\u30a4\u30eb\u306e\u8aad\u307f\u8fbc\u307f\n \n  \/\/weather\u30bf\u30b0\u5185\u306e\u8981\u7d20\u3092\u53d6\u5f97\n  XML[] children = xml.getChildren(\"weather\");\n \n  \/\/\u8981\u7d20\u6570\u3092\u53d6\u5f97\u3057\u3066\u914d\u5217\u3092\u751f\u6210\n  temp = new float[children.length];\n \n  \/\/\u914d\u5217\u306b\u5024\u3092\u5165\u308c\u308b\n  for (int i = 0; i < temp.length; i++) {\n \n    \/\/\u6c17\u6e29\n    XML tempXml = children[i].getChild(\"temp\");\n    temp[i] = tempXml.getFloatContent();\n  }\n}\n \n\/\/\u6c17\u6e29\u304b\u3089\u8272\u3092\u6c7a\u5b9a\nfloat createColor(float _temp, float _lowTemp, float _highTemp) {\n \n  \/\/\u6700\u4f4e\u6c17\u6e29\u304b\u3089\u6700\u9ad8\u6c17\u6e29\u306e\u7bc4\u56f2\u3092\u3001\u8272\u76f8\u306e200\u00b0\u304b\u30890\u00b0\u306b\u5909\u63db\n  \/\/\u6c17\u6e29\u3092\u8272\u306b\u5909\u63db\n  float barColor = map(_temp, _lowTemp, _highTemp, 200, 0);\n \n  return barColor;\n}<\/code><\/pre>\n\n\n\n
\u30b9\u30c6\u30c3\u30d72<\/h4>\n\n\n\n
\u3053\u308c\u3060\u3051\u3060\u3068\u4f55\u306e\u60c5\u5831\u304b\u5206\u304b\u3089\u306a\u3044\u306e\u3067\u3001\u6b21\u306e\u8981\u7d20\u3092\u8ffd\u52a0\u3057\u3066\u307f\u307e\u3059\u3002
\u30fb\u4f59\u767d\u3092\u5165\u308c\u308b
\u30fb\u753b\u9762\u30b5\u30a4\u30ba\u306b\u5408\u308f\u305b\u3066\u53ef\u5909\u7684\u306b\u30b0\u30e9\u30d5\u306e\u5927\u304d\u3055\u304c\u5909\u308f\u308b\u3088\u3046\u306b\u3059\u308b
\u30fb\u65e5\u4ed8\u60c5\u5831\u3082\u8aad\u307f\u8fbc\u307f\u3001\u30c6\u30ad\u30b9\u30c8\u8868\u793a\u3059\u308b
\u30fb\u30de\u30a6\u30b9\u30aa\u30fc\u30d0\u30fc\u3067\u65e5\u4ed8\u3068\u6c17\u6e29\u304c\u8868\u793a\u3055\u308c\u308b\u3088\u3046\u306b\u3059\u308b<\/p>\n\n\n\n
\"visual_temp_xml2\"<\/a><\/figure>\n\n\n\n
\u56f35.6-p<\/div>\n\n\n\n
\u30ea\u30b9\u30c85.6-g<\/div>\n\n\n\n
String[] date; \/\/\u65e5\u4ed8\nfloat[] temp;    \/\/\u6c17\u6e29\nfloat highTemp;  \/\/\u6700\u9ad8\u6c17\u6e29\nfloat lowTemp;  \/\/\u6700\u4f4e\u6c17\u6e29\nPFont font;\nfloat barW;            \/\/\u30d0\u30fc\u306e\u5e45\nfloat barH = 200;            \/\/\u30d0\u30fc\u306e\u9ad8\u3055\nfloat margin = 25;    \/\/\u4f59\u767d\nboolean over = false;  \/\/\u30de\u30a6\u30b9\u304c\u30d0\u30fc\u306e\u4e0a\u306b\u3042\u308b\u304b\u3092\u5224\u5b9a\nfloat space = 1;       \/\/\u30d0\u30fc\u540c\u58eb\u306e\u9699\u9593\nXML xml;\n \nvoid setup() {\n  size(600, 250);\n  colorMode(HSB, 360, 100, 100);  \/\/HSB\u30e2\u30fc\u30c9\u306b\u3059\u308b\n  noStroke();\n  loadData();  \/\/xml\u30d5\u30a1\u30a4\u30eb\u304b\u3089\u30c7\u30fc\u30bf\u8aad\u307f\u8fbc\u307f\u3001\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u5316\n \n  \/\/\u4e00\u756a\u4f4e\u3044\u6c17\u6e29\u3068\u9ad8\u3044\u6c17\u6e29\u3092temp\u914d\u5217\u5185\u3067\u691c\u7d22\u3057\u3001\n  \/\/lowTemp\u3001highTemp\u306b\u5165\u308c\u308b\n  lowTemp = min(temp);\n  highTemp = max(temp);\n \n  \/\/\u753b\u9762\u30b5\u30a4\u30ba\u3068\u4f59\u767d\u5206\u3092\u8a08\u7b97\u3057\u3066\u30d0\u30fc\u306e\u5e45\u3092\u6c7a\u3081\u308b\n  barW = (width - margin*2 - space*(temp.length - 1))\/float(temp.length);\n \n  font = createFont(\"Arial\", 11);\n  textFont(font, 11);\n  textAlign(CENTER);\n}\n \nvoid draw() {\n  background(0, 0, 100);\n \n  \/\/\n  for (int i = 0; i < temp.length; i ++) {\n \n    float x = i*(barW + space) + margin;\n    float y = margin;\n \n    if (mouseX > x && mouseX < x + barW && mouseY > y && mouseY < y + barH) {\n \n      fill(0, 0, 20);      \n      text(\"\u6c17\u6e29\" + temp[i] + \"\u2103\", x + barW\/2, y - 8);  \/\/\u6c17\u6e29\u3068\u98a8\u901f\u3092\u8868\u793a\n      text(date[i], x + barW\/2, y + barH + 16);  \/\/\u65e5\u4ed8\u3092\u8868\u793a\n \n      \/\/\u6c17\u6e29\u3092\u8272\u306b\u5909\u63db\n      fill(createColor(temp[i], lowTemp, highTemp), 100, 100);\n    } else {\n      fill(createColor(temp[i], lowTemp, highTemp), 30, 100);\n    }      \n \n    rect(x, y, barW, barH);\n  }\n}\n \nvoid loadData() {\n \n  xml = loadXML(\"weather_month.xml\");  \/\/\u30d5\u30a1\u30a4\u30eb\u306e\u8aad\u307f\u8fbc\u307f\n \n  \/\/weather\u30bf\u30b0\u5185\u306e\u8981\u7d20\u3092\u53d6\u5f97\n  XML[] children = xml.getChildren(\"weather\");\n \n  \/\/\u8981\u7d20\u6570\u3092\u53d6\u5f97\u3057\u3066\u914d\u5217\u3092\u751f\u6210\n  date = new String[children.length];\n  temp = new float[children.length];\n \n  \/\/\u914d\u5217\u306b\u5024\u3092\u5165\u308c\u308b\n  for (int i = 0; i < date.length; i++) {\n \n    \/\/\u6708\n    XML dateXml = children[i].getChild(\"date\");\n    date[i] = dateXml.getContent();\n \n    \/\/\u6c17\u6e29\n    XML tempXml = children[i].getChild(\"temp\");\n    temp[i] = tempXml.getFloatContent();\n  }\n}\n \n\/\/\u6c17\u6e29\u304b\u3089\u8272\u3092\u6c7a\u5b9a\nfloat createColor(float _temp, float _lowTemp, float _highTemp) {\n \n  \/\/\u6700\u4f4e\u6c17\u6e29\u304b\u3089\u6700\u9ad8\u6c17\u6e29\u306e\u7bc4\u56f2\u3092\u3001\u8272\u76f8\u306e200\u00b0\u304b\u30890\u00b0\u306b\u5909\u63db\n  \/\/\u6c17\u6e29\u3092\u8272\u306b\u5909\u63db\n  float barColor = map(_temp, _lowTemp, _highTemp, 200, 0);\n \n  return barColor;\n}<\/code><\/pre>\n\n\n\n
\u30b9\u30c6\u30c3\u30d73<\/h4>\n\n\n\n
\u3053\u308c\u307e\u3067\u306e\u4f8b\u3067\u306f12\u30f6\u6708\uff08\u6708\u6bce\uff09\u306e\u30c7\u30fc\u30bf\u3092\u8868\u793a\u3057\u307e\u3057\u305f\u304c\u3001\u5b9f\u306f\u3053\u306e\u30b5\u30f3\u30d7\u30eb\u306f365\u65e5\uff08\u65e5\u6bce\uff09\u306e\u30c7\u30fc\u30bf\u306b\u5dee\u3057\u66ff\u3048\u308b\u3053\u3068\u3082\u3067\u304d\u307e\u3059\u3002\u3055\u3059\u304c\u306b\u65e5\u6bce\u306e\u30c7\u30fc\u30bf\u3092\u8868\u793a\u3059\u308b\u305f\u3081\u306b\u306f\u753b\u9762\u306e\u6a2a\u5e45\u304c\u3082\u3063\u3068\u5fc5\u8981\u306a\u306e\u3067\u3001\u6b21\u306e\u884c\u3092\u5909\u66f4\u3057\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n
14\u884c\u76ee\nsize(600, 250); \u2192 size(1500, 250);\n\n59\u884c\u76ee\nweather_month.xml \u2192 weather_day.xml<\/code><\/pre>\n\n\n\n
weather_day.xml\u306b\u306f365\u65e5\u5206\u306e1\u65e5\u5f53\u305f\u308a\u306e\u5e73\u5747\u6c17\u6e29\u306e\u60c5\u5831\u304c\u63b2\u8f09\u3055\u308c\u3066\u3044\u308b\u306e\u3067\u3001\u305d\u306e\u60c5\u5831\u3092\u8aad\u307f\u8fbc\u307f\u81ea\u52d5\u7684\u306b\u8996\u899a\u5316\u3057\u3066\u304f\u308c\u307e\u3059\u3002<\/p>\n\n\n\n
\"visual_temp_xml3\"<\/a><\/figure>\n\n\n\n
\u56f35.6-q<\/div>\n\n\n\n
\u5b8c\u6210\u3057\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c9\u306f\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3067\u304d\u307e\u3059\u3010list5.6-h\u3011<\/a>\u3002<\/p>\n\n\n\n
5.6.5\u3000\u8996\u899a\u5316\u306e\u65b9\u6cd5\u3092\u5de5\u592b\u3057\u3066\u307f\u308b<\/h1>\n\n\n\n
\u540c\u3058\u30c7\u30fc\u30bf\u3092\u4f7f\u3063\u3066\u3044\u307e\u3059\u304c\u3001\u5186\u72b6\u306b\u30ec\u30a4\u30a2\u30a6\u30c8\u3057\u3066\u307f\u307e\u3057\u305f\u3002\u3053\u306e\u30b5\u30f3\u30d7\u30eb\u3067\u306f\u5e73\u5747\u98a8\u901f\u306e\u60c5\u5831\u3082\u4f7f\u3044\u3001\u6c17\u6e29\u306f\u8272\u3001\u98a8\u901f\u306f\u68d2\u306e\u9577\u3055\u306b\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n
\"7_11_15__16_00\"<\/figure>\n\n\n\n
\u56f35.6-r<\/div>\n\n\n\n
\u30ea\u30b9\u30c85.6-i<\/div>\n\n\n\n
\/\/\u6771\u4eac\u306e\u30012015\u5e74\u306b\u304a\u3051\u308b1\u65e5\u3054\u3068\u306e\u5e73\u5747\u6c17\u6e29\u5e73\u5747\u306e\u98a8\u901f\u3092\u8868\u3057\u305f\u68d2\u30b0\u30e9\u30d5\u3092\n\/\/\u5186\u72b6\u306b\u30ec\u30a4\u30a2\u30a6\u30c8\u3057\u305f\u3002\u5e73\u5747\u6c17\u6e29\u306f\u8272\u3001\u98a8\u901f\u306f\u68d2\u306e\u9577\u3055\u3067\u8868\u3057\u3066\u3044\u308b\n\nString[] date; \/\/\u65e5\u4ed8\nfloat[] temp;    \/\/\u6c17\u6e29\nfloat[] wind;  \/\/\u98a8\u901f\nfloat highTemp;  \/\/\u6700\u9ad8\u6c17\u6e29\nfloat lowTemp;  \/\/\u6700\u4f4e\u6c17\u6e29\nPFont myFont;    \/\/\u30d5\u30a9\u30f3\u30c8\u7528\u5909\u6570\nfloat x1, y1, x2, y2;  \/\/\u6708\u3054\u3068\u306e\u5206\u5272\u7528\u306e\u7dda\u3092\u63cf\u753b\u3059\u308b\u305f\u3081\u306e\u5909\u6570\nint month;\nXML xml;\n\nvoid setup() {\n  size(500, 500);\n  colorMode(HSB, 360, 100, 100);  \/\/\u8272\u5f69\u306e\u8868\u793a\u65b9\u6cd5\u3092HSB\u306b\u5909\u66f4\n  loadData();  \/\/xml\u30d5\u30a1\u30a4\u30eb\u304b\u3089\u30c7\u30fc\u30bf\u8aad\u307f\u8fbc\u307f\u3001\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u5316\n\n  \/\/\u4e00\u756a\u4f4e\u3044\u6c17\u6e29\u3068\u9ad8\u3044\u6c17\u6e29\u3092temp\u914d\u5217\u5185\u3067\u691c\u7d22\u3057\u3001lowTemp\u3001highTemp\u306b\u5165\u308c\u308b\n  lowTemp = min(temp);\n  highTemp = max(temp);\n\n  myFont = createFont(\"Arial\", 12);    \/\/\u30d5\u30a9\u30f3\u30c8\u4f5c\u6210\n  textFont(myFont, 14);  \/\/\u30c6\u30ad\u30b9\u30c8\u306e\u30b5\u30a4\u30ba\u3092\u8a2d\u5b9a\n  textAlign(CENTER);\n}\n\nvoid draw() {\n  background(0, 0, 100);  \/\/\u80cc\u666f\u306f\u767d\n\n  stroke(0, 0, 80);\n  fill(0, 0, 100);\n  ellipse(width\/2, height\/2, 480, 480);  \/\/\u5916\u5074\u306e\u5186\n\n  \/\/\u6708\u3054\u3068\u306e\u5206\u5272\u7dda\u3092\u63cf\u753b\u30021\u30f6\u6708\u3054\u3068\u306b\u30b0\u30ec\u30fc\u306e\u7dda\u3092\u63cf\u3044\u3066\u3044\u304f\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\n  \/\/\u6587\u5b57\u3092\u8868\u793a\u3059\u308b\u3068\u304d\u306brotate\u3092\u4f7f\u3046\u3068\u3001\u6587\u5b57\u3082\u56de\u8ee2\u3057\u3066\u3057\u307e\u3046\u306e\u3067\u3001\n  \/\/\u3053\u3053\u3067\u306fsin, cos\u3092\u4f7f\u3063\u3066\u3044\u308b\u3002\n\n  for (int i = 0; i < 12; i ++) {\n\n    x1 = 50*cos(radians(i*30));  \/\/30\u5ea6\u3054\u3068\u306e\u30b0\u30ec\u30fc\u306e\u7dda\u306e\u5185\u5074\u306e\u70b9\u3092\u6c42\u3081\u308b\n    y1 = 50*sin(radians(i*30));\n\n    x2 = 240*cos(radians(i*30));  \/\/30\u5ea6\u3054\u3068\u306e\u30b0\u30ec\u30fc\u306e\u7dda\u306e\u5916\u5074\u306e\u70b9\u3092\u6c42\u3081\u308b\n    y2 = 240*sin(radians(i*30));\n\n    \/\/\u7dda\u3092\u63cf\u753b\n    line(width\/2 + x1, height\/2 + y1, width\/2 + x2, height\/2 + y2);\n\n    \/\/\u6708\u3092\u30c6\u30ad\u30b9\u30c8\u3067\u66f8\u304f\u3002\u4e00\u756a\u4e0a\u304b\u3089\u6642\u8a08\u56de\u308a\u3067\u59cb\u3081\u308b\u305f\u3081\u300190\u5ea6\u5f15\u304f\u3002\n    \/\/\u3055\u3089\u306b\u300115\u5ea6\u79fb\u52d5\u3059\u308c\u3070\u3001\u30b0\u30ec\u30fc\u306e\u7dda\u306e\u9593\u306b\u8868\u793a\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\n    x1 = 200*cos(radians(i*30 + 15 - 90));\n    y1 = 200*sin(radians(i*30 + 15 - 90));\n\n    month = i + 1;  \/\/\u6708\u306f\u3001i + 1\u30671\u6708\u304b\u3089\u59cb\u307e\u308b\n    fill(0, 0, 50);\n    text(month + \"\u6708\", width\/2 + x1, height\/2 + y1);  \/\/\u6708\u3092\u63cf\u753b\n  } \n\n  \/\/\u6c17\u6e29\u3068\u98a8\u901f\u3092\u63cf\u753b\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\n\n  \/\/365\u65e5\u5206\u306e1\u65e5\u306f\u3001\u89d2\u5ea6\u306b\u3059\u308b\u3068360\u5ea6\u5206\u306e\u4f55\u5ea6\u306b\u306a\u308b\u304b\u3092\u8a08\u7b97 = 0.986.....\n  float angle = 360.0\/365.0;\n\n  \/\/1\u65e5\u3054\u3068\u306b\u63cf\u753b\n  for (int i = 0; i < temp.length; i ++) {\n\n    pushMatrix();\n    translate(width\/2, height\/2);  \/\/\u753b\u9762\u4e2d\u592e\u306b\u5ea7\u6a19\u7cfb\u3092\u79fb\u52d5\n    rotate(radians(i*angle));  \/\/1\u65e5\u5206\u305a\u3064\u5ea7\u6a19\u7cfb\u3092\u56de\u8ee2\n\n    stroke(createColor(temp[i], lowTemp, highTemp), 100, 100);\n    line(0, -50, 0, -50 - wind[i]*28);  \/\/\u7dda\u3092\u63cf\u753b\n    popMatrix();\n  }\n}\n\nvoid loadData() {\n\n  xml = loadXML(\"weather_day.xml\");  \/\/\u30d5\u30a1\u30a4\u30eb\u306e\u8aad\u307f\u8fbc\u307f\n\n  \/\/weather\u30bf\u30b0\u5185\u306e\u8981\u7d20\u3092\u53d6\u5f97\n  XML[] children = xml.getChildren(\"weather\");\n\n  \/\/\u8981\u7d20\u6570\u3092\u53d6\u5f97\u3057\u3066\u914d\u5217\u3092\u751f\u6210\n  date = new String[children.length];\n  temp = new float[children.length];\n  wind = new float[children.length];\n\n  \/\/\u914d\u5217\u306b\u5024\u3092\u5165\u308c\u308b\n  for (int i = 0; i < temp.length; i++) {\n\n    \/\/\u6708\n    XML dateXml = children[i].getChild(\"date\");\n    date[i] = dateXml.getContent();\n\n    \/\/\u6c17\u6e29\n    XML tempXml = children[i].getChild(\"temp\");\n    temp[i] = tempXml.getFloatContent();\n\n    \/\/\u98a8\u901f\n    XML windXml = children[i].getChild(\"wind\");\n    wind[i] = windXml.getFloatContent();\n  }\n}\n\n\/\/\u6c17\u6e29\u304b\u3089\u8272\u3092\u6c7a\u5b9a\nfloat createColor(float _temp, float _lowTemp, float _highTemp) {\n\n  \/\/\u6700\u4f4e\u6c17\u6e29\u304b\u3089\u6700\u9ad8\u6c17\u6e29\u306e\u7bc4\u56f2\u3092\u3001\u8272\u76f8\u306e200\u00b0\u304b\u30890\u00b0\u306b\u5909\u63db\n  \/\/\u6c17\u6e29\u3092\u8272\u306b\u5909\u63db\n  float barColor = map(_temp, _lowTemp, _highTemp, 200, 0);\n\n  return barColor;\n}<\/code><\/pre>\n\n\n\n
5.6.6\u3000JSON\u306e\u5229\u7528<\/h1>\n\n\n\n
JSON\u306e\u5834\u5408\u306f\u3001loadData\u5185\u306e\u30b3\u30fc\u30c9\u304c\u5909\u308f\u308a\u307e\u3059\u304c\u3001\u57fa\u672c\u7684\u306a\u8003\u3048\u65b9\u306f\u540c\u3058\u3067\u3059\u3002\u6b21\u306e\u30b3\u30fc\u30c9\u306f\u3001date, temp\u306e\u5024\u3092\u305d\u308c\u305e\u308c\u8aad\u307f\u8fbc\u3093\u3067\u3044\u307e\u3059\u3002\u3053\u3053\u3067\u306f\u3001\u300cweather_day.json\u300d\u30d5\u30a1\u30a4\u30eb\u3092\u4f7f\u3044\u307e\u3059\u3002
CSV\u304b\u3089JSON\u3078\u306e\u5909\u63db\u306f\u6b21\u306e\u30b5\u30a4\u30c8\u3067\u304a\u3053\u306a\u3044\u307e\u3057\u305f\u3002
http:\/\/utils.ipentec.com\/JsonConvert\/CsvToJSon.aspx<\/a><\/p>\n\n\n\n
void loadData() {\n  \/\/\u30d5\u30a1\u30a4\u30eb\u3092\u30ed\u30fc\u30c9\u3057\u3066\u914d\u5217\u3092\u4f5c\u308b\n  JSONArray weatherData = loadJSONArray(\"weather_day.json\");\n\n  \/\/\u8981\u7d20\u6570\u3092\u53d6\u5f97\u3057\u3066\u914d\u5217\u3092\u751f\u6210\n  date = new String[weatherData.size()];\n  temp = new float[weatherData.size()];\n\n  for (int i = 0; i < weatherData.size(); i++) {\n\n    \/\/\u4e00\u3064\u4e00\u3064\u306eJSON\u914d\u5217\u306e\u4e2d\u3092\u691c\u7d22\n    JSONObject weather = weatherData.getJSONObject(i); \n    \n    \/\/date, temp, wind\u914d\u5217\u306b\u4e00\u3064\u305a\u3064\u5165\u308c\u308b\n    date[i] = weather.getString(\"date\");\n    temp[i] = weather.getFloat(\"temp\");\n  }\n}<\/code><\/pre>\n\n\n\n
XML\u3092\u4f7f\u7528\u3057\u3066\u3044\u308b\u3010list5_6_h\u3011\u3092\u3001JSON\u3092\u4f7f\u3063\u3066\u66f8\u304d\u63db\u3048\u3066\u307f\u307e\u3057\u305f\u3002
\u5b8c\u6210\u3057\u305f\u30b5\u30f3\u30d7\u30eb\u30b3\u30fc\u30c9\u306f\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3067\u304d\u307e\u3059\u3010list5.6-j\u3011<\/a>\u3002<\/p>\n\n\n\n
5.6.7\u3000\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u6307\u5411\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u306b\u3088\u308b\u8a18\u8ff0<\/h1>\n\n\n\n
\u3053\u306e\u3088\u3046\u306a\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u30b0\u30e9\u30d5\u30a3\u30c3\u30af\u30b9\u3092\u4f5c\u6210\u3059\u308b\u969b\u306b\u306f\u3001\u30aa\u30d6\u30b8\u30a7\u30af\u30c8\u6307\u5411\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u306e\u8a18\u8ff0\u306e\u65b9\u304c\u5408\u7406\u7684\u306a\u5834\u5408\u304c\u3042\u308a\u307e\u3059\u3002\u4f8b\u3048\u3070\u30011\u65e5\u306e\u6c17\u6e29\u3092\u3072\u3068\u3064\u306e\u5358\u4f4d\u3068\u3057\u3066\u30af\u30e9\u30b9\u5316\u3057\u3001\u5fc5\u8981\u306a\u6570\u3060\u3051\u30a4\u30f3\u30b9\u30bf\u30f3\u30b9\u5316\u3059\u308b\u30681\u5e74\u3067\u308210\u5e74\u3067\u3082\u7c21\u5358\u306b\u8996\u899a\u5316\u3067\u304d\u307e\u3059\u3002\u3053\u3053\u3067\u306f\u8a73\u7d30\u306b\u3064\u3044\u3066\u306f\u8ff0\u3079\u307e\u305b\u3093\u304c\u3001\u8208\u5473\u304c\u3042\u308b\u4eba\u306f\u30b5\u30f3\u30d7\u30eb\u3092\u53c2\u8003\u306b\u3057\u3066\u307f\u3066\u304f\u3060\u3055\u3044\u3002<\/p>\n\n\n\n
XML\u30d5\u30a1\u30a4\u30eb\u4f7f\u7528\u3010list5.6-k\u3011<\/a>
JSON\u30d5\u30a1\u30a4\u30eb\u4f7f\u7528\u3010list5.6-l\u3011<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
\u30d7\u30ed\u30b0\u30e9\u30df\u30f3\u30b0\u3068\u30c7\u30b6\u30a4\u30f3\u306e\u5f79\u5272\u306e\u4e00\u3064\u306b\u300c\u30c7\u30fc\u30bf\u306e\u8996\u899a\u5316\u300d\u304c\u3042… Read more »<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10,26],"tags":[],"class_list":["post-5557","post","type-post","status-publish","format-standard","hentry","category-processing","category-ii"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/posts\/5557","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/comments?post=5557"}],"version-history":[{"count":80,"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/posts\/5557\/revisions"}],"predecessor-version":[{"id":10531,"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/posts\/5557\/revisions\/10531"}],"wp:attachment":[{"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/media?parent=5557"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/categories?post=5557"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/r-dimension.xsrv.jp\/classes_j\/wp-json\/wp\/v2\/tags?post=5557"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}