├── .gitignore ├── LICENSE ├── README.md ├── index.html ├── package-lock.json ├── package.json ├── public ├── _redirects └── data │ ├── chs-capacity.json │ ├── covid19-tweets.json │ ├── iris.json │ ├── judgit-departments.json │ ├── lesson01-output.json │ ├── lesson03-output.json │ ├── lesson04-otput.json │ ├── lesson05-otput.json │ ├── lesson06-output.json │ ├── lesson07-output.json │ ├── lesson08-output.json │ ├── lesson09-output.json │ ├── qiita-articles.json │ ├── qiita-tags.json │ ├── size-and-weight.json │ └── topic-graph.json ├── src ├── App.jsx ├── components │ ├── AnswerPage.jsx │ ├── Chart01.jsx │ ├── Chart02.jsx │ ├── Chart03.jsx │ ├── Chart04.jsx │ ├── Chart05.jsx │ ├── Chart06.jsx │ ├── Chart07.jsx │ ├── Chart08.jsx │ ├── Chart09.jsx │ ├── Chart10.jsx │ ├── LessonPage.jsx │ └── Markdown.jsx ├── main.jsx └── pages │ ├── Answer01 │ ├── answer.md │ └── index.jsx │ ├── Answer02 │ ├── answer.md │ └── index.jsx │ ├── Answer03 │ ├── answer.md │ └── index.jsx │ ├── Answer04 │ ├── answer.md │ └── index.jsx │ ├── Answer05 │ ├── answer.md │ └── index.jsx │ ├── Answer06 │ ├── answer.md │ └── index.jsx │ ├── Answer07 │ ├── answer.md │ └── index.jsx │ ├── Answer08 │ ├── answer.md │ └── index.jsx │ ├── Answer09 │ ├── answer.md │ └── index.jsx │ ├── Answer10 │ ├── answer.md │ └── index.jsx │ ├── Home │ └── index.jsx │ ├── Lesson01 │ ├── index.jsx │ └── instruction.md │ ├── Lesson02 │ ├── index.jsx │ └── instruction.md │ ├── Lesson03 │ ├── index.jsx │ └── instruction.md │ ├── Lesson04 │ ├── index.jsx │ └── instruction.md │ ├── Lesson05 │ ├── index.jsx │ └── instruction.md │ ├── Lesson06 │ ├── index.jsx │ └── instruction.md │ ├── Lesson07 │ ├── index.jsx │ └── instruction.md │ ├── Lesson08 │ ├── index.jsx │ └── instruction.md │ ├── Lesson09 │ ├── index.jsx │ └── instruction.md │ └── Lesson10 │ ├── index.jsx │ └── instruction.md └── vite.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | 9 | # Diagnostic reports (https://nodejs.org/api/report.html) 10 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 11 | 12 | # Runtime data 13 | pids 14 | *.pid 15 | *.seed 16 | *.pid.lock 17 | 18 | # Directory for instrumented libs generated by jscoverage/JSCover 19 | lib-cov 20 | 21 | # Coverage directory used by tools like istanbul 22 | coverage 23 | *.lcov 24 | 25 | # nyc test coverage 26 | .nyc_output 27 | 28 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 29 | .grunt 30 | 31 | # Bower dependency directory (https://bower.io/) 32 | bower_components 33 | 34 | # node-waf configuration 35 | .lock-wscript 36 | 37 | # Compiled binary addons (https://nodejs.org/api/addons.html) 38 | build/Release 39 | 40 | # Dependency directories 41 | node_modules/ 42 | jspm_packages/ 43 | 44 | # TypeScript v1 declaration files 45 | typings/ 46 | 47 | # TypeScript cache 48 | *.tsbuildinfo 49 | 50 | # Optional npm cache directory 51 | .npm 52 | 53 | # Optional eslint cache 54 | .eslintcache 55 | 56 | # Microbundle cache 57 | .rpt2_cache/ 58 | .rts2_cache_cjs/ 59 | .rts2_cache_es/ 60 | .rts2_cache_umd/ 61 | 62 | # Optional REPL history 63 | .node_repl_history 64 | 65 | # Output of 'npm pack' 66 | *.tgz 67 | 68 | # Yarn Integrity file 69 | .yarn-integrity 70 | 71 | # dotenv environment variables file 72 | .env 73 | .env.test 74 | 75 | # parcel-bundler cache (https://parceljs.org/) 76 | .cache 77 | 78 | # Next.js build output 79 | .next 80 | 81 | # Nuxt.js build / generate output 82 | .nuxt 83 | dist 84 | 85 | # Gatsby files 86 | .cache/ 87 | # Comment in the public line in if your project uses Gatsby and *not* Next.js 88 | # https://nextjs.org/blog/next-9-1#public-directory-support 89 | # public 90 | 91 | # vuepress build output 92 | .vuepress/dist 93 | 94 | # Serverless directories 95 | .serverless/ 96 | 97 | # FuseBox cache 98 | .fusebox/ 99 | 100 | # DynamoDB Local files 101 | .dynamodb/ 102 | 103 | # TernJS port file 104 | .tern-port 105 | 106 | build 107 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 likr-boilerplate 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # js-training 2 | 3 | 日本大学文理学部情報科学科尾上ゼミの JavaScript 演習資料です。 4 | 情報可視化に必要なデータ変換の演習を通じて、JavaScript 力を付けましょう。 5 | 6 | この資料では、JavaScript 自体の説明はしていないので、以下のサイトなどで学修しながら演習を進めて下さい。 7 | 8 | - [JavaScript Primer](https://jsprimer.net/) 9 | 10 | ## 開発環境を準備しよう 11 | 12 | はじめに、必要なソフトウェアをインストールしましょう。 13 | インストール済みの人は飛ばしてください。 14 | 15 | - [Node.js (LTS 版)](https://nodejs.org/) 16 | - Git 17 | - モダン Web ブラウザ 18 | - [Google Chrome](https://www.google.com/chrome/)を推奨します 19 | - [Visual Studio Code](https://azure.microsoft.com/products/visual-studio-code/) 20 | - 他に好みの IDE やエディタがあればそちらを使用して下さい。 21 | - Chrome OS で演習を行う場合は [Visual Studio Online](https://visualstudio.microsoft.com/services/visual-studio-online/) などが利用できます。 22 | 23 | ## リポジトリをクローンしよう 24 | 25 | [GitHub](https://github.com/) のアカウントを持っていない人は、はじめにアカウントを作成しましょう。 26 | 詳しくは以下のページを読んでください。 27 | 28 | - [GitHub へのサインアップ](https://docs.github.com/ja/get-started/signing-up-for-github/signing-up-for-a-new-github-account) 29 | 30 | [このリポジトリ](https://github.com/likr/js-training) をフォークしましょう。 31 | フォークの詳細は以下のページを読んでください。 32 | 33 | - [リポジトリをフォークする](https://docs.github.com/ja/get-started/quickstart/fork-a-repo) 34 | 35 | 次に、GitHub から手元の作業環境にクローンします。 36 | Visual Studio Code からリポジトリのクローンを行えます。 37 | 詳細な操作は以下のページを読んでください。 38 | 39 | - [Using Version Control in VS Code](https://code.visualstudio.com/docs/editor/versioncontrol#_git-support) 40 | 41 | git コマンドや GitHub デスクトップ等のアプリの方を使い慣れていれば好みの方法でも構いません。 42 | 43 | ## 開発サーバーを動かそう 44 | 45 | Visual Studio Code のターミナルから、リポジトリのディレクトリで以下のコマンドを実行し、パッケージのインストールを行います。 46 | 47 | ```shell-session 48 | npm ci 49 | ``` 50 | 51 | 次に、以下のコマンドで開発サーバーを起動します。 52 | 53 | ```shell-session 54 | npm run dev 55 | ``` 56 | 57 | 正常に開発サーバーが起動すると、Web ブラウザでページが開かれます。 58 | 59 | `npm ci` の実行はリポジトリをクローンした直後の一回だけで大丈夫です。 60 | ですが、もしリポジトリの更新を取り込んだ後にアプリが動かなくなった場合などは、再度 `npm ci` を実行してみて下さい。 61 | 62 | ## 演習を始めよう 63 | 64 | 立ち上がった Web ページ上の指示を読みながら演習を進めましょう。 65 | 66 | それぞれのページで指示されたソースコードを Visual Studio Code で開いてプログラムの開発をして下さい。 67 | 「表示例を見る」リンクから、正しい実行結果を確認できます。 68 | ソースコードを保存すると、自動的に Web ページが更新されます。 69 | 正しい実行結果と一致するようにプログラムを開発しましょう。 70 | 71 | もし、プログラムを書いていて Web サイトが動かなくなったら、以下のリンクからも同じ内容の Web サイトが見られます。 72 | 73 | - [js-training](https://js-training.vdslab.jp) 74 | 75 | 画面やターミナルに表示されているエラーも読みながら、落ち着いてプログラムを修正しましょう。 76 | 77 | ## わからなくなったら 78 | 79 | どうしてもプログラムの書き方がわからなければ、表示例のページで「解答例を表示」にチェックを入れると解答例と説明が表示されます。 80 | 自分のプログラムと見比べて、わからなかったところは復習しておきましょう。 81 | 82 | 自分でプログラムが書けた人も一度解答例を見て、知らないことがないか確認しておくと良いでしょう。 83 | 84 | ## 演習が解けたら 85 | 86 | 1 問演習が解けるごとにリポジトリの更新をコミットして、GitHub にプッシュすると良いでしょう。 87 | 学修の記録にもなります。 88 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | js-training 7 | 8 | 9 |
10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "js-training", 3 | "version": "1.0.0", 4 | "description": "", 5 | "type": "module", 6 | "scripts": { 7 | "build": "vite build", 8 | "dev": "vite" 9 | }, 10 | "repository": { 11 | "type": "git", 12 | "url": "git+https://github.com/likr/js-training.git" 13 | }, 14 | "author": "", 15 | "license": "MIT", 16 | "bugs": { 17 | "url": "https://github.com/likr/js-training/issues" 18 | }, 19 | "devDependencies": { 20 | "@vitejs/plugin-react": "^4.4.1", 21 | "prettier": "^3.5.3", 22 | "vite": "^6.3.3" 23 | }, 24 | "dependencies": { 25 | "@ionic/react": "^8.5.5", 26 | "@ionic/react-router": "^8.5.5", 27 | "@nivo/bar": "^0.91.0", 28 | "@nivo/line": "^0.91.0", 29 | "@nivo/network": "^0.91.0", 30 | "@nivo/parallel-coordinates": "^0.91.0", 31 | "@nivo/scatterplot": "^0.91.0", 32 | "@nivo/sunburst": "^0.91.0", 33 | "highlight.js": "^11.11.1", 34 | "markdown-it": "^14.1.0", 35 | "react": "^18.3.1", 36 | "react-dom": "^18.3.1" 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /public/_redirects: -------------------------------------------------------------------------------- 1 | /* /index.html 200 2 | https://vdslab-js-training.netlify.com/* https://js-training.vdslab.jp/:splat 301! 3 | -------------------------------------------------------------------------------- /public/data/chs-capacity.json: -------------------------------------------------------------------------------- 1 | [ 2 | ["哲学科", 88], 3 | ["史学科", 133], 4 | ["国文学科", 133], 5 | ["中国語中国文化学科", 70], 6 | ["英文学科", 133], 7 | ["ドイツ文学科", 80], 8 | ["社会学科", 210], 9 | ["社会福祉学科", 60], 10 | ["教育学科", 120], 11 | ["体育学科", 200], 12 | ["心理学科", 130], 13 | ["地理学科", 80], 14 | ["地球科学科", 80], 15 | ["数学科", 73], 16 | ["情報科学科", 80], 17 | ["物理学科", 70], 18 | ["生命科学科", 70], 19 | ["化学科", 90] 20 | ] 21 | -------------------------------------------------------------------------------- /public/data/iris.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "sepalLength": 5.1, 4 | "sepalWidth": 3.5, 5 | "petalLength": 1.4, 6 | "petalWidth": 0.2, 7 | "species": "setosa" 8 | }, 9 | { 10 | "sepalLength": 4.9, 11 | "sepalWidth": 3.0, 12 | "petalLength": 1.4, 13 | "petalWidth": 0.2, 14 | "species": "setosa" 15 | }, 16 | { 17 | "sepalLength": 4.7, 18 | "sepalWidth": 3.2, 19 | "petalLength": 1.3, 20 | "petalWidth": 0.2, 21 | "species": "setosa" 22 | }, 23 | { 24 | "sepalLength": 4.6, 25 | "sepalWidth": 3.1, 26 | "petalLength": 1.5, 27 | "petalWidth": 0.2, 28 | "species": "setosa" 29 | }, 30 | { 31 | "sepalLength": 5.0, 32 | "sepalWidth": 3.6, 33 | "petalLength": 1.4, 34 | "petalWidth": 0.2, 35 | "species": "setosa" 36 | }, 37 | { 38 | "sepalLength": 5.4, 39 | "sepalWidth": 3.9, 40 | "petalLength": 1.7, 41 | "petalWidth": 0.4, 42 | "species": "setosa" 43 | }, 44 | { 45 | "sepalLength": 4.6, 46 | "sepalWidth": 3.4, 47 | "petalLength": 1.4, 48 | "petalWidth": 0.3, 49 | "species": "setosa" 50 | }, 51 | { 52 | "sepalLength": 5.0, 53 | "sepalWidth": 3.4, 54 | "petalLength": 1.5, 55 | "petalWidth": 0.2, 56 | "species": "setosa" 57 | }, 58 | { 59 | "sepalLength": 4.4, 60 | "sepalWidth": 2.9, 61 | "petalLength": 1.4, 62 | "petalWidth": 0.2, 63 | "species": "setosa" 64 | }, 65 | { 66 | "sepalLength": 4.9, 67 | "sepalWidth": 3.1, 68 | "petalLength": 1.5, 69 | "petalWidth": 0.1, 70 | "species": "setosa" 71 | }, 72 | { 73 | "sepalLength": 5.4, 74 | "sepalWidth": 3.7, 75 | "petalLength": 1.5, 76 | "petalWidth": 0.2, 77 | "species": "setosa" 78 | }, 79 | { 80 | "sepalLength": 4.8, 81 | "sepalWidth": 3.4, 82 | "petalLength": 1.6, 83 | "petalWidth": 0.2, 84 | "species": "setosa" 85 | }, 86 | { 87 | "sepalLength": 4.8, 88 | "sepalWidth": 3.0, 89 | "petalLength": 1.4, 90 | "petalWidth": 0.1, 91 | "species": "setosa" 92 | }, 93 | { 94 | "sepalLength": 4.3, 95 | "sepalWidth": 3.0, 96 | "petalLength": 1.1, 97 | "petalWidth": 0.1, 98 | "species": "setosa" 99 | }, 100 | { 101 | "sepalLength": 5.8, 102 | "sepalWidth": 4.0, 103 | "petalLength": 1.2, 104 | "petalWidth": 0.2, 105 | "species": "setosa" 106 | }, 107 | { 108 | "sepalLength": 5.7, 109 | "sepalWidth": 4.4, 110 | "petalLength": 1.5, 111 | "petalWidth": 0.4, 112 | "species": "setosa" 113 | }, 114 | { 115 | "sepalLength": 5.4, 116 | "sepalWidth": 3.9, 117 | "petalLength": 1.3, 118 | "petalWidth": 0.4, 119 | "species": "setosa" 120 | }, 121 | { 122 | "sepalLength": 5.1, 123 | "sepalWidth": 3.5, 124 | "petalLength": 1.4, 125 | "petalWidth": 0.3, 126 | "species": "setosa" 127 | }, 128 | { 129 | "sepalLength": 5.7, 130 | "sepalWidth": 3.8, 131 | "petalLength": 1.7, 132 | "petalWidth": 0.3, 133 | "species": "setosa" 134 | }, 135 | { 136 | "sepalLength": 5.1, 137 | "sepalWidth": 3.8, 138 | "petalLength": 1.5, 139 | "petalWidth": 0.3, 140 | "species": "setosa" 141 | }, 142 | { 143 | "sepalLength": 5.4, 144 | "sepalWidth": 3.4, 145 | "petalLength": 1.7, 146 | "petalWidth": 0.2, 147 | "species": "setosa" 148 | }, 149 | { 150 | "sepalLength": 5.1, 151 | "sepalWidth": 3.7, 152 | "petalLength": 1.5, 153 | "petalWidth": 0.4, 154 | "species": "setosa" 155 | }, 156 | { 157 | "sepalLength": 4.6, 158 | "sepalWidth": 3.6, 159 | "petalLength": 1.0, 160 | "petalWidth": 0.2, 161 | "species": "setosa" 162 | }, 163 | { 164 | "sepalLength": 5.1, 165 | "sepalWidth": 3.3, 166 | "petalLength": 1.7, 167 | "petalWidth": 0.5, 168 | "species": "setosa" 169 | }, 170 | { 171 | "sepalLength": 4.8, 172 | "sepalWidth": 3.4, 173 | "petalLength": 1.9, 174 | "petalWidth": 0.2, 175 | "species": "setosa" 176 | }, 177 | { 178 | "sepalLength": 5.0, 179 | "sepalWidth": 3.0, 180 | "petalLength": 1.6, 181 | "petalWidth": 0.2, 182 | "species": "setosa" 183 | }, 184 | { 185 | "sepalLength": 5.0, 186 | "sepalWidth": 3.4, 187 | "petalLength": 1.6, 188 | "petalWidth": 0.4, 189 | "species": "setosa" 190 | }, 191 | { 192 | "sepalLength": 5.2, 193 | "sepalWidth": 3.5, 194 | "petalLength": 1.5, 195 | "petalWidth": 0.2, 196 | "species": "setosa" 197 | }, 198 | { 199 | "sepalLength": 5.2, 200 | "sepalWidth": 3.4, 201 | "petalLength": 1.4, 202 | "petalWidth": 0.2, 203 | "species": "setosa" 204 | }, 205 | { 206 | "sepalLength": 4.7, 207 | "sepalWidth": 3.2, 208 | "petalLength": 1.6, 209 | "petalWidth": 0.2, 210 | "species": "setosa" 211 | }, 212 | { 213 | "sepalLength": 4.8, 214 | "sepalWidth": 3.1, 215 | "petalLength": 1.6, 216 | "petalWidth": 0.2, 217 | "species": "setosa" 218 | }, 219 | { 220 | "sepalLength": 5.4, 221 | "sepalWidth": 3.4, 222 | "petalLength": 1.5, 223 | "petalWidth": 0.4, 224 | "species": "setosa" 225 | }, 226 | { 227 | "sepalLength": 5.2, 228 | "sepalWidth": 4.1, 229 | "petalLength": 1.5, 230 | "petalWidth": 0.1, 231 | "species": "setosa" 232 | }, 233 | { 234 | "sepalLength": 5.5, 235 | "sepalWidth": 4.2, 236 | "petalLength": 1.4, 237 | "petalWidth": 0.2, 238 | "species": "setosa" 239 | }, 240 | { 241 | "sepalLength": 4.9, 242 | "sepalWidth": 3.1, 243 | "petalLength": 1.5, 244 | "petalWidth": 0.1, 245 | "species": "setosa" 246 | }, 247 | { 248 | "sepalLength": 5.0, 249 | "sepalWidth": 3.2, 250 | "petalLength": 1.2, 251 | "petalWidth": 0.2, 252 | "species": "setosa" 253 | }, 254 | { 255 | "sepalLength": 5.5, 256 | "sepalWidth": 3.5, 257 | "petalLength": 1.3, 258 | "petalWidth": 0.2, 259 | "species": "setosa" 260 | }, 261 | { 262 | "sepalLength": 4.9, 263 | "sepalWidth": 3.1, 264 | "petalLength": 1.5, 265 | "petalWidth": 0.1, 266 | "species": "setosa" 267 | }, 268 | { 269 | "sepalLength": 4.4, 270 | "sepalWidth": 3.0, 271 | "petalLength": 1.3, 272 | "petalWidth": 0.2, 273 | "species": "setosa" 274 | }, 275 | { 276 | "sepalLength": 5.1, 277 | "sepalWidth": 3.4, 278 | "petalLength": 1.5, 279 | "petalWidth": 0.2, 280 | "species": "setosa" 281 | }, 282 | { 283 | "sepalLength": 5.0, 284 | "sepalWidth": 3.5, 285 | "petalLength": 1.3, 286 | "petalWidth": 0.3, 287 | "species": "setosa" 288 | }, 289 | { 290 | "sepalLength": 4.5, 291 | "sepalWidth": 2.3, 292 | "petalLength": 1.3, 293 | "petalWidth": 0.3, 294 | "species": "setosa" 295 | }, 296 | { 297 | "sepalLength": 4.4, 298 | "sepalWidth": 3.2, 299 | "petalLength": 1.3, 300 | "petalWidth": 0.2, 301 | "species": "setosa" 302 | }, 303 | { 304 | "sepalLength": 5.0, 305 | "sepalWidth": 3.5, 306 | "petalLength": 1.6, 307 | "petalWidth": 0.6, 308 | "species": "setosa" 309 | }, 310 | { 311 | "sepalLength": 5.1, 312 | "sepalWidth": 3.8, 313 | "petalLength": 1.9, 314 | "petalWidth": 0.4, 315 | "species": "setosa" 316 | }, 317 | { 318 | "sepalLength": 4.8, 319 | "sepalWidth": 3.0, 320 | "petalLength": 1.4, 321 | "petalWidth": 0.3, 322 | "species": "setosa" 323 | }, 324 | { 325 | "sepalLength": 5.1, 326 | "sepalWidth": 3.8, 327 | "petalLength": 1.6, 328 | "petalWidth": 0.2, 329 | "species": "setosa" 330 | }, 331 | { 332 | "sepalLength": 4.6, 333 | "sepalWidth": 3.2, 334 | "petalLength": 1.4, 335 | "petalWidth": 0.2, 336 | "species": "setosa" 337 | }, 338 | { 339 | "sepalLength": 5.3, 340 | "sepalWidth": 3.7, 341 | "petalLength": 1.5, 342 | "petalWidth": 0.2, 343 | "species": "setosa" 344 | }, 345 | { 346 | "sepalLength": 5.0, 347 | "sepalWidth": 3.3, 348 | "petalLength": 1.4, 349 | "petalWidth": 0.2, 350 | "species": "setosa" 351 | }, 352 | { 353 | "sepalLength": 7.0, 354 | "sepalWidth": 3.2, 355 | "petalLength": 4.7, 356 | "petalWidth": 1.4, 357 | "species": "versicolor" 358 | }, 359 | { 360 | "sepalLength": 6.4, 361 | "sepalWidth": 3.2, 362 | "petalLength": 4.5, 363 | "petalWidth": 1.5, 364 | "species": "versicolor" 365 | }, 366 | { 367 | "sepalLength": 6.9, 368 | "sepalWidth": 3.1, 369 | "petalLength": 4.9, 370 | "petalWidth": 1.5, 371 | "species": "versicolor" 372 | }, 373 | { 374 | "sepalLength": 5.5, 375 | "sepalWidth": 2.3, 376 | "petalLength": 4.0, 377 | "petalWidth": 1.3, 378 | "species": "versicolor" 379 | }, 380 | { 381 | "sepalLength": 6.5, 382 | "sepalWidth": 2.8, 383 | "petalLength": 4.6, 384 | "petalWidth": 1.5, 385 | "species": "versicolor" 386 | }, 387 | { 388 | "sepalLength": 5.7, 389 | "sepalWidth": 2.8, 390 | "petalLength": 4.5, 391 | "petalWidth": 1.3, 392 | "species": "versicolor" 393 | }, 394 | { 395 | "sepalLength": 6.3, 396 | "sepalWidth": 3.3, 397 | "petalLength": 4.7, 398 | "petalWidth": 1.6, 399 | "species": "versicolor" 400 | }, 401 | { 402 | "sepalLength": 4.9, 403 | "sepalWidth": 2.4, 404 | "petalLength": 3.3, 405 | "petalWidth": 1.0, 406 | "species": "versicolor" 407 | }, 408 | { 409 | "sepalLength": 6.6, 410 | "sepalWidth": 2.9, 411 | "petalLength": 4.6, 412 | "petalWidth": 1.3, 413 | "species": "versicolor" 414 | }, 415 | { 416 | "sepalLength": 5.2, 417 | "sepalWidth": 2.7, 418 | "petalLength": 3.9, 419 | "petalWidth": 1.4, 420 | "species": "versicolor" 421 | }, 422 | { 423 | "sepalLength": 5.0, 424 | "sepalWidth": 2.0, 425 | "petalLength": 3.5, 426 | "petalWidth": 1.0, 427 | "species": "versicolor" 428 | }, 429 | { 430 | "sepalLength": 5.9, 431 | "sepalWidth": 3.0, 432 | "petalLength": 4.2, 433 | "petalWidth": 1.5, 434 | "species": "versicolor" 435 | }, 436 | { 437 | "sepalLength": 6.0, 438 | "sepalWidth": 2.2, 439 | "petalLength": 4.0, 440 | "petalWidth": 1.0, 441 | "species": "versicolor" 442 | }, 443 | { 444 | "sepalLength": 6.1, 445 | "sepalWidth": 2.9, 446 | "petalLength": 4.7, 447 | "petalWidth": 1.4, 448 | "species": "versicolor" 449 | }, 450 | { 451 | "sepalLength": 5.6, 452 | "sepalWidth": 2.9, 453 | "petalLength": 3.6, 454 | "petalWidth": 1.3, 455 | "species": "versicolor" 456 | }, 457 | { 458 | "sepalLength": 6.7, 459 | "sepalWidth": 3.1, 460 | "petalLength": 4.4, 461 | "petalWidth": 1.4, 462 | "species": "versicolor" 463 | }, 464 | { 465 | "sepalLength": 5.6, 466 | "sepalWidth": 3.0, 467 | "petalLength": 4.5, 468 | "petalWidth": 1.5, 469 | "species": "versicolor" 470 | }, 471 | { 472 | "sepalLength": 5.8, 473 | "sepalWidth": 2.7, 474 | "petalLength": 4.1, 475 | "petalWidth": 1.0, 476 | "species": "versicolor" 477 | }, 478 | { 479 | "sepalLength": 6.2, 480 | "sepalWidth": 2.2, 481 | "petalLength": 4.5, 482 | "petalWidth": 1.5, 483 | "species": "versicolor" 484 | }, 485 | { 486 | "sepalLength": 5.6, 487 | "sepalWidth": 2.5, 488 | "petalLength": 3.9, 489 | "petalWidth": 1.1, 490 | "species": "versicolor" 491 | }, 492 | { 493 | "sepalLength": 5.9, 494 | "sepalWidth": 3.2, 495 | "petalLength": 4.8, 496 | "petalWidth": 1.8, 497 | "species": "versicolor" 498 | }, 499 | { 500 | "sepalLength": 6.1, 501 | "sepalWidth": 2.8, 502 | "petalLength": 4.0, 503 | "petalWidth": 1.3, 504 | "species": "versicolor" 505 | }, 506 | { 507 | "sepalLength": 6.3, 508 | "sepalWidth": 2.5, 509 | "petalLength": 4.9, 510 | "petalWidth": 1.5, 511 | "species": "versicolor" 512 | }, 513 | { 514 | "sepalLength": 6.1, 515 | "sepalWidth": 2.8, 516 | "petalLength": 4.7, 517 | "petalWidth": 1.2, 518 | "species": "versicolor" 519 | }, 520 | { 521 | "sepalLength": 6.4, 522 | "sepalWidth": 2.9, 523 | "petalLength": 4.3, 524 | "petalWidth": 1.3, 525 | "species": "versicolor" 526 | }, 527 | { 528 | "sepalLength": 6.6, 529 | "sepalWidth": 3.0, 530 | "petalLength": 4.4, 531 | "petalWidth": 1.4, 532 | "species": "versicolor" 533 | }, 534 | { 535 | "sepalLength": 6.8, 536 | "sepalWidth": 2.8, 537 | "petalLength": 4.8, 538 | "petalWidth": 1.4, 539 | "species": "versicolor" 540 | }, 541 | { 542 | "sepalLength": 6.7, 543 | "sepalWidth": 3.0, 544 | "petalLength": 5.0, 545 | "petalWidth": 1.7, 546 | "species": "versicolor" 547 | }, 548 | { 549 | "sepalLength": 6.0, 550 | "sepalWidth": 2.9, 551 | "petalLength": 4.5, 552 | "petalWidth": 1.5, 553 | "species": "versicolor" 554 | }, 555 | { 556 | "sepalLength": 5.7, 557 | "sepalWidth": 2.6, 558 | "petalLength": 3.5, 559 | "petalWidth": 1.0, 560 | "species": "versicolor" 561 | }, 562 | { 563 | "sepalLength": 5.5, 564 | "sepalWidth": 2.4, 565 | "petalLength": 3.8, 566 | "petalWidth": 1.1, 567 | "species": "versicolor" 568 | }, 569 | { 570 | "sepalLength": 5.5, 571 | "sepalWidth": 2.4, 572 | "petalLength": 3.7, 573 | "petalWidth": 1.0, 574 | "species": "versicolor" 575 | }, 576 | { 577 | "sepalLength": 5.8, 578 | "sepalWidth": 2.7, 579 | "petalLength": 3.9, 580 | "petalWidth": 1.2, 581 | "species": "versicolor" 582 | }, 583 | { 584 | "sepalLength": 6.0, 585 | "sepalWidth": 2.7, 586 | "petalLength": 5.1, 587 | "petalWidth": 1.6, 588 | "species": "versicolor" 589 | }, 590 | { 591 | "sepalLength": 5.4, 592 | "sepalWidth": 3.0, 593 | "petalLength": 4.5, 594 | "petalWidth": 1.5, 595 | "species": "versicolor" 596 | }, 597 | { 598 | "sepalLength": 6.0, 599 | "sepalWidth": 3.4, 600 | "petalLength": 4.5, 601 | "petalWidth": 1.6, 602 | "species": "versicolor" 603 | }, 604 | { 605 | "sepalLength": 6.7, 606 | "sepalWidth": 3.1, 607 | "petalLength": 4.7, 608 | "petalWidth": 1.5, 609 | "species": "versicolor" 610 | }, 611 | { 612 | "sepalLength": 6.3, 613 | "sepalWidth": 2.3, 614 | "petalLength": 4.4, 615 | "petalWidth": 1.3, 616 | "species": "versicolor" 617 | }, 618 | { 619 | "sepalLength": 5.6, 620 | "sepalWidth": 3.0, 621 | "petalLength": 4.1, 622 | "petalWidth": 1.3, 623 | "species": "versicolor" 624 | }, 625 | { 626 | "sepalLength": 5.5, 627 | "sepalWidth": 2.5, 628 | "petalLength": 4.0, 629 | "petalWidth": 1.3, 630 | "species": "versicolor" 631 | }, 632 | { 633 | "sepalLength": 5.5, 634 | "sepalWidth": 2.6, 635 | "petalLength": 4.4, 636 | "petalWidth": 1.2, 637 | "species": "versicolor" 638 | }, 639 | { 640 | "sepalLength": 6.1, 641 | "sepalWidth": 3.0, 642 | "petalLength": 4.6, 643 | "petalWidth": 1.4, 644 | "species": "versicolor" 645 | }, 646 | { 647 | "sepalLength": 5.8, 648 | "sepalWidth": 2.6, 649 | "petalLength": 4.0, 650 | "petalWidth": 1.2, 651 | "species": "versicolor" 652 | }, 653 | { 654 | "sepalLength": 5.0, 655 | "sepalWidth": 2.3, 656 | "petalLength": 3.3, 657 | "petalWidth": 1.0, 658 | "species": "versicolor" 659 | }, 660 | { 661 | "sepalLength": 5.6, 662 | "sepalWidth": 2.7, 663 | "petalLength": 4.2, 664 | "petalWidth": 1.3, 665 | "species": "versicolor" 666 | }, 667 | { 668 | "sepalLength": 5.7, 669 | "sepalWidth": 3.0, 670 | "petalLength": 4.2, 671 | "petalWidth": 1.2, 672 | "species": "versicolor" 673 | }, 674 | { 675 | "sepalLength": 5.7, 676 | "sepalWidth": 2.9, 677 | "petalLength": 4.2, 678 | "petalWidth": 1.3, 679 | "species": "versicolor" 680 | }, 681 | { 682 | "sepalLength": 6.2, 683 | "sepalWidth": 2.9, 684 | "petalLength": 4.3, 685 | "petalWidth": 1.3, 686 | "species": "versicolor" 687 | }, 688 | { 689 | "sepalLength": 5.1, 690 | "sepalWidth": 2.5, 691 | "petalLength": 3.0, 692 | "petalWidth": 1.1, 693 | "species": "versicolor" 694 | }, 695 | { 696 | "sepalLength": 5.7, 697 | "sepalWidth": 2.8, 698 | "petalLength": 4.1, 699 | "petalWidth": 1.3, 700 | "species": "versicolor" 701 | }, 702 | { 703 | "sepalLength": 6.3, 704 | "sepalWidth": 3.3, 705 | "petalLength": 6.0, 706 | "petalWidth": 2.5, 707 | "species": "virginica" 708 | }, 709 | { 710 | "sepalLength": 5.8, 711 | "sepalWidth": 2.7, 712 | "petalLength": 5.1, 713 | "petalWidth": 1.9, 714 | "species": "virginica" 715 | }, 716 | { 717 | "sepalLength": 7.1, 718 | "sepalWidth": 3.0, 719 | "petalLength": 5.9, 720 | "petalWidth": 2.1, 721 | "species": "virginica" 722 | }, 723 | { 724 | "sepalLength": 6.3, 725 | "sepalWidth": 2.9, 726 | "petalLength": 5.6, 727 | "petalWidth": 1.8, 728 | "species": "virginica" 729 | }, 730 | { 731 | "sepalLength": 6.5, 732 | "sepalWidth": 3.0, 733 | "petalLength": 5.8, 734 | "petalWidth": 2.2, 735 | "species": "virginica" 736 | }, 737 | { 738 | "sepalLength": 7.6, 739 | "sepalWidth": 3.0, 740 | "petalLength": 6.6, 741 | "petalWidth": 2.1, 742 | "species": "virginica" 743 | }, 744 | { 745 | "sepalLength": 4.9, 746 | "sepalWidth": 2.5, 747 | "petalLength": 4.5, 748 | "petalWidth": 1.7, 749 | "species": "virginica" 750 | }, 751 | { 752 | "sepalLength": 7.3, 753 | "sepalWidth": 2.9, 754 | "petalLength": 6.3, 755 | "petalWidth": 1.8, 756 | "species": "virginica" 757 | }, 758 | { 759 | "sepalLength": 6.7, 760 | "sepalWidth": 2.5, 761 | "petalLength": 5.8, 762 | "petalWidth": 1.8, 763 | "species": "virginica" 764 | }, 765 | { 766 | "sepalLength": 7.2, 767 | "sepalWidth": 3.6, 768 | "petalLength": 6.1, 769 | "petalWidth": 2.5, 770 | "species": "virginica" 771 | }, 772 | { 773 | "sepalLength": 6.5, 774 | "sepalWidth": 3.2, 775 | "petalLength": 5.1, 776 | "petalWidth": 2.0, 777 | "species": "virginica" 778 | }, 779 | { 780 | "sepalLength": 6.4, 781 | "sepalWidth": 2.7, 782 | "petalLength": 5.3, 783 | "petalWidth": 1.9, 784 | "species": "virginica" 785 | }, 786 | { 787 | "sepalLength": 6.8, 788 | "sepalWidth": 3.0, 789 | "petalLength": 5.5, 790 | "petalWidth": 2.1, 791 | "species": "virginica" 792 | }, 793 | { 794 | "sepalLength": 5.7, 795 | "sepalWidth": 2.5, 796 | "petalLength": 5.0, 797 | "petalWidth": 2.0, 798 | "species": "virginica" 799 | }, 800 | { 801 | "sepalLength": 5.8, 802 | "sepalWidth": 2.8, 803 | "petalLength": 5.1, 804 | "petalWidth": 2.4, 805 | "species": "virginica" 806 | }, 807 | { 808 | "sepalLength": 6.4, 809 | "sepalWidth": 3.2, 810 | "petalLength": 5.3, 811 | "petalWidth": 2.3, 812 | "species": "virginica" 813 | }, 814 | { 815 | "sepalLength": 6.5, 816 | "sepalWidth": 3.0, 817 | "petalLength": 5.5, 818 | "petalWidth": 1.8, 819 | "species": "virginica" 820 | }, 821 | { 822 | "sepalLength": 7.7, 823 | "sepalWidth": 3.8, 824 | "petalLength": 6.7, 825 | "petalWidth": 2.2, 826 | "species": "virginica" 827 | }, 828 | { 829 | "sepalLength": 7.7, 830 | "sepalWidth": 2.6, 831 | "petalLength": 6.9, 832 | "petalWidth": 2.3, 833 | "species": "virginica" 834 | }, 835 | { 836 | "sepalLength": 6.0, 837 | "sepalWidth": 2.2, 838 | "petalLength": 5.0, 839 | "petalWidth": 1.5, 840 | "species": "virginica" 841 | }, 842 | { 843 | "sepalLength": 6.9, 844 | "sepalWidth": 3.2, 845 | "petalLength": 5.7, 846 | "petalWidth": 2.3, 847 | "species": "virginica" 848 | }, 849 | { 850 | "sepalLength": 5.6, 851 | "sepalWidth": 2.8, 852 | "petalLength": 4.9, 853 | "petalWidth": 2.0, 854 | "species": "virginica" 855 | }, 856 | { 857 | "sepalLength": 7.7, 858 | "sepalWidth": 2.8, 859 | "petalLength": 6.7, 860 | "petalWidth": 2.0, 861 | "species": "virginica" 862 | }, 863 | { 864 | "sepalLength": 6.3, 865 | "sepalWidth": 2.7, 866 | "petalLength": 4.9, 867 | "petalWidth": 1.8, 868 | "species": "virginica" 869 | }, 870 | { 871 | "sepalLength": 6.7, 872 | "sepalWidth": 3.3, 873 | "petalLength": 5.7, 874 | "petalWidth": 2.1, 875 | "species": "virginica" 876 | }, 877 | { 878 | "sepalLength": 7.2, 879 | "sepalWidth": 3.2, 880 | "petalLength": 6.0, 881 | "petalWidth": 1.8, 882 | "species": "virginica" 883 | }, 884 | { 885 | "sepalLength": 6.2, 886 | "sepalWidth": 2.8, 887 | "petalLength": 4.8, 888 | "petalWidth": 1.8, 889 | "species": "virginica" 890 | }, 891 | { 892 | "sepalLength": 6.1, 893 | "sepalWidth": 3.0, 894 | "petalLength": 4.9, 895 | "petalWidth": 1.8, 896 | "species": "virginica" 897 | }, 898 | { 899 | "sepalLength": 6.4, 900 | "sepalWidth": 2.8, 901 | "petalLength": 5.6, 902 | "petalWidth": 2.1, 903 | "species": "virginica" 904 | }, 905 | { 906 | "sepalLength": 7.2, 907 | "sepalWidth": 3.0, 908 | "petalLength": 5.8, 909 | "petalWidth": 1.6, 910 | "species": "virginica" 911 | }, 912 | { 913 | "sepalLength": 7.4, 914 | "sepalWidth": 2.8, 915 | "petalLength": 6.1, 916 | "petalWidth": 1.9, 917 | "species": "virginica" 918 | }, 919 | { 920 | "sepalLength": 7.9, 921 | "sepalWidth": 3.8, 922 | "petalLength": 6.4, 923 | "petalWidth": 2.0, 924 | "species": "virginica" 925 | }, 926 | { 927 | "sepalLength": 6.4, 928 | "sepalWidth": 2.8, 929 | "petalLength": 5.6, 930 | "petalWidth": 2.2, 931 | "species": "virginica" 932 | }, 933 | { 934 | "sepalLength": 6.3, 935 | "sepalWidth": 2.8, 936 | "petalLength": 5.1, 937 | "petalWidth": 1.5, 938 | "species": "virginica" 939 | }, 940 | { 941 | "sepalLength": 6.1, 942 | "sepalWidth": 2.6, 943 | "petalLength": 5.6, 944 | "petalWidth": 1.4, 945 | "species": "virginica" 946 | }, 947 | { 948 | "sepalLength": 7.7, 949 | "sepalWidth": 3.0, 950 | "petalLength": 6.1, 951 | "petalWidth": 2.3, 952 | "species": "virginica" 953 | }, 954 | { 955 | "sepalLength": 6.3, 956 | "sepalWidth": 3.4, 957 | "petalLength": 5.6, 958 | "petalWidth": 2.4, 959 | "species": "virginica" 960 | }, 961 | { 962 | "sepalLength": 6.4, 963 | "sepalWidth": 3.1, 964 | "petalLength": 5.5, 965 | "petalWidth": 1.8, 966 | "species": "virginica" 967 | }, 968 | { 969 | "sepalLength": 6.0, 970 | "sepalWidth": 3.0, 971 | "petalLength": 4.8, 972 | "petalWidth": 1.8, 973 | "species": "virginica" 974 | }, 975 | { 976 | "sepalLength": 6.9, 977 | "sepalWidth": 3.1, 978 | "petalLength": 5.4, 979 | "petalWidth": 2.1, 980 | "species": "virginica" 981 | }, 982 | { 983 | "sepalLength": 6.7, 984 | "sepalWidth": 3.1, 985 | "petalLength": 5.6, 986 | "petalWidth": 2.4, 987 | "species": "virginica" 988 | }, 989 | { 990 | "sepalLength": 6.9, 991 | "sepalWidth": 3.1, 992 | "petalLength": 5.1, 993 | "petalWidth": 2.3, 994 | "species": "virginica" 995 | }, 996 | { 997 | "sepalLength": 5.8, 998 | "sepalWidth": 2.7, 999 | "petalLength": 5.1, 1000 | "petalWidth": 1.9, 1001 | "species": "virginica" 1002 | }, 1003 | { 1004 | "sepalLength": 6.8, 1005 | "sepalWidth": 3.2, 1006 | "petalLength": 5.9, 1007 | "petalWidth": 2.3, 1008 | "species": "virginica" 1009 | }, 1010 | { 1011 | "sepalLength": 6.7, 1012 | "sepalWidth": 3.3, 1013 | "petalLength": 5.7, 1014 | "petalWidth": 2.5, 1015 | "species": "virginica" 1016 | }, 1017 | { 1018 | "sepalLength": 6.7, 1019 | "sepalWidth": 3.0, 1020 | "petalLength": 5.2, 1021 | "petalWidth": 2.3, 1022 | "species": "virginica" 1023 | }, 1024 | { 1025 | "sepalLength": 6.3, 1026 | "sepalWidth": 2.5, 1027 | "petalLength": 5.0, 1028 | "petalWidth": 1.9, 1029 | "species": "virginica" 1030 | }, 1031 | { 1032 | "sepalLength": 6.5, 1033 | "sepalWidth": 3.0, 1034 | "petalLength": 5.2, 1035 | "petalWidth": 2.0, 1036 | "species": "virginica" 1037 | }, 1038 | { 1039 | "sepalLength": 6.2, 1040 | "sepalWidth": 3.4, 1041 | "petalLength": 5.4, 1042 | "petalWidth": 2.3, 1043 | "species": "virginica" 1044 | }, 1045 | { 1046 | "sepalLength": 5.9, 1047 | "sepalWidth": 3.0, 1048 | "petalLength": 5.1, 1049 | "petalWidth": 1.8, 1050 | "species": "virginica" 1051 | } 1052 | ] 1053 | -------------------------------------------------------------------------------- /public/data/lesson01-output.json: -------------------------------------------------------------------------------- 1 | [ 2 | { "name": "哲学科", "count": 88 }, 3 | { "name": "史学科", "count": 133 }, 4 | { "name": "国文学科", "count": 133 }, 5 | { "name": "中国語中国文化学科", "count": 70 }, 6 | { "name": "英文学科", "count": 133 }, 7 | { "name": "ドイツ文学科", "count": 80 }, 8 | { "name": "社会学科", "count": 210 }, 9 | { "name": "社会福祉学科", "count": 60 }, 10 | { "name": "教育学科", "count": 120 }, 11 | { "name": "体育学科", "count": 200 }, 12 | { "name": "心理学科", "count": 130 }, 13 | { "name": "地理学科", "count": 80 }, 14 | { "name": "地球科学科", "count": 80 }, 15 | { "name": "数学科", "count": 73 }, 16 | { "name": "情報科学科", "count": 80 }, 17 | { "name": "物理学科", "count": 70 }, 18 | { "name": "生命科学科", "count": 70 }, 19 | { "name": "化学科", "count": 90 } 20 | ] 21 | -------------------------------------------------------------------------------- /public/data/lesson03-output.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "id": "男性", 4 | "data": [ 5 | { "x": 85.54, "y": 183.87 }, 6 | { "x": 80.94, "y": 179.54 }, 7 | { "x": 72.99, "y": 173.62 }, 8 | { "x": 62.86, "y": 167.83 }, 9 | { "x": 75.47, "y": 174.38 }, 10 | { "x": 68.83, "y": 171.38 }, 11 | { "x": 68.51, "y": 171.1 }, 12 | { "x": 66.44, "y": 169.39 }, 13 | { "x": 74.05, "y": 174.26 }, 14 | { "x": 70.4, "y": 171.87 }, 15 | { "x": 57.51, "y": 163.64 }, 16 | { "x": 60.41, "y": 166.51 }, 17 | { "x": 50.34, "y": 157.39 }, 18 | { "x": 62.03, "y": 167.17 }, 19 | { "x": 63.11, "y": 168.36 }, 20 | { "x": 55.65, "y": 161.17 }, 21 | { "x": 67.04, "y": 169.75 }, 22 | { "x": 61.4, "y": 166.97 }, 23 | { "x": 60.61, "y": 166.95 }, 24 | { "x": 64.44, "y": 168.87 }, 25 | { "x": 69.4, "y": 171.5 }, 26 | { "x": 57.81, "y": 164.45 }, 27 | { "x": 68.85, "y": 171.39 }, 28 | { "x": 60.1, "y": 166.47 }, 29 | { "x": 73.75, "y": 174.26 }, 30 | { "x": 52.44, "y": 157.47 }, 31 | { "x": 67.44, "y": 170.04 }, 32 | { "x": 80.44, "y": 177.86 }, 33 | { "x": 63.89, "y": 168.76 }, 34 | { "x": 69.26, "y": 171.47 }, 35 | { "x": 82.35, "y": 180.18 }, 36 | { "x": 86.87, "y": 188.11 }, 37 | { "x": 75.56, "y": 174.49 }, 38 | { "x": 62.57, "y": 167.6 }, 39 | { "x": 77.07, "y": 175.1 }, 40 | { "x": 72.17, "y": 173.09 }, 41 | { "x": 61.74, "y": 166.99 }, 42 | { "x": 56.98, "y": 163.45 }, 43 | { "x": 76.4, "y": 175.07 }, 44 | { "x": 81.64, "y": 179.57 }, 45 | { "x": 72.14, "y": 172.93 }, 46 | { "x": 56.51, "y": 162.1 }, 47 | { "x": 62.94, "y": 167.87 }, 48 | { "x": 59.61, "y": 166.11 }, 49 | { "x": 66.62, "y": 169.74 }, 50 | { "x": 81.82, "y": 179.61 }, 51 | { "x": 66.28, "y": 169.33 }, 52 | { "x": 61.78, "y": 167.13 }, 53 | { "x": 71.55, "y": 172.43 }, 54 | { "x": 48.63, "y": 156.9 }, 55 | { "x": 60.59, "y": 166.85 }, 56 | { "x": 78.66, "y": 176.78 }, 57 | { "x": 64.39, "y": 168.87 }, 58 | { "x": 70.85, "y": 172.09 }, 59 | { "x": 56.76, "y": 163.19 }, 60 | { "x": 67.9, "y": 170.68 }, 61 | { "x": 58.29, "y": 165.8 }, 62 | { "x": 62.21, "y": 167.49 }, 63 | { "x": 70.87, "y": 172.36 }, 64 | { "x": 77.38, "y": 175.14 }, 65 | { "x": 63.06, "y": 168.21 }, 66 | { "x": 70.44, "y": 171.98 }, 67 | { "x": 64.85, "y": 169.06 }, 68 | { "x": 70.85, "y": 172.27 }, 69 | { "x": 58.21, "y": 165.62 }, 70 | { "x": 53.05, "y": 159.62 }, 71 | { "x": 77.77, "y": 175.56 }, 72 | { "x": 62.18, "y": 167.33 }, 73 | { "x": 73.1, "y": 174.21 }, 74 | { "x": 54.45, "y": 160.95 }, 75 | { "x": 67.97, "y": 171.03 }, 76 | { "x": 78.08, "y": 176.68 }, 77 | { "x": 65.09, "y": 169.21 }, 78 | { "x": 58.07, "y": 165.41 }, 79 | { "x": 76.44, "y": 175.09 }, 80 | { "x": 72.2, "y": 173.51 }, 81 | { "x": 66.01, "y": 169.32 }, 82 | { "x": 56.09, "y": 161.48 }, 83 | { "x": 56.63, "y": 162.84 }, 84 | { "x": 71.63, "y": 172.53 }, 85 | { "x": 71.63, "y": 172.77 }, 86 | { "x": 63.97, "y": 168.81 }, 87 | { "x": 64.84, "y": 168.98 }, 88 | { "x": 52.51, "y": 157.63 }, 89 | { "x": 47.32, "y": 156.7 }, 90 | { "x": 64.34, "y": 168.85 }, 91 | { "x": 70.31, "y": 171.73 }, 92 | { "x": 67.65, "y": 170.22 }, 93 | { "x": 55.38, "y": 161.12 }, 94 | { "x": 60.46, "y": 166.76 }, 95 | { "x": 66.5, "y": 169.44 }, 96 | { "x": 79.35, "y": 177.71 }, 97 | { "x": 53.96, "y": 159.88 }, 98 | { "x": 71, "y": 172.37 }, 99 | { "x": 58.18, "y": 165.54 }, 100 | { "x": 57.04, "y": 163.48 }, 101 | { "x": 60.56, "y": 166.8 }, 102 | { "x": 71.68, "y": 172.89 }, 103 | { "x": 79.05, "y": 177.63 }, 104 | { "x": 66.78, "y": 169.74 } 105 | ] 106 | }, 107 | { 108 | "id": "女性", 109 | "data": [ 110 | { "x": 52.93, "y": 161.34 }, 111 | { "x": 47.32, "y": 153.25 }, 112 | { "x": 47.85, "y": 153.91 }, 113 | { "x": 58.69, "y": 166.32 }, 114 | { "x": 45.99, "y": 152.31 }, 115 | { "x": 50.89, "y": 158.3 }, 116 | { "x": 60.46, "y": 169.22 }, 117 | { "x": 42.01, "y": 150.69 }, 118 | { "x": 49.13, "y": 155.69 }, 119 | { "x": 59.18, "y": 166.87 }, 120 | { "x": 46.67, "y": 152.56 }, 121 | { "x": 38.42, "y": 148.82 }, 122 | { "x": 50.75, "y": 157.49 }, 123 | { "x": 54.74, "y": 163.07 }, 124 | { "x": 52.29, "y": 159.48 }, 125 | { "x": 43.88, "y": 151.43 }, 126 | { "x": 52.92, "y": 161.31 }, 127 | { "x": 53.41, "y": 162.14 }, 128 | { "x": 46.97, "y": 152.89 }, 129 | { "x": 50.95, "y": 158.7 }, 130 | { "x": 48, "y": 154.13 }, 131 | { "x": 57.97, "y": 165.29 }, 132 | { "x": 52.91, "y": 161.04 }, 133 | { "x": 47.46, "y": 153.74 }, 134 | { "x": 53.18, "y": 161.87 }, 135 | { "x": 47.57, "y": 153.76 }, 136 | { "x": 41.84, "y": 149.15 }, 137 | { "x": 55.53, "y": 163.66 }, 138 | { "x": 56.21, "y": 163.91 }, 139 | { "x": 50.8, "y": 157.77 }, 140 | { "x": 48.44, "y": 154.35 }, 141 | { "x": 63.65, "y": 171.72 }, 142 | { "x": 51.48, "y": 158.86 }, 143 | { "x": 47.31, "y": 153.08 }, 144 | { "x": 29.73, "y": 142.86 }, 145 | { "x": 46.22, "y": 152.31 }, 146 | { "x": 52.67, "y": 160.57 }, 147 | { "x": 45.47, "y": 152.12 }, 148 | { "x": 53.06, "y": 161.44 }, 149 | { "x": 54.49, "y": 162.97 }, 150 | { "x": 49.71, "y": 156.02 }, 151 | { "x": 36.11, "y": 147.88 }, 152 | { "x": 57.04, "y": 165.11 }, 153 | { "x": 57.52, "y": 165.19 }, 154 | { "x": 52.79, "y": 160.99 }, 155 | { "x": 63.8, "y": 172.32 }, 156 | { "x": 50.1, "y": 157.26 }, 157 | { "x": 53.13, "y": 161.79 }, 158 | { "x": 49.67, "y": 156.02 }, 159 | { "x": 53.08, "y": 161.78 }, 160 | { "x": 52.79, "y": 160.87 }, 161 | { "x": 55.02, "y": 163.43 }, 162 | { "x": 45.06, "y": 152.09 }, 163 | { "x": 52.51, "y": 160.28 }, 164 | { "x": 49.07, "y": 155.54 }, 165 | { "x": 49.49, "y": 155.7 }, 166 | { "x": 47.44, "y": 153.6 }, 167 | { "x": 63.3, "y": 170.88 }, 168 | { "x": 55.05, "y": 163.61 }, 169 | { "x": 50.71, "y": 157.44 }, 170 | { "x": 49.03, "y": 155.15 }, 171 | { "x": 54.91, "y": 163.11 }, 172 | { "x": 54.05, "y": 162.16 }, 173 | { "x": 52.05, "y": 158.93 }, 174 | { "x": 49.56, "y": 155.75 }, 175 | { "x": 52.43, "y": 160.2 }, 176 | { "x": 56.95, "y": 165 }, 177 | { "x": 44.36, "y": 151.44 }, 178 | { "x": 60.69, "y": 169.34 }, 179 | { "x": 65.73, "y": 175.19 }, 180 | { "x": 59.77, "y": 167.62 }, 181 | { "x": 53.99, "y": 162.15 }, 182 | { "x": 49.59, "y": 155.95 }, 183 | { "x": 56.58, "y": 163.93 }, 184 | { "x": 55.63, "y": 163.88 }, 185 | { "x": 57.04, "y": 165.06 }, 186 | { "x": 50.81, "y": 158.04 }, 187 | { "x": 52.23, "y": 159.32 }, 188 | { "x": 42.76, "y": 151.38 }, 189 | { "x": 59.9, "y": 168.53 }, 190 | { "x": 49.97, "y": 156.97 }, 191 | { "x": 42.05, "y": 150.87 }, 192 | { "x": 50.79, "y": 157.63 }, 193 | { "x": 51.64, "y": 158.93 }, 194 | { "x": 48.72, "y": 154.98 }, 195 | { "x": 48.67, "y": 154.8 }, 196 | { "x": 46.81, "y": 152.68 }, 197 | { "x": 54.08, "y": 162.32 }, 198 | { "x": 42.52, "y": 151.36 }, 199 | { "x": 49.73, "y": 156.14 }, 200 | { "x": 44.42, "y": 151.75 }, 201 | { "x": 49.86, "y": 156.83 }, 202 | { "x": 47.09, "y": 153.08 }, 203 | { "x": 49.83, "y": 156.21 }, 204 | { "x": 59.19, "y": 166.9 }, 205 | { "x": 58.19, "y": 165.62 }, 206 | { "x": 46.42, "y": 152.4 }, 207 | { "x": 54.93, "y": 163.24 }, 208 | { "x": 53.05, "y": 161.39 }, 209 | { "x": 45.76, "y": 152.28 } 210 | ] 211 | } 212 | ] 213 | -------------------------------------------------------------------------------- /public/data/lesson04-otput.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "id": "setosa", 4 | "data": [ 5 | { "x": 5.1, "y": 0.2 }, 6 | { "x": 4.9, "y": 0.2 }, 7 | { "x": 4.7, "y": 0.2 }, 8 | { "x": 4.6, "y": 0.2 }, 9 | { "x": 5, "y": 0.2 }, 10 | { "x": 5.4, "y": 0.4 }, 11 | { "x": 4.6, "y": 0.3 }, 12 | { "x": 5, "y": 0.2 }, 13 | { "x": 4.4, "y": 0.2 }, 14 | { "x": 4.9, "y": 0.1 }, 15 | { "x": 5.4, "y": 0.2 }, 16 | { "x": 4.8, "y": 0.2 }, 17 | { "x": 4.8, "y": 0.1 }, 18 | { "x": 4.3, "y": 0.1 }, 19 | { "x": 5.8, "y": 0.2 }, 20 | { "x": 5.7, "y": 0.4 }, 21 | { "x": 5.4, "y": 0.4 }, 22 | { "x": 5.1, "y": 0.3 }, 23 | { "x": 5.7, "y": 0.3 }, 24 | { "x": 5.1, "y": 0.3 }, 25 | { "x": 5.4, "y": 0.2 }, 26 | { "x": 5.1, "y": 0.4 }, 27 | { "x": 4.6, "y": 0.2 }, 28 | { "x": 5.1, "y": 0.5 }, 29 | { "x": 4.8, "y": 0.2 }, 30 | { "x": 5, "y": 0.2 }, 31 | { "x": 5, "y": 0.4 }, 32 | { "x": 5.2, "y": 0.2 }, 33 | { "x": 5.2, "y": 0.2 }, 34 | { "x": 4.7, "y": 0.2 }, 35 | { "x": 4.8, "y": 0.2 }, 36 | { "x": 5.4, "y": 0.4 }, 37 | { "x": 5.2, "y": 0.1 }, 38 | { "x": 5.5, "y": 0.2 }, 39 | { "x": 4.9, "y": 0.1 }, 40 | { "x": 5, "y": 0.2 }, 41 | { "x": 5.5, "y": 0.2 }, 42 | { "x": 4.9, "y": 0.1 }, 43 | { "x": 4.4, "y": 0.2 }, 44 | { "x": 5.1, "y": 0.2 }, 45 | { "x": 5, "y": 0.3 }, 46 | { "x": 4.5, "y": 0.3 }, 47 | { "x": 4.4, "y": 0.2 }, 48 | { "x": 5, "y": 0.6 }, 49 | { "x": 5.1, "y": 0.4 }, 50 | { "x": 4.8, "y": 0.3 }, 51 | { "x": 5.1, "y": 0.2 }, 52 | { "x": 4.6, "y": 0.2 }, 53 | { "x": 5.3, "y": 0.2 }, 54 | { "x": 5, "y": 0.2 } 55 | ] 56 | }, 57 | { 58 | "id": "versicolor", 59 | "data": [ 60 | { "x": 7, "y": 1.4 }, 61 | { "x": 6.4, "y": 1.5 }, 62 | { "x": 6.9, "y": 1.5 }, 63 | { "x": 5.5, "y": 1.3 }, 64 | { "x": 6.5, "y": 1.5 }, 65 | { "x": 5.7, "y": 1.3 }, 66 | { "x": 6.3, "y": 1.6 }, 67 | { "x": 4.9, "y": 1 }, 68 | { "x": 6.6, "y": 1.3 }, 69 | { "x": 5.2, "y": 1.4 }, 70 | { "x": 5, "y": 1 }, 71 | { "x": 5.9, "y": 1.5 }, 72 | { "x": 6, "y": 1 }, 73 | { "x": 6.1, "y": 1.4 }, 74 | { "x": 5.6, "y": 1.3 }, 75 | { "x": 6.7, "y": 1.4 }, 76 | { "x": 5.6, "y": 1.5 }, 77 | { "x": 5.8, "y": 1 }, 78 | { "x": 6.2, "y": 1.5 }, 79 | { "x": 5.6, "y": 1.1 }, 80 | { "x": 5.9, "y": 1.8 }, 81 | { "x": 6.1, "y": 1.3 }, 82 | { "x": 6.3, "y": 1.5 }, 83 | { "x": 6.1, "y": 1.2 }, 84 | { "x": 6.4, "y": 1.3 }, 85 | { "x": 6.6, "y": 1.4 }, 86 | { "x": 6.8, "y": 1.4 }, 87 | { "x": 6.7, "y": 1.7 }, 88 | { "x": 6, "y": 1.5 }, 89 | { "x": 5.7, "y": 1 }, 90 | { "x": 5.5, "y": 1.1 }, 91 | { "x": 5.5, "y": 1 }, 92 | { "x": 5.8, "y": 1.2 }, 93 | { "x": 6, "y": 1.6 }, 94 | { "x": 5.4, "y": 1.5 }, 95 | { "x": 6, "y": 1.6 }, 96 | { "x": 6.7, "y": 1.5 }, 97 | { "x": 6.3, "y": 1.3 }, 98 | { "x": 5.6, "y": 1.3 }, 99 | { "x": 5.5, "y": 1.3 }, 100 | { "x": 5.5, "y": 1.2 }, 101 | { "x": 6.1, "y": 1.4 }, 102 | { "x": 5.8, "y": 1.2 }, 103 | { "x": 5, "y": 1 }, 104 | { "x": 5.6, "y": 1.3 }, 105 | { "x": 5.7, "y": 1.2 }, 106 | { "x": 5.7, "y": 1.3 }, 107 | { "x": 6.2, "y": 1.3 }, 108 | { "x": 5.1, "y": 1.1 }, 109 | { "x": 5.7, "y": 1.3 } 110 | ] 111 | }, 112 | { 113 | "id": "virginica", 114 | "data": [ 115 | { "x": 6.3, "y": 2.5 }, 116 | { "x": 5.8, "y": 1.9 }, 117 | { "x": 7.1, "y": 2.1 }, 118 | { "x": 6.3, "y": 1.8 }, 119 | { "x": 6.5, "y": 2.2 }, 120 | { "x": 7.6, "y": 2.1 }, 121 | { "x": 4.9, "y": 1.7 }, 122 | { "x": 7.3, "y": 1.8 }, 123 | { "x": 6.7, "y": 1.8 }, 124 | { "x": 7.2, "y": 2.5 }, 125 | { "x": 6.5, "y": 2 }, 126 | { "x": 6.4, "y": 1.9 }, 127 | { "x": 6.8, "y": 2.1 }, 128 | { "x": 5.7, "y": 2 }, 129 | { "x": 5.8, "y": 2.4 }, 130 | { "x": 6.4, "y": 2.3 }, 131 | { "x": 6.5, "y": 1.8 }, 132 | { "x": 7.7, "y": 2.2 }, 133 | { "x": 7.7, "y": 2.3 }, 134 | { "x": 6, "y": 1.5 }, 135 | { "x": 6.9, "y": 2.3 }, 136 | { "x": 5.6, "y": 2 }, 137 | { "x": 7.7, "y": 2 }, 138 | { "x": 6.3, "y": 1.8 }, 139 | { "x": 6.7, "y": 2.1 }, 140 | { "x": 7.2, "y": 1.8 }, 141 | { "x": 6.2, "y": 1.8 }, 142 | { "x": 6.1, "y": 1.8 }, 143 | { "x": 6.4, "y": 2.1 }, 144 | { "x": 7.2, "y": 1.6 }, 145 | { "x": 7.4, "y": 1.9 }, 146 | { "x": 7.9, "y": 2 }, 147 | { "x": 6.4, "y": 2.2 }, 148 | { "x": 6.3, "y": 1.5 }, 149 | { "x": 6.1, "y": 1.4 }, 150 | { "x": 7.7, "y": 2.3 }, 151 | { "x": 6.3, "y": 2.4 }, 152 | { "x": 6.4, "y": 1.8 }, 153 | { "x": 6, "y": 1.8 }, 154 | { "x": 6.9, "y": 2.1 }, 155 | { "x": 6.7, "y": 2.4 }, 156 | { "x": 6.9, "y": 2.3 }, 157 | { "x": 5.8, "y": 1.9 }, 158 | { "x": 6.8, "y": 2.3 }, 159 | { "x": 6.7, "y": 2.5 }, 160 | { "x": 6.7, "y": 2.3 }, 161 | { "x": 6.3, "y": 1.9 }, 162 | { "x": 6.5, "y": 2 }, 163 | { "x": 6.2, "y": 2.3 }, 164 | { "x": 5.9, "y": 1.8 } 165 | ] 166 | } 167 | ] 168 | -------------------------------------------------------------------------------- /public/data/lesson05-otput.json: -------------------------------------------------------------------------------- 1 | [ 2 | { "bin": "143", "男性": 0, "女性": 1 }, 3 | { "bin": "144", "男性": 0, "女性": 0 }, 4 | { "bin": "145", "男性": 0, "女性": 0 }, 5 | { "bin": "146", "男性": 0, "女性": 0 }, 6 | { "bin": "147", "男性": 0, "女性": 0 }, 7 | { "bin": "148", "男性": 0, "女性": 1 }, 8 | { "bin": "149", "男性": 0, "女性": 2 }, 9 | { "bin": "150", "男性": 0, "女性": 0 }, 10 | { "bin": "151", "男性": 0, "女性": 6 }, 11 | { "bin": "152", "男性": 0, "女性": 7 }, 12 | { "bin": "153", "男性": 0, "女性": 6 }, 13 | { "bin": "154", "男性": 0, "女性": 6 }, 14 | { "bin": "155", "男性": 0, "女性": 3 }, 15 | { "bin": "156", "男性": 0, "女性": 9 }, 16 | { "bin": "157", "男性": 4, "女性": 5 }, 17 | { "bin": "158", "男性": 1, "女性": 4 }, 18 | { "bin": "159", "男性": 0, "女性": 6 }, 19 | { "bin": "160", "男性": 2, "女性": 2 }, 20 | { "bin": "161", "男性": 4, "女性": 8 }, 21 | { "bin": "162", "男性": 1, "女性": 7 }, 22 | { "bin": "163", "男性": 4, "女性": 5 }, 23 | { "bin": "164", "男性": 2, "女性": 5 }, 24 | { "bin": "165", "男性": 1, "女性": 5 }, 25 | { "bin": "166", "男性": 5, "女性": 2 }, 26 | { "bin": "167", "男性": 11, "女性": 2 }, 27 | { "bin": "168", "男性": 5, "女性": 1 }, 28 | { "bin": "169", "男性": 12, "女性": 3 }, 29 | { "bin": "170", "男性": 5, "女性": 0 }, 30 | { "bin": "171", "男性": 6, "女性": 1 }, 31 | { "bin": "172", "男性": 9, "女性": 2 }, 32 | { "bin": "173", "男性": 5, "女性": 0 }, 33 | { "bin": "174", "男性": 7, "女性": 0 }, 34 | { "bin": "175", "男性": 4, "女性": 1 }, 35 | { "bin": "176", "男性": 1, "女性": 0 }, 36 | { "bin": "177", "男性": 2, "女性": 0 }, 37 | { "bin": "178", "男性": 3, "女性": 0 }, 38 | { "bin": "179", "男性": 0, "女性": 0 }, 39 | { "bin": "180", "男性": 4, "女性": 0 }, 40 | { "bin": "181", "男性": 0, "女性": 0 }, 41 | { "bin": "182", "男性": 0, "女性": 0 }, 42 | { "bin": "183", "男性": 0, "女性": 0 }, 43 | { "bin": "184", "男性": 1, "女性": 0 }, 44 | { "bin": "185", "男性": 0, "女性": 0 }, 45 | { "bin": "186", "男性": 0, "女性": 0 }, 46 | { "bin": "187", "男性": 0, "女性": 0 }, 47 | { "bin": "188", "男性": 1, "女性": 0 } 48 | ] 49 | -------------------------------------------------------------------------------- /public/data/lesson07-output.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "id": "tweet", 4 | "data": [ 5 | { "x": "2020-01-26", "y": 37 }, 6 | { "x": "2020-01-27", "y": 47 }, 7 | { "x": "2020-01-28", "y": 72 }, 8 | { "x": "2020-01-29", "y": 89 }, 9 | { "x": "2020-01-30", "y": 81 }, 10 | { "x": "2020-01-31", "y": 84 }, 11 | { "x": "2020-02-01", "y": 59 } 12 | ] 13 | }, 14 | { 15 | "id": "retweet", 16 | "data": [ 17 | { "x": "2020-01-26", "y": 45 }, 18 | { "x": "2020-01-27", "y": 45 }, 19 | { "x": "2020-01-28", "y": 49 }, 20 | { "x": "2020-01-29", "y": 95 }, 21 | { "x": "2020-01-30", "y": 85 }, 22 | { "x": "2020-01-31", "y": 81 }, 23 | { "x": "2020-02-01", "y": 62 } 24 | ] 25 | } 26 | ] 27 | -------------------------------------------------------------------------------- /public/data/lesson08-output.json: -------------------------------------------------------------------------------- 1 | { 2 | "nodes": [ 3 | { "id": ".NET" }, 4 | { "id": "AWS" }, 5 | { "id": "ActiveRecord" }, 6 | { "id": "Ajax" }, 7 | { "id": "Android" }, 8 | { "id": "AndroidStudio" }, 9 | { "id": "AtCoder" }, 10 | { "id": "Autonomous" }, 11 | { "id": "BigQuery" }, 12 | { "id": "C#" }, 13 | { "id": "C++" }, 14 | { "id": "CNN" }, 15 | { "id": "CSS" }, 16 | { "id": "CentOS" }, 17 | { "id": "CircleCI" }, 18 | { "id": "CircleCI2.0" }, 19 | { "id": "Client" }, 20 | { "id": "CloudFront" }, 21 | { "id": "Clova" }, 22 | { "id": "Cython" }, 23 | { "id": "C言語" }, 24 | { "id": "D-Ocean" }, 25 | { "id": "D-Wave" }, 26 | { "id": "DeepLearning" }, 27 | { "id": "Django" }, 28 | { "id": "Django2.0" }, 29 | { "id": "Docker" }, 30 | { "id": "EC2" }, 31 | { "id": "ENI" }, 32 | { "id": "Emacs" }, 33 | { "id": "Ethereum" }, 34 | { "id": "Express" }, 35 | { "id": "Express.js" }, 36 | { "id": "GORM" }, 37 | { "id": "Gem" }, 38 | { "id": "Ghq" }, 39 | { "id": "Git" }, 40 | { "id": "GitHub" }, 41 | { "id": "Go" }, 42 | { "id": "GoogleAppsScript" }, 43 | { "id": "GoogleMapsAPI" }, 44 | { "id": "GraphDB" }, 45 | { "id": "GraphQL" }, 46 | { "id": "HTML" }, 47 | { "id": "HTTP" }, 48 | { "id": "Heroku" }, 49 | { "id": "JSON" }, 50 | { "id": "Java" }, 51 | { "id": "JavaScript" }, 52 | { "id": "Jupyter" }, 53 | { "id": "Kaggle" }, 54 | { "id": "Keras" }, 55 | { "id": "Kivy" }, 56 | { "id": "Kotlin" }, 57 | { "id": "LINEmessagingAPI" }, 58 | { "id": "Laravel" }, 59 | { "id": "Line" }, 60 | { "id": "Linux" }, 61 | { "id": "Linuxコマンド" }, 62 | { "id": "Mac" }, 63 | { "id": "MacOSX" }, 64 | { "id": "MachineLearning" }, 65 | { "id": "Markdown" }, 66 | { "id": "MySQL" }, 67 | { "id": "NLP" }, 68 | { "id": "Node.js" }, 69 | { "id": "Office365" }, 70 | { "id": "OpenCV" }, 71 | { "id": "OracleDatabase" }, 72 | { "id": "Outlook" }, 73 | { "id": "PHP" }, 74 | { "id": "PWA" }, 75 | { "id": "PostgreSQL" }, 76 | { "id": "PowerApps" }, 77 | { "id": "PowerShell" }, 78 | { "id": "Python" }, 79 | { "id": "Python3" }, 80 | { "id": "Quantx" }, 81 | { "id": "R" }, 82 | { "id": "RHEL" }, 83 | { "id": "ROS" }, 84 | { "id": "RSpec" }, 85 | { "id": "Rails" }, 86 | { "id": "Rails5" }, 87 | { "id": "RaspberryPi" }, 88 | { "id": "React" }, 89 | { "id": "Ruby" }, 90 | { "id": "Rust" }, 91 | { "id": "S3" }, 92 | { "id": "SQL" }, 93 | { "id": "SecurityGroup" }, 94 | { "id": "ServerlessFramework" }, 95 | { "id": "Shader" }, 96 | { "id": "Slack" }, 97 | { "id": "Swift" }, 98 | { "id": "TPC-H" }, 99 | { "id": "TensorFlow" }, 100 | { "id": "Terraform" }, 101 | { "id": "Tomcat" }, 102 | { "id": "Twitter" }, 103 | { "id": "TypeScript" }, 104 | { "id": "Ubuntu" }, 105 | { "id": "Unity" }, 106 | { "id": "Unity3D" }, 107 | { "id": "VBA" }, 108 | { "id": "VSCode" }, 109 | { "id": "Vagrant" }, 110 | { "id": "VirtualBox" }, 111 | { "id": "VisualStudio" }, 112 | { "id": "VisualStudioCode" }, 113 | { "id": "Vue.js" }, 114 | { "id": "WSL" }, 115 | { "id": "Web" }, 116 | { "id": "Windows" }, 117 | { "id": "WordPress" }, 118 | { "id": "Xamarin" }, 119 | { "id": "Xcode" }, 120 | { "id": "Zsh" }, 121 | { "id": "api" }, 122 | { "id": "apollo" }, 123 | { "id": "async" }, 124 | { "id": "bundler" }, 125 | { "id": "canvas" }, 126 | { "id": "centos7" }, 127 | { "id": "curl" }, 128 | { "id": "docker-compose" }, 129 | { "id": "es2015" }, 130 | { "id": "gas" }, 131 | { "id": "gcp" }, 132 | { "id": "gin" }, 133 | { "id": "goenv" }, 134 | { "id": "gradle" }, 135 | { "id": "homebrew" }, 136 | { "id": "iOS" }, 137 | { "id": "jQuery" }, 138 | { "id": "java8" }, 139 | { "id": "jq" }, 140 | { "id": "kubernetes" }, 141 | { "id": "lambda" }, 142 | { "id": "linebot" }, 143 | { "id": "matplotlib" }, 144 | { "id": "minishift" }, 145 | { "id": "neo4j" }, 146 | { "id": "nextcloud" }, 147 | { "id": "nginx" }, 148 | { "id": "numpy" }, 149 | { "id": "nuxt.js" }, 150 | { "id": "obniz" }, 151 | { "id": "openshift" }, 152 | { "id": "oracle12c" }, 153 | { "id": "oraclecloud" }, 154 | { "id": "pandas" }, 155 | { "id": "pandas-profiling" }, 156 | { "id": "pyenv" }, 157 | { "id": "reactnative" }, 158 | { "id": "redux" }, 159 | { "id": "route53" }, 160 | { "id": "rviz" }, 161 | { "id": "slack-api" }, 162 | { "id": "slackbot" }, 163 | { "id": "solidity" }, 164 | { "id": "spreadsheet" }, 165 | { "id": "test" }, 166 | { "id": "tpcc-mysql" }, 167 | { "id": "vue-cli" }, 168 | { "id": "webpack" }, 169 | { "id": "workspaces" }, 170 | { "id": "データサイエンス" }, 171 | { "id": "データベース" }, 172 | { "id": "データ分析" }, 173 | { "id": "データ可視化" }, 174 | { "id": "データ解析" }, 175 | { "id": "プログラミング" }, 176 | { "id": "マクロ" }, 177 | { "id": "マーケティング" }, 178 | { "id": "モノビットエンジン" }, 179 | { "id": "リアルタイム通信" }, 180 | { "id": "令和" }, 181 | { "id": "初心者" }, 182 | { "id": "初心者向け" }, 183 | { "id": "応用情報技術者試験" }, 184 | { "id": "数値計算" }, 185 | { "id": "数学" }, 186 | { "id": "新人プログラマ応援" }, 187 | { "id": "新元号" }, 188 | { "id": "本の勉強" }, 189 | { "id": "機械学習" }, 190 | { "id": "環境構築" }, 191 | { "id": "競プロ参戦記" }, 192 | { "id": "競技プログラミング" }, 193 | { "id": "自然言語処理" }, 194 | { "id": "資格" }, 195 | { "id": "量子アニーリング" }, 196 | { "id": "量子コンピュータ" }, 197 | { "id": "量子力学" } 198 | ], 199 | "links": [ 200 | { "source": ".NET", "target": "C#" }, 201 | { "source": "AWS", "target": "CloudFront" }, 202 | { "source": "AWS", "target": "EC2" }, 203 | { "source": "AWS", "target": "ENI" }, 204 | { "source": "AWS", "target": "Linux" }, 205 | { "source": "AWS", "target": "Mac" }, 206 | { "source": "AWS", "target": "Rails" }, 207 | { "source": "AWS", "target": "Ruby" }, 208 | { "source": "AWS", "target": "S3" }, 209 | { "source": "AWS", "target": "SecurityGroup" }, 210 | { "source": "AWS", "target": "ServerlessFramework" }, 211 | { "source": "AWS", "target": "Terraform" }, 212 | { "source": "AWS", "target": "lambda" }, 213 | { "source": "AWS", "target": "workspaces" }, 214 | { "source": "ActiveRecord", "target": "Rails" }, 215 | { "source": "ActiveRecord", "target": "Ruby" }, 216 | { "source": "Ajax", "target": "Rails" }, 217 | { "source": "Android", "target": "AndroidStudio" }, 218 | { "source": "Android", "target": "Git" }, 219 | { "source": "Android", "target": "GoogleMapsAPI" }, 220 | { "source": "Android", "target": "Java" }, 221 | { "source": "Android", "target": "Kotlin" }, 222 | { "source": "Android", "target": "gradle" }, 223 | { "source": "Android", "target": "iOS" }, 224 | { "source": "AtCoder", "target": "C#" }, 225 | { "source": "AtCoder", "target": "Rust" }, 226 | { "source": "AtCoder", "target": "java8" }, 227 | { "source": "AtCoder", "target": "競プロ参戦記" }, 228 | { "source": "AtCoder", "target": "競技プログラミング" }, 229 | { "source": "Autonomous", "target": "oraclecloud" }, 230 | { "source": "BigQuery", "target": "D-Ocean" }, 231 | { "source": "C#", "target": "Unity" }, 232 | { "source": "C#", "target": "VisualStudio" }, 233 | { "source": "C#", "target": "Xamarin" }, 234 | { "source": "C#", "target": "競技プログラミング" }, 235 | { "source": "C++", "target": "OpenCV" }, 236 | { "source": "CNN", "target": "TensorFlow" }, 237 | { "source": "CSS", "target": "HTML" }, 238 | { "source": "CSS", "target": "JavaScript" }, 239 | { "source": "CentOS", "target": "RHEL" }, 240 | { "source": "CentOS", "target": "centos7" }, 241 | { "source": "CircleCI", "target": "CircleCI2.0" }, 242 | { "source": "Client", "target": "HTTP" }, 243 | { "source": "Client", "target": "Vue.js" }, 244 | { "source": "Client", "target": "Web" }, 245 | { "source": "CloudFront", "target": "route53" }, 246 | { "source": "Clova", "target": "obniz" }, 247 | { "source": "Cython", "target": "Python" }, 248 | { "source": "Cython", "target": "Python3" }, 249 | { "source": "C言語", "target": "Linux" }, 250 | { "source": "C言語", "target": "Python" }, 251 | { "source": "C言語", "target": "量子コンピュータ" }, 252 | { "source": "D-Wave", "target": "量子コンピュータ" }, 253 | { "source": "DeepLearning", "target": "Keras" }, 254 | { "source": "DeepLearning", "target": "MachineLearning" }, 255 | { "source": "DeepLearning", "target": "Python" }, 256 | { "source": "DeepLearning", "target": "機械学習" }, 257 | { "source": "Django", "target": "Django2.0" }, 258 | { "source": "Django", "target": "Python" }, 259 | { "source": "Django", "target": "Python3" }, 260 | { "source": "Django", "target": "docker-compose" }, 261 | { "source": "Django2.0", "target": "Python" }, 262 | { "source": "Docker", "target": "Mac" }, 263 | { "source": "Docker", "target": "MySQL" }, 264 | { "source": "Docker", "target": "Python" }, 265 | { "source": "Docker", "target": "curl" }, 266 | { "source": "Docker", "target": "docker-compose" }, 267 | { "source": "Docker", "target": "gcp" }, 268 | { "source": "Docker", "target": "kubernetes" }, 269 | { "source": "Docker", "target": "nginx" }, 270 | { "source": "EC2", "target": "Linux" }, 271 | { "source": "ENI", "target": "SecurityGroup" }, 272 | { "source": "ENI", "target": "workspaces" }, 273 | { "source": "Emacs", "target": "Mac" }, 274 | { "source": "Ethereum", "target": "solidity" }, 275 | { "source": "Express", "target": "TypeScript" }, 276 | { "source": "Express.js", "target": "Node.js" }, 277 | { "source": "GORM", "target": "Go" }, 278 | { "source": "GORM", "target": "gin" }, 279 | { "source": "Gem", "target": "Rails" }, 280 | { "source": "Gem", "target": "Ruby" }, 281 | { "source": "Gem", "target": "bundler" }, 282 | { "source": "Ghq", "target": "Zsh" }, 283 | { "source": "Git", "target": "GitHub" }, 284 | { "source": "Go", "target": "gin" }, 285 | { "source": "Go", "target": "goenv" }, 286 | { "source": "Go", "target": "test" }, 287 | { "source": "GoogleAppsScript", "target": "JavaScript" }, 288 | { "source": "GoogleAppsScript", "target": "Slack" }, 289 | { "source": "GoogleAppsScript", "target": "gas" }, 290 | { "source": "GoogleAppsScript", "target": "spreadsheet" }, 291 | { "source": "GraphDB", "target": "TPC-H" }, 292 | { "source": "GraphDB", "target": "neo4j" }, 293 | { "source": "GraphDB", "target": "tpcc-mysql" }, 294 | { "source": "GraphQL", "target": "TypeScript" }, 295 | { "source": "GraphQL", "target": "apollo" }, 296 | { "source": "HTML", "target": "JavaScript" }, 297 | { "source": "HTTP", "target": "Vue.js" }, 298 | { "source": "HTTP", "target": "Web" }, 299 | { "source": "Heroku", "target": "Rails" }, 300 | { "source": "Heroku", "target": "Ruby" }, 301 | { "source": "JSON", "target": "Python" }, 302 | { "source": "JSON", "target": "jq" }, 303 | { "source": "Java", "target": "Kotlin" }, 304 | { "source": "Java", "target": "Tomcat" }, 305 | { "source": "Java", "target": "java8" }, 306 | { "source": "Java", "target": "初心者" }, 307 | { "source": "JavaScript", "target": "Node.js" }, 308 | { "source": "JavaScript", "target": "React" }, 309 | { "source": "JavaScript", "target": "Twitter" }, 310 | { "source": "JavaScript", "target": "TypeScript" }, 311 | { "source": "JavaScript", "target": "Vue.js" }, 312 | { "source": "JavaScript", "target": "async" }, 313 | { "source": "JavaScript", "target": "canvas" }, 314 | { "source": "JavaScript", "target": "es2015" }, 315 | { "source": "JavaScript", "target": "iOS" }, 316 | { "source": "JavaScript", "target": "jQuery" }, 317 | { "source": "JavaScript", "target": "reactnative" }, 318 | { "source": "JavaScript", "target": "spreadsheet" }, 319 | { "source": "JavaScript", "target": "webpack" }, 320 | { "source": "JavaScript", "target": "初心者" }, 321 | { "source": "JavaScript", "target": "初心者向け" }, 322 | { "source": "JavaScript", "target": "本の勉強" }, 323 | { "source": "Jupyter", "target": "Python" }, 324 | { "source": "Jupyter", "target": "Python3" }, 325 | { "source": "Jupyter", "target": "Windows" }, 326 | { "source": "Kaggle", "target": "Python" }, 327 | { "source": "Keras", "target": "Python" }, 328 | { "source": "Keras", "target": "機械学習" }, 329 | { "source": "Kivy", "target": "Python" }, 330 | { "source": "LINEmessagingAPI", "target": "Line" }, 331 | { "source": "LINEmessagingAPI", "target": "Python" }, 332 | { "source": "LINEmessagingAPI", "target": "linebot" }, 333 | { "source": "Laravel", "target": "PHP" }, 334 | { "source": "Laravel", "target": "初心者" }, 335 | { "source": "Line", "target": "Python" }, 336 | { "source": "Line", "target": "linebot" }, 337 | { "source": "Linux", "target": "Linuxコマンド" }, 338 | { "source": "Linux", "target": "Mac" }, 339 | { "source": "Linux", "target": "Python" }, 340 | { "source": "Linux", "target": "Ubuntu" }, 341 | { "source": "Linux", "target": "量子コンピュータ" }, 342 | { "source": "Mac", "target": "Python" }, 343 | { "source": "Mac", "target": "Vagrant" }, 344 | { "source": "Mac", "target": "VirtualBox" }, 345 | { "source": "Mac", "target": "homebrew" }, 346 | { "source": "Mac", "target": "環境構築" }, 347 | { "source": "MacOSX", "target": "PostgreSQL" }, 348 | { "source": "MacOSX", "target": "Python" }, 349 | { "source": "MacOSX", "target": "homebrew" }, 350 | { "source": "MachineLearning", "target": "Python" }, 351 | { "source": "MachineLearning", "target": "データサイエンス" }, 352 | { "source": "MachineLearning", "target": "数学" }, 353 | { "source": "MachineLearning", "target": "機械学習" }, 354 | { "source": "Markdown", "target": "VSCode" }, 355 | { "source": "MySQL", "target": "SQL" }, 356 | { "source": "MySQL", "target": "データベース" }, 357 | { "source": "NLP", "target": "自然言語処理" }, 358 | { "source": "Node.js", "target": "TypeScript" }, 359 | { "source": "Office365", "target": "Outlook" }, 360 | { "source": "Office365", "target": "PowerApps" }, 361 | { "source": "OracleDatabase", "target": "oracle12c" }, 362 | { "source": "PHP", "target": "WordPress" }, 363 | { "source": "PHP", "target": "初心者" }, 364 | { "source": "PWA", "target": "iOS" }, 365 | { "source": "PowerShell", "target": "Windows" }, 366 | { "source": "Python", "target": "Python3" }, 367 | { "source": "Python", "target": "Quantx" }, 368 | { "source": "Python", "target": "R" }, 369 | { "source": "Python", "target": "RaspberryPi" }, 370 | { "source": "Python", "target": "Ruby" }, 371 | { "source": "Python", "target": "Windows" }, 372 | { "source": "Python", "target": "api" }, 373 | { "source": "Python", "target": "homebrew" }, 374 | { "source": "Python", "target": "linebot" }, 375 | { "source": "Python", "target": "matplotlib" }, 376 | { "source": "Python", "target": "numpy" }, 377 | { "source": "Python", "target": "pyenv" }, 378 | { "source": "Python", "target": "初心者" }, 379 | { "source": "Python", "target": "機械学習" }, 380 | { "source": "Python", "target": "自然言語処理" }, 381 | { "source": "Python", "target": "量子コンピュータ" }, 382 | { "source": "Python3", "target": "Quantx" }, 383 | { "source": "Python3", "target": "初心者" }, 384 | { "source": "Python3", "target": "機械学習" }, 385 | { "source": "ROS", "target": "rviz" }, 386 | { "source": "RSpec", "target": "Rails" }, 387 | { "source": "RSpec", "target": "Ruby" }, 388 | { "source": "Rails", "target": "Rails5" }, 389 | { "source": "Rails", "target": "Ruby" }, 390 | { "source": "Rails", "target": "Vue.js" }, 391 | { "source": "Rails", "target": "bundler" }, 392 | { "source": "Rails", "target": "jQuery" }, 393 | { "source": "Rails", "target": "初心者" }, 394 | { "source": "Rails5", "target": "Ruby" }, 395 | { "source": "React", "target": "TypeScript" }, 396 | { "source": "React", "target": "redux" }, 397 | { "source": "Ruby", "target": "bundler" }, 398 | { "source": "Ruby", "target": "初心者" }, 399 | { "source": "Rust", "target": "競プロ参戦記" }, 400 | { "source": "Rust", "target": "競技プログラミング" }, 401 | { "source": "SecurityGroup", "target": "workspaces" }, 402 | { "source": "ServerlessFramework", "target": "lambda" }, 403 | { "source": "Shader", "target": "Unity" }, 404 | { "source": "Slack", "target": "slack-api" }, 405 | { "source": "Slack", "target": "slackbot" }, 406 | { "source": "Swift", "target": "Xcode" }, 407 | { "source": "Swift", "target": "iOS" }, 408 | { "source": "TPC-H", "target": "neo4j" }, 409 | { "source": "TPC-H", "target": "tpcc-mysql" }, 410 | { "source": "TensorFlow", "target": "機械学習" }, 411 | { "source": "TypeScript", "target": "Vue.js" }, 412 | { "source": "TypeScript", "target": "apollo" }, 413 | { "source": "Ubuntu", "target": "WSL" }, 414 | { "source": "Unity", "target": "Unity3D" }, 415 | { "source": "Unity", "target": "モノビットエンジン" }, 416 | { "source": "Unity", "target": "リアルタイム通信" }, 417 | { "source": "Unity", "target": "初心者" }, 418 | { "source": "VBA", "target": "マクロ" }, 419 | { "source": "VBA", "target": "数値計算" }, 420 | { "source": "VSCode", "target": "VisualStudioCode" }, 421 | { "source": "VSCode", "target": "Windows" }, 422 | { "source": "Vagrant", "target": "VirtualBox" }, 423 | { "source": "Vue.js", "target": "Web" }, 424 | { "source": "Vue.js", "target": "nuxt.js" }, 425 | { "source": "Vue.js", "target": "vue-cli" }, 426 | { "source": "Web", "target": "vue-cli" }, 427 | { "source": "Xcode", "target": "iOS" }, 428 | { "source": "canvas", "target": "es2015" }, 429 | { "source": "gcp", "target": "kubernetes" }, 430 | { "source": "jQuery", "target": "初心者" }, 431 | { "source": "java8", "target": "競技プログラミング" }, 432 | { "source": "minishift", "target": "openshift" }, 433 | { "source": "neo4j", "target": "tpcc-mysql" }, 434 | { "source": "nextcloud", "target": "nginx" }, 435 | { "source": "pandas", "target": "pandas-profiling" }, 436 | { "source": "pandas", "target": "データ分析" }, 437 | { "source": "pandas", "target": "データ可視化" }, 438 | { "source": "pandas-profiling", "target": "データ分析" }, 439 | { "source": "pandas-profiling", "target": "データ可視化" }, 440 | { "source": "slack-api", "target": "slackbot" }, 441 | { "source": "データサイエンス", "target": "データ分析" }, 442 | { "source": "データサイエンス", "target": "数学" }, 443 | { "source": "データサイエンス", "target": "機械学習" }, 444 | { "source": "データ分析", "target": "データ可視化" }, 445 | { "source": "データ解析", "target": "マーケティング" }, 446 | { "source": "プログラミング", "target": "初心者" }, 447 | { "source": "マクロ", "target": "数値計算" }, 448 | { "source": "モノビットエンジン", "target": "リアルタイム通信" }, 449 | { "source": "令和", "target": "新元号" }, 450 | { "source": "初心者", "target": "初心者向け" }, 451 | { "source": "初心者", "target": "新人プログラマ応援" }, 452 | { "source": "初心者", "target": "本の勉強" }, 453 | { "source": "応用情報技術者試験", "target": "資格" }, 454 | { "source": "数学", "target": "機械学習" }, 455 | { "source": "機械学習", "target": "自然言語処理" }, 456 | { "source": "競プロ参戦記", "target": "競技プログラミング" }, 457 | { "source": "量子アニーリング", "target": "量子コンピュータ" }, 458 | { "source": "量子コンピュータ", "target": "量子力学" } 459 | ] 460 | } 461 | -------------------------------------------------------------------------------- /public/data/lesson09-output.json: -------------------------------------------------------------------------------- 1 | { 2 | "children": [ 3 | { 4 | "name": "経済産業省", 5 | "children": [ 6 | { 7 | "name": "資源エネルギー庁 資源・燃料部", 8 | "children": [ 9 | { "name": "石油精製備蓄課", "count": 16 }, 10 | { "name": "石油流通課", "count": 14 }, 11 | { "name": "その他", "count": 22 } 12 | ] 13 | }, 14 | { 15 | "name": "産業技術環境局", 16 | "children": [{ "name": "その他", "count": 49 }] 17 | }, 18 | { 19 | "name": "資源エネルギー庁", 20 | "children": [{ "name": "その他", "count": 48 }] 21 | }, 22 | { 23 | "name": "製造産業局", 24 | "children": [{ "name": "その他", "count": 47 }] 25 | }, 26 | { 27 | "name": "資源エネルギー庁\n省エネルギー・新エネルギー部", 28 | "children": [ 29 | { "name": "新エネルギー課", "count": 17 }, 30 | { "name": "その他", "count": 24 } 31 | ] 32 | }, 33 | { "name": "特許庁", "children": [{ "name": "その他", "count": 41 }] }, 34 | { 35 | "name": "商務・サービスグループ", 36 | "children": [{ "name": "その他", "count": 28 }] 37 | }, 38 | { 39 | "name": "商務情報政策局", 40 | "children": [{ "name": "その他", "count": 26 }] 41 | }, 42 | { 43 | "name": "中小企業庁", 44 | "children": [{ "name": "その他", "count": 23 }] 45 | }, 46 | { 47 | "name": "通商政策局", 48 | "children": [{ "name": "その他", "count": 15 }] 49 | }, 50 | { 51 | "name": "貿易経済協力局", 52 | "children": [{ "name": "その他", "count": 12 }] 53 | }, 54 | { "name": "その他", "count": 109 } 55 | ] 56 | }, 57 | { 58 | "name": "文部科学省", 59 | "children": [ 60 | { 61 | "name": "総合教育政策局", 62 | "children": [ 63 | { "name": "地域学習推進課", "count": 15 }, 64 | { "name": "生涯学習推進課", "count": 14 }, 65 | { "name": "調査企画課", "count": 13 }, 66 | { "name": "その他", "count": 29 } 67 | ] 68 | }, 69 | { 70 | "name": "初等中等教育局", 71 | "children": [{ "name": "その他", "count": 65 }] 72 | }, 73 | { 74 | "name": "文化庁", 75 | "children": [ 76 | { "name": "企画調整課", "count": 15 }, 77 | { "name": "その他", "count": 50 } 78 | ] 79 | }, 80 | { 81 | "name": "研究開発局", 82 | "children": [ 83 | { "name": "原子力課", "count": 15 }, 84 | { "name": "その他", "count": 40 } 85 | ] 86 | }, 87 | { 88 | "name": "高等教育局", 89 | "children": [ 90 | { "name": "学生・留学生課", "count": 14 }, 91 | { "name": "その他", "count": 39 } 92 | ] 93 | }, 94 | { 95 | "name": "スポーツ庁", 96 | "children": [{ "name": "その他", "count": 53 }] 97 | }, 98 | { 99 | "name": "科学技術・学術政策局", 100 | "children": [{ "name": "その他", "count": 36 }] 101 | }, 102 | { 103 | "name": "研究振興局", 104 | "children": [{ "name": "その他", "count": 34 }] 105 | }, 106 | { 107 | "name": "大臣官房国際課", 108 | "children": [ 109 | { "name": "大臣官房国際課", "count": 12 }, 110 | { "name": "その他", "count": 0 } 111 | ] 112 | }, 113 | { "name": "その他", "count": 35 } 114 | ] 115 | }, 116 | { 117 | "name": "総務省", 118 | "children": [ 119 | { 120 | "name": "情報流通行政局", 121 | "children": [{ "name": "その他", "count": 61 }] 122 | }, 123 | { 124 | "name": "自治行政局", 125 | "children": [{ "name": "その他", "count": 32 }] 126 | }, 127 | { 128 | "name": "国際戦略局", 129 | "children": [{ "name": "その他", "count": 28 }] 130 | }, 131 | { 132 | "name": "総合通信基盤局", 133 | "children": [{ "name": "その他", "count": 24 }] 134 | }, 135 | { "name": "その他", "count": 79 } 136 | ] 137 | } 138 | ] 139 | } 140 | -------------------------------------------------------------------------------- /public/data/size-and-weight.json: -------------------------------------------------------------------------------- 1 | [ 2 | { "name": "宇内 歓行", "gender": "男性", "y": 183.87, "x": 85.54 }, 3 | { 4 | "name": "大小原 康幸", 5 | "gender": "男性", 6 | "y": 179.54, 7 | "x": 80.94 8 | }, 9 | { "name": "朝永 孝幸", "gender": "男性", "y": 173.62, "x": 72.99 }, 10 | { 11 | "name": "瀬治山 啓之", 12 | "gender": "男性", 13 | "y": 167.83, 14 | "x": 62.86 15 | }, 16 | { 17 | "name": "時川 音日好", 18 | "gender": "男性", 19 | "y": 174.38, 20 | "x": 75.47 21 | }, 22 | { "name": "木幡 英朗", "gender": "男性", "y": 171.38, "x": 68.83 }, 23 | { "name": "錦織 賢朗", "gender": "男性", "y": 171.1, "x": 68.51 }, 24 | { 25 | "name": "下八川 欽也", 26 | "gender": "男性", 27 | "y": 169.39, 28 | "x": 66.44 29 | }, 30 | { 31 | "name": "五艘 喜多男", 32 | "gender": "男性", 33 | "y": 174.26, 34 | "x": 74.05 35 | }, 36 | { "name": "瀬良田 好次", "gender": "男性", "y": 171.87, "x": 70.4 }, 37 | { "name": "羽深 経志", "gender": "男性", "y": 163.64, "x": 57.51 }, 38 | { "name": "国光 国造", "gender": "男性", "y": 166.51, "x": 60.41 }, 39 | { "name": "漁 可喜", "gender": "男性", "y": 157.39, "x": 50.34 }, 40 | { "name": "赤目 育国", "gender": "男性", "y": 167.17, "x": 62.03 }, 41 | { "name": "中國 匡勝", "gender": "男性", "y": 168.36, "x": 63.11 }, 42 | { "name": "織原 好弘", "gender": "男性", "y": 161.17, "x": 55.65 }, 43 | { "name": "平栗 光洋", "gender": "男性", "y": 169.75, "x": 67.04 }, 44 | { "name": "肆矢 恭徳", "gender": "男性", "y": 166.97, "x": 61.4 }, 45 | { "name": "師星 克恵", "gender": "男性", "y": 166.95, "x": 60.61 }, 46 | { "name": "釘沢 栄雄", "gender": "男性", "y": 168.87, "x": 64.44 }, 47 | { "name": "道姓 益蔵", "gender": "男性", "y": 171.5, "x": 69.4 }, 48 | { "name": "以倉 幸保", "gender": "男性", "y": 164.45, "x": 57.81 }, 49 | { "name": "築林 喜先", "gender": "男性", "y": 171.39, "x": 68.85 }, 50 | { "name": "塒 広利", "gender": "男性", "y": 166.47, "x": 60.1 }, 51 | { "name": "横澗 兼継", "gender": "男性", "y": 174.26, "x": 73.75 }, 52 | { "name": "高頭 共二", "gender": "男性", "y": 157.47, "x": 52.44 }, 53 | { "name": "栢原 康二", "gender": "男性", "y": 170.04, "x": 67.44 }, 54 | { "name": "角海 喜朗", "gender": "男性", "y": 177.86, "x": 80.44 }, 55 | { "name": "古城 弘雄", "gender": "男性", "y": 168.76, "x": 63.89 }, 56 | { "name": "御供 晃光", "gender": "男性", "y": 171.47, "x": 69.26 }, 57 | { "name": "藤部 浩受", "gender": "男性", "y": 180.18, "x": 82.35 }, 58 | { 59 | "name": "集貝 希久夫", 60 | "gender": "男性", 61 | "y": 188.11, 62 | "x": 86.87 63 | }, 64 | { "name": "筆坂 綱太", "gender": "男性", "y": 174.49, "x": 75.56 }, 65 | { "name": "広多 恭子", "gender": "男性", "y": 167.6, "x": 62.57 }, 66 | { "name": "猿向 康世", "gender": "男性", "y": 175.1, "x": 77.07 }, 67 | { "name": "徳三 康介", "gender": "男性", "y": 173.09, "x": 72.17 }, 68 | { 69 | "name": "石嶺 健志朗", 70 | "gender": "男性", 71 | "y": 166.99, 72 | "x": 61.74 73 | }, 74 | { "name": "樽床 佐敏", "gender": "男性", "y": 163.45, "x": 56.98 }, 75 | { "name": "百足 源蔵", "gender": "男性", "y": 175.07, "x": 76.4 }, 76 | { "name": "流光 晃", "gender": "男性", "y": 179.57, "x": 81.64 }, 77 | { 78 | "name": "勇内山 建蔵", 79 | "gender": "男性", 80 | "y": 172.93, 81 | "x": 72.14 82 | }, 83 | { "name": "軽部 浩雅", "gender": "男性", "y": 162.1, "x": 56.51 }, 84 | { "name": "坂大 献志", "gender": "男性", "y": 167.87, "x": 62.94 }, 85 | { 86 | "name": "大兼政 憲通", 87 | "gender": "男性", 88 | "y": 166.11, 89 | "x": 59.61 90 | }, 91 | { "name": "火焚 恒弥", "gender": "男性", "y": 169.74, "x": 66.62 }, 92 | { "name": "安福 克至", "gender": "男性", "y": 179.61, "x": 81.82 }, 93 | { "name": "沖世 久也", "gender": "男性", "y": 169.33, "x": 66.28 }, 94 | { 95 | "name": "四十物谷 弘聡", 96 | "gender": "男性", 97 | "y": 167.13, 98 | "x": 61.78 99 | }, 100 | { "name": "宮成 義文", "gender": "男性", "y": 172.43, "x": 71.55 }, 101 | { "name": "王田 康輔", "gender": "男性", "y": 156.9, "x": 48.63 }, 102 | { 103 | "name": "東恩納 桂之輔", 104 | "gender": "男性", 105 | "y": 166.85, 106 | "x": 60.59 107 | }, 108 | { "name": "済陽 久作", "gender": "男性", "y": 176.78, "x": 78.66 }, 109 | { "name": "賀来 志年", "gender": "男性", "y": 168.87, "x": 64.39 }, 110 | { "name": "権頭 啓吉", "gender": "男性", "y": 172.09, "x": 70.85 }, 111 | { "name": "築地 広夫", "gender": "男性", "y": 163.19, "x": 56.76 }, 112 | { "name": "余多分 謙一", "gender": "男性", "y": 170.68, "x": 67.9 }, 113 | { "name": "関東 幸博", "gender": "男性", "y": 165.8, "x": 58.29 }, 114 | { "name": "柏谷 啓紀", "gender": "男性", "y": 167.49, "x": 62.21 }, 115 | { "name": "竹知 国助", "gender": "男性", "y": 172.36, "x": 70.87 }, 116 | { 117 | "name": "五郎川 浩由喜", 118 | "gender": "男性", 119 | "y": 175.14, 120 | "x": 77.38 121 | }, 122 | { "name": "京 儀利", "gender": "男性", "y": 168.21, "x": 63.06 }, 123 | { "name": "藏留 宏章", "gender": "男性", "y": 171.98, "x": 70.44 }, 124 | { "name": "靍羽 輝宣", "gender": "男性", "y": 169.06, "x": 64.85 }, 125 | { 126 | "name": "日賀良 啓敬", 127 | "gender": "男性", 128 | "y": 172.27, 129 | "x": 70.85 130 | }, 131 | { "name": "高遠 嘉倫", "gender": "男性", "y": 165.62, "x": 58.21 }, 132 | { "name": "小立 光樹", "gender": "男性", "y": 159.62, "x": 53.05 }, 133 | { "name": "深海 記弘", "gender": "男性", "y": 175.56, "x": 77.77 }, 134 | { "name": "国方 市造", "gender": "男性", "y": 167.33, "x": 62.18 }, 135 | { "name": "道上 久仁", "gender": "男性", "y": 174.21, "x": 73.1 }, 136 | { 137 | "name": "桜ヶ平 輝高", 138 | "gender": "男性", 139 | "y": 160.95, 140 | "x": 54.45 141 | }, 142 | { 143 | "name": "大田和 紀太男", 144 | "gender": "男性", 145 | "y": 171.03, 146 | "x": 67.97 147 | }, 148 | { 149 | "name": "俵積田 士朗", 150 | "gender": "男性", 151 | "y": 176.68, 152 | "x": 78.08 153 | }, 154 | { "name": "塘岡 行平", "gender": "男性", "y": 169.21, "x": 65.09 }, 155 | { "name": "西丸 英器", "gender": "男性", "y": 165.41, "x": 58.07 }, 156 | { "name": "向野 馨二", "gender": "男性", "y": 175.09, "x": 76.44 }, 157 | { "name": "八柳 光純", "gender": "男性", "y": 173.51, "x": 72.2 }, 158 | { "name": "永春 宜志", "gender": "男性", "y": 169.32, "x": 66.01 }, 159 | { "name": "司 英桐", "gender": "男性", "y": 161.48, "x": 56.09 }, 160 | { 161 | "name": "豆腐谷 雅重", 162 | "gender": "男性", 163 | "y": 162.84, 164 | "x": 56.63 165 | }, 166 | { 167 | "name": "川の上 吉照", 168 | "gender": "男性", 169 | "y": 172.53, 170 | "x": 71.63 171 | }, 172 | { 173 | "name": "音堂 三太朗", 174 | "gender": "男性", 175 | "y": 172.77, 176 | "x": 71.63 177 | }, 178 | { "name": "阿武 好洋", "gender": "男性", "y": 168.81, "x": 63.97 }, 179 | { "name": "川和 憲靖", "gender": "男性", "y": 168.98, "x": 64.84 }, 180 | { "name": "蓬生 幹行", "gender": "男性", "y": 157.63, "x": 52.51 }, 181 | { "name": "行田 剛保", "gender": "男性", "y": 156.7, "x": 47.32 }, 182 | { "name": "渡津 乙彦", "gender": "男性", "y": 168.85, "x": 64.34 }, 183 | { "name": "折尾 宏二", "gender": "男性", "y": 171.73, "x": 70.31 }, 184 | { "name": "木邑 威夫", "gender": "男性", "y": 170.22, "x": 67.65 }, 185 | { "name": "閑歳 維美", "gender": "男性", "y": 161.12, "x": 55.38 }, 186 | { "name": "砦上 学人", "gender": "男性", "y": 166.76, "x": 60.46 }, 187 | { "name": "後嵩西 賀道", "gender": "男性", "y": 169.44, "x": 66.5 }, 188 | { "name": "壁谷 宜修", "gender": "男性", "y": 177.71, "x": 79.35 }, 189 | { 190 | "name": "久志本 菊太朗", 191 | "gender": "男性", 192 | "y": 159.88, 193 | "x": 53.96 194 | }, 195 | { "name": "馬木 旨二", "gender": "男性", "y": 172.37, "x": 71.0 }, 196 | { "name": "守 佳是", "gender": "男性", "y": 165.54, "x": 58.18 }, 197 | { "name": "西海 幹", "gender": "男性", "y": 163.48, "x": 57.04 }, 198 | { "name": "仲井戸 暁紀", "gender": "男性", "y": 166.8, "x": 60.56 }, 199 | { "name": "六山 元紀", "gender": "男性", "y": 172.89, "x": 71.68 }, 200 | { 201 | "name": "長曽我部 意継", 202 | "gender": "男性", 203 | "y": 177.63, 204 | "x": 79.05 205 | }, 206 | { "name": "北隅 欣己", "gender": "男性", "y": 169.74, "x": 66.78 }, 207 | { 208 | "name": "西井 多紀子", 209 | "gender": "女性", 210 | "y": 161.34, 211 | "x": 52.93 212 | }, 213 | { "name": "新山 実花", "gender": "女性", "y": 153.25, "x": 47.32 }, 214 | { "name": "磯田 月子", "gender": "女性", "y": 153.91, "x": 47.85 }, 215 | { "name": "船戸 綾音", "gender": "女性", "y": 166.32, "x": 58.69 }, 216 | { 217 | "name": "金杉 たまこ", 218 | "gender": "女性", 219 | "y": 152.31, 220 | "x": 45.99 221 | }, 222 | { "name": "岡井 萌香", "gender": "女性", "y": 158.3, "x": 50.89 }, 223 | { "name": "田代 雅代", "gender": "女性", "y": 169.22, "x": 60.46 }, 224 | { 225 | "name": "東谷 あずさ", 226 | "gender": "女性", 227 | "y": 150.69, 228 | "x": 42.01 229 | }, 230 | { "name": "須原 弘子", "gender": "女性", "y": 155.69, "x": 49.13 }, 231 | { "name": "角本 愛", "gender": "女性", "y": 166.87, "x": 59.18 }, 232 | { "name": "新名 郁絵", "gender": "女性", "y": 152.56, "x": 46.67 }, 233 | { 234 | "name": "牛丸 ゆきみ", 235 | "gender": "女性", 236 | "y": 148.82, 237 | "x": 38.42 238 | }, 239 | { "name": "箱崎 和奏", "gender": "女性", "y": 157.49, "x": 50.75 }, 240 | { "name": "木南 えり", "gender": "女性", "y": 163.07, "x": 54.74 }, 241 | { 242 | "name": "竹口 あやり", 243 | "gender": "女性", 244 | "y": 159.48, 245 | "x": 52.29 246 | }, 247 | { "name": "萩本 櫻", "gender": "女性", "y": 151.43, "x": 43.88 }, 248 | { "name": "渡壁 月絵", "gender": "女性", "y": 161.31, "x": 52.92 }, 249 | { 250 | "name": "勅使河原 みやこ", 251 | "gender": "女性", 252 | "y": 162.14, 253 | "x": 53.41 254 | }, 255 | { "name": "萩田 若子", "gender": "女性", "y": 152.89, "x": 46.97 }, 256 | { "name": "駒形 瑠璃花", "gender": "女性", "y": 158.7, "x": 50.95 }, 257 | { "name": "蜷川 遙奈", "gender": "女性", "y": 154.13, "x": 48.0 }, 258 | { 259 | "name": "後閑 まりえ", 260 | "gender": "女性", 261 | "y": 165.29, 262 | "x": 57.97 263 | }, 264 | { 265 | "name": "奥田 満智子", 266 | "gender": "女性", 267 | "y": 161.04, 268 | "x": 52.91 269 | }, 270 | { 271 | "name": "竹村 英美里", 272 | "gender": "女性", 273 | "y": 153.74, 274 | "x": 47.46 275 | }, 276 | { "name": "宮西 朱里", "gender": "女性", "y": 161.87, "x": 53.18 }, 277 | { "name": "吉谷 雅江", "gender": "女性", "y": 153.76, "x": 47.57 }, 278 | { 279 | "name": "千葉 華緒理", 280 | "gender": "女性", 281 | "y": 149.15, 282 | "x": 41.84 283 | }, 284 | { "name": "関田 市子", "gender": "女性", "y": 163.66, "x": 55.53 }, 285 | { 286 | "name": "玉那覇 ひふみ", 287 | "gender": "女性", 288 | "y": 163.91, 289 | "x": 56.21 290 | }, 291 | { "name": "宮﨑 今日子", "gender": "女性", "y": 157.77, "x": 50.8 }, 292 | { "name": "青柳 初妃", "gender": "女性", "y": 154.35, "x": 48.44 }, 293 | { "name": "今津 理子", "gender": "女性", "y": 171.72, "x": 63.65 }, 294 | { "name": "坂東 文音", "gender": "女性", "y": 158.86, "x": 51.48 }, 295 | { "name": "赤尾 華絵", "gender": "女性", "y": 153.08, "x": 47.31 }, 296 | { "name": "相場 花凛", "gender": "女性", "y": 142.86, "x": 29.73 }, 297 | { "name": "粂 美緒", "gender": "女性", "y": 152.31, "x": 46.22 }, 298 | { 299 | "name": "広沢 穂乃香", 300 | "gender": "女性", 301 | "y": 160.57, 302 | "x": 52.67 303 | }, 304 | { "name": "淡路 冴子", "gender": "女性", "y": 152.12, "x": 45.47 }, 305 | { "name": "黒瀬 元子", "gender": "女性", "y": 161.44, "x": 53.06 }, 306 | { "name": "市原 花音", "gender": "女性", "y": 162.97, "x": 54.49 }, 307 | { "name": "小針 絵里", "gender": "女性", "y": 156.02, "x": 49.71 }, 308 | { "name": "大坪 真凛", "gender": "女性", "y": 147.88, "x": 36.11 }, 309 | { "name": "浅川 里加", "gender": "女性", "y": 165.11, "x": 57.04 }, 310 | { "name": "斉木 璃央", "gender": "女性", "y": 165.19, "x": 57.52 }, 311 | { "name": "武部 朝歌", "gender": "女性", "y": 160.99, "x": 52.79 }, 312 | { "name": "花木 理恵", "gender": "女性", "y": 172.32, "x": 63.8 }, 313 | { "name": "岩田 清香", "gender": "女性", "y": 157.26, "x": 50.1 }, 314 | { "name": "三島 砂月", "gender": "女性", "y": 161.79, "x": 53.13 }, 315 | { "name": "興梠 南月", "gender": "女性", "y": 156.02, "x": 49.67 }, 316 | { "name": "浅子 琴雪", "gender": "女性", "y": 161.78, "x": 53.08 }, 317 | { 318 | "name": "細山 真名美", 319 | "gender": "女性", 320 | "y": 160.87, 321 | "x": 52.79 322 | }, 323 | { "name": "新津 桐香", "gender": "女性", "y": 163.43, "x": 55.02 }, 324 | { "name": "臼杵 貴子", "gender": "女性", "y": 152.09, "x": 45.06 }, 325 | { "name": "川上 円香", "gender": "女性", "y": 160.28, "x": 52.51 }, 326 | { "name": "平松 湖春", "gender": "女性", "y": 155.54, "x": 49.07 }, 327 | { "name": "久永 鮎夏", "gender": "女性", "y": 155.7, "x": 49.49 }, 328 | { "name": "天池 珠江", "gender": "女性", "y": 153.6, "x": 47.44 }, 329 | { "name": "溝江 桜", "gender": "女性", "y": 170.88, "x": 63.3 }, 330 | { "name": "光永 楓", "gender": "女性", "y": 163.61, "x": 55.05 }, 331 | { "name": "寺町 桃絵", "gender": "女性", "y": 157.44, "x": 50.71 }, 332 | { 333 | "name": "増谷 ちさと", 334 | "gender": "女性", 335 | "y": 155.15, 336 | "x": 49.03 337 | }, 338 | { 339 | "name": "尾田 夕美子", 340 | "gender": "女性", 341 | "y": 163.11, 342 | "x": 54.91 343 | }, 344 | { "name": "伊庭 歌菜", "gender": "女性", "y": 162.16, "x": 54.05 }, 345 | { 346 | "name": "浅利 みすみ", 347 | "gender": "女性", 348 | "y": 158.93, 349 | "x": 52.05 350 | }, 351 | { "name": "相澤 蒼", "gender": "女性", "y": 155.75, "x": 49.56 }, 352 | { "name": "有我 絹絵", "gender": "女性", "y": 160.2, "x": 52.43 }, 353 | { "name": "橋場 のりか", "gender": "女性", "y": 165.0, "x": 56.95 }, 354 | { "name": "針谷 郁花", "gender": "女性", "y": 151.44, "x": 44.36 }, 355 | { "name": "春日 晶子", "gender": "女性", "y": 169.34, "x": 60.69 }, 356 | { 357 | "name": "石津 かなみ", 358 | "gender": "女性", 359 | "y": 175.19, 360 | "x": 65.73 361 | }, 362 | { "name": "沢村 章恵", "gender": "女性", "y": 167.62, "x": 59.77 }, 363 | { 364 | "name": "菅沢 ことみ", 365 | "gender": "女性", 366 | "y": 162.15, 367 | "x": 53.99 368 | }, 369 | { 370 | "name": "奈良 こよみ", 371 | "gender": "女性", 372 | "y": 155.95, 373 | "x": 49.59 374 | }, 375 | { "name": "荒田 恵子", "gender": "女性", "y": 163.93, "x": 56.58 }, 376 | { 377 | "name": "中薗 せりか", 378 | "gender": "女性", 379 | "y": 163.88, 380 | "x": 55.63 381 | }, 382 | { "name": "朝川 成見", "gender": "女性", "y": 165.06, "x": 57.04 }, 383 | { 384 | "name": "本宮 絵里香", 385 | "gender": "女性", 386 | "y": 158.04, 387 | "x": 50.81 388 | }, 389 | { "name": "尾本 三鈴", "gender": "女性", "y": 159.32, "x": 52.23 }, 390 | { "name": "青沼 雪子", "gender": "女性", "y": 151.38, "x": 42.76 }, 391 | { "name": "菰田 育花", "gender": "女性", "y": 168.53, "x": 59.9 }, 392 | { "name": "右田 晶", "gender": "女性", "y": 156.97, "x": 49.97 }, 393 | { "name": "武蔵 遙香", "gender": "女性", "y": 150.87, "x": 42.05 }, 394 | { "name": "愛甲 華蓮", "gender": "女性", "y": 157.63, "x": 50.79 }, 395 | { "name": "藤堂 範子", "gender": "女性", "y": 158.93, "x": 51.64 }, 396 | { "name": "曾根 観音", "gender": "女性", "y": 154.98, "x": 48.72 }, 397 | { "name": "古池 早姫", "gender": "女性", "y": 154.8, "x": 48.67 }, 398 | { "name": "野添 理香", "gender": "女性", "y": 152.68, "x": 46.81 }, 399 | { "name": "芳田 佳恵", "gender": "女性", "y": 162.32, "x": 54.08 }, 400 | { 401 | "name": "大角 ひより", 402 | "gender": "女性", 403 | "y": 151.36, 404 | "x": 42.52 405 | }, 406 | { "name": "門口 青葉", "gender": "女性", "y": 156.14, "x": 49.73 }, 407 | { "name": "行方 沙彩", "gender": "女性", "y": 151.75, "x": 44.42 }, 408 | { 409 | "name": "岡上 いつき", 410 | "gender": "女性", 411 | "y": 156.83, 412 | "x": 49.86 413 | }, 414 | { "name": "作田 鮎子", "gender": "女性", "y": 153.08, "x": 47.09 }, 415 | { "name": "立木 紗彩", "gender": "女性", "y": 156.21, "x": 49.83 }, 416 | { "name": "宮良 咲子", "gender": "女性", "y": 166.9, "x": 59.19 }, 417 | { "name": "永木 文代", "gender": "女性", "y": 165.62, "x": 58.19 }, 418 | { "name": "奧原 球子", "gender": "女性", "y": 152.4, "x": 46.42 }, 419 | { 420 | "name": "菅田 花里奈", 421 | "gender": "女性", 422 | "y": 163.24, 423 | "x": 54.93 424 | }, 425 | { "name": "西堀 月穂", "gender": "女性", "y": 161.39, "x": 53.05 }, 426 | { "name": "若生 律子", "gender": "女性", "y": 152.28, "x": 45.76 } 427 | ] 428 | -------------------------------------------------------------------------------- /public/data/topic-graph.json: -------------------------------------------------------------------------------- 1 | { 2 | "nodes": [ 3 | { "frequency": 742, "id": "nuclearjp" }, 4 | { "frequency": 14493, "id": "genpatsu" }, 5 | { "frequency": 660, "id": "fukunp" }, 6 | { "frequency": 358, "id": "kaminoseki" }, 7 | { "frequency": 455, "id": "放射能汚染" }, 8 | { "frequency": 4079, "id": "脱原発" }, 9 | { "frequency": 3820, "id": "放射能" }, 10 | { "frequency": 11485, "id": "原発" }, 11 | { "frequency": 187, "id": "被爆" }, 12 | { "frequency": 982, "id": "nuclearJP" }, 13 | { "frequency": 2738, "id": "反原発" }, 14 | { "frequency": 2007, "id": "東電" }, 15 | { "frequency": 112, "id": "食品汚染" }, 16 | { "frequency": 112, "id": "震災" }, 17 | { "frequency": 262, "id": "セシウム" }, 18 | { "frequency": 417, "id": "fpaj" }, 19 | { "frequency": 3197, "id": "save_fukushima" }, 20 | { "frequency": 3588, "id": "genpatu" }, 21 | { "frequency": 1060, "id": "nicojishin" }, 22 | { "frequency": 6141, "id": "jishin" }, 23 | { "frequency": 3049, "id": "nhk_news" }, 24 | { "frequency": 3899, "id": "nhk" }, 25 | { "frequency": 345, "id": "nikkei" }, 26 | { "frequency": 328, "id": "googlenewsjp" }, 27 | { "frequency": 756, "id": "ldnews" }, 28 | { "frequency": 904, "id": "news" }, 29 | { "frequency": 312, "id": "ニュース" }, 30 | { "frequency": 968, "id": "再稼働反対" }, 31 | { "frequency": 404, "id": "ntv" }, 32 | { "frequency": 479, "id": "ge" }, 33 | { "frequency": 1871, "id": "hibaku" }, 34 | { "frequency": 566, "id": "nonukes" }, 35 | { "frequency": 207, "id": "311animal" }, 36 | { "frequency": 253, "id": "yokohama" }, 37 | { "frequency": 4157, "id": "fukushima" }, 38 | { "frequency": 718, "id": "Japan" }, 39 | { "frequency": 488, "id": "gen" }, 40 | { "frequency": 102, "id": "福島市" }, 41 | { "frequency": 1993, "id": "被曝" }, 42 | { "frequency": 284, "id": "CHIBAREI" }, 43 | { "frequency": 604, "id": "nicohou" }, 44 | { "frequency": 114, "id": "h" }, 45 | { "frequency": 316, "id": "osen" }, 46 | { "frequency": 169, "id": "山本太郎" }, 47 | { "frequency": 1661, "id": "r_socialnews" }, 48 | { "frequency": 323, "id": "dig954" }, 49 | { "frequency": 362, "id": "etv" }, 50 | { "frequency": 109, "id": "yamagata" }, 51 | { "frequency": 769, "id": "tvasahi" }, 52 | { "frequency": 487, "id": "asamadetv" }, 53 | { "frequency": 175, "id": "tochigi" }, 54 | { "frequency": 876, "id": "tepco" }, 55 | { "frequency": 298, "id": "福島の子供達" }, 56 | { "frequency": 250, "id": "f" }, 57 | { "frequency": 155, "id": "食品" }, 58 | { "frequency": 647, "id": "原発とめろ" }, 59 | { "frequency": 481, "id": "g" }, 60 | { "frequency": 267, "id": "IWJ_TOKYO1" }, 61 | { "frequency": 313, "id": "IWJ_OSAKA1" }, 62 | { "frequency": 147, "id": "原発川柳" }, 63 | { "frequency": 499, "id": "Jp_geiger" }, 64 | { "frequency": 577, "id": "放射線" }, 65 | { "frequency": 485, "id": "紫陽花革命" }, 66 | { "frequency": 317, "id": "緑党" }, 67 | { "frequency": 419, "id": "311care" }, 68 | { "frequency": 1401, "id": "ngfood" }, 69 | { "frequency": 1604, "id": "okfood" }, 70 | { "frequency": 477, "id": "jp_geiger" }, 71 | { "frequency": 330, "id": "cnic" }, 72 | { "frequency": 102, "id": "save" }, 73 | { "frequency": 116, "id": "yjfc_fukushima1np_compensation" }, 74 | { "frequency": 293, "id": "TPP" }, 75 | { "frequency": 1558, "id": "seiji" }, 76 | { "frequency": 540, "id": "tbs" }, 77 | { "frequency": 1015, "id": "大飯原発再稼働決定をただちに撤回せよ" }, 78 | { "frequency": 122, "id": "マスコミ" }, 79 | { "frequency": 180, "id": "yokohama_save" }, 80 | { "frequency": 119, "id": "kosodate" }, 81 | { "frequency": 194, "id": "kodomo" }, 82 | { "frequency": 196, "id": "ikuji" }, 83 | { "frequency": 514, "id": "blogos" }, 84 | { "frequency": 1299, "id": "jisin" }, 85 | { "frequency": 304, "id": "genpats" }, 86 | { "frequency": 122, "id": "電力" }, 87 | { "frequency": 1364, "id": "NHK" }, 88 | { "frequency": 249, "id": "tkgg" }, 89 | { "frequency": 292, "id": "r_blog" }, 90 | { "frequency": 379, "id": "hakatta" }, 91 | { "frequency": 537, "id": "IWJ_FUKUSHIMA1" }, 92 | { "frequency": 131, "id": "群馬" }, 93 | { "frequency": 1228, "id": "sokotoko" }, 94 | { "frequency": 951, "id": "瓦礫" }, 95 | { "frequency": 101, "id": "橋下イラネ" }, 96 | { "frequency": 314, "id": "移住" }, 97 | { "frequency": 509, "id": "Fukushima" }, 98 | { "frequency": 309, "id": "genpat" }, 99 | { "frequency": 277, "id": "FNN" }, 100 | { "frequency": 275, "id": "japan" }, 101 | { "frequency": 352, "id": "tokyo" }, 102 | { "frequency": 234, "id": "fukusima" }, 103 | { "frequency": 162, "id": "saigai" }, 104 | { "frequency": 165, "id": "maga9" }, 105 | { "frequency": 293, "id": "geiger" }, 106 | { "frequency": 389, "id": "shinso" }, 107 | { "frequency": 208, "id": "atmc" }, 108 | { "frequency": 188, "id": "官邸前" }, 109 | { "frequency": 150, "id": "tokyofm_timeline" }, 110 | { "frequency": 162, "id": "TBS" }, 111 | { "frequency": 391, "id": "opkodomotachi" }, 112 | { "frequency": 104, "id": "福島県" }, 113 | { "frequency": 102, "id": "sa" }, 114 | { "frequency": 149, "id": "radiation" }, 115 | { "frequency": 388, "id": "houshanou" }, 116 | { "frequency": 144, "id": "関電" }, 117 | { "frequency": 527, "id": "再稼働" }, 118 | { "frequency": 168, "id": "sendai" }, 119 | { "frequency": 174, "id": "chiba" }, 120 | { "frequency": 279, "id": "jnsc" }, 121 | { "frequency": 215, "id": "民主党" }, 122 | { "frequency": 112, "id": "原発事故" }, 123 | { "frequency": 418, "id": "touden" }, 124 | { "frequency": 610, "id": "政治" }, 125 | { "frequency": 107, "id": "headline" }, 126 | { "frequency": 281, "id": "niftynews" }, 127 | { "frequency": 286, "id": "goo_nagaikenji20070927" }, 128 | { "frequency": 227, "id": "housyasen" }, 129 | { "frequency": 321, "id": "nuclear" }, 130 | { "frequency": 167, "id": "5月5日原発全基停止" }, 131 | { "frequency": 1083, "id": "大飯原発再稼働迫る" }, 132 | { "frequency": 215, "id": "IWJ_FUKUOKA1" }, 133 | { "frequency": 534, "id": "がれき" }, 134 | { "frequency": 127, "id": "大飯" }, 135 | { "frequency": 260, "id": "除染" }, 136 | { "frequency": 473, "id": "廃炉" }, 137 | { "frequency": 160, "id": "yjfc_311eq_fukushima_1np" }, 138 | { "frequency": 231, "id": "東京" }, 139 | { "frequency": 214, "id": "joqr" }, 140 | { "frequency": 397, "id": "miraie" }, 141 | { "frequency": 578, "id": "デモ" }, 142 | { "frequency": 188, "id": "twitr" }, 143 | { "frequency": 166, "id": "RakutenIchiba" }, 144 | { "frequency": 136, "id": "hamaosen" }, 145 | { "frequency": 601, "id": "TEPCO" }, 146 | { "frequency": 318, "id": "反核燃サイクル" }, 147 | { "frequency": 329, "id": "毎日新聞" }, 148 | { "frequency": 114, "id": "Tokyo" }, 149 | { "frequency": 260, "id": "save_child" }, 150 | { "frequency": 183, "id": "occupyoi" }, 151 | { "frequency": 159, "id": "0Bq" }, 152 | { "frequency": 247, "id": "IWJ_OITA1" }, 153 | { "frequency": 450, "id": "内部被曝" }, 154 | { "frequency": 488, "id": "汚染" }, 155 | { "frequency": 266, "id": "toden" }, 156 | { "frequency": 100, "id": "座り込み" }, 157 | { "frequency": 286, "id": "childF" }, 158 | { "frequency": 130, "id": "NN2012Live" }, 159 | { "frequency": 186, "id": "j" }, 160 | { "frequency": 564, "id": "hinan" }, 161 | { "frequency": 253, "id": "ibaraki" }, 162 | { "frequency": 220, "id": "大阪" }, 163 | { "frequency": 129, "id": "広域処理反対" }, 164 | { "frequency": 111, "id": "ji" }, 165 | { "frequency": 207, "id": "脱プルサーマル" }, 166 | { "frequency": 224, "id": "bot" }, 167 | { "frequency": 122, "id": "minsyu" }, 168 | { "frequency": 137, "id": "自民党" }, 169 | { "frequency": 111, "id": "SmartNews" }, 170 | { "frequency": 143, "id": "t" }, 171 | { "frequency": 423, "id": "fujitv" }, 172 | { "frequency": 165, "id": "jwave" }, 173 | { "frequency": 448, "id": "tsunami" }, 174 | { "frequency": 344, "id": "genpa" }, 175 | { "frequency": 129, "id": "再稼動反対" }, 176 | { "frequency": 406, "id": "ETV" }, 177 | { "frequency": 107, "id": "dommune" }, 178 | { "frequency": 128, "id": "keizai" }, 179 | { "frequency": 110, "id": "瓦礫受入反対派の声を届けよう" }, 180 | { "frequency": 136, "id": "北九州" }, 181 | { "frequency": 187, "id": "i" }, 182 | { "frequency": 197, "id": "newsJP" }, 183 | { "frequency": 111, "id": "yjfc_decontamination" }, 184 | { "frequency": 228, "id": "Gwatcherver2" }, 185 | { "frequency": 127, "id": "千葉" }, 186 | { "frequency": 263, "id": "fu" }, 187 | { "frequency": 170, "id": "fuk" }, 188 | { "frequency": 127, "id": "kanagawa" }, 189 | { "frequency": 112, "id": "横浜" }, 190 | { "frequency": 186, "id": "茨城" }, 191 | { "frequency": 186, "id": "地震" }, 192 | { "frequency": 140, "id": "福島原発" }, 193 | { "frequency": 116, "id": "IWJ_TOKYO2" }, 194 | { "frequency": 226, "id": "大飯原発" }, 195 | { "frequency": 231, "id": "IWJ_FUKUI1" }, 196 | { "frequency": 116, "id": "選挙" }, 197 | { "frequency": 200, "id": "setsuden" }, 198 | { "frequency": 214, "id": "原発マフィア" }, 199 | { "frequency": 249, "id": "東京電力" }, 200 | { "frequency": 103, "id": "経済" }, 201 | { "frequency": 377, "id": "genp" }, 202 | { "frequency": 621, "id": "videonews" }, 203 | { "frequency": 109, "id": "原発再稼働" }, 204 | { "frequency": 168, "id": "saitama" }, 205 | { "frequency": 155, "id": "守る会" }, 206 | { "frequency": 105, "id": "sav" }, 207 | { "frequency": 110, "id": "ふくしま集団疎開裁判" }, 208 | { "frequency": 197, "id": "子供" }, 209 | { "frequency": 335, "id": "kokkai" }, 210 | { "frequency": 508, "id": "避難" }, 211 | { "frequency": 188, "id": "save_children" }, 212 | { "frequency": 199, "id": "nishinippon" }, 213 | { "frequency": 117, "id": "iw" }, 214 | { "frequency": 114, "id": "iitate" }, 215 | { "frequency": 124, "id": "matsudo" }, 216 | { "frequency": 130, "id": "kashiwa" }, 217 | { "frequency": 134, "id": "疎開" }, 218 | { "frequency": 112, "id": "yamerunakan" }, 219 | { "frequency": 266, "id": "jikocho" }, 220 | { "frequency": 240, "id": "hakaru" }, 221 | { "frequency": 285, "id": "ガレキ" }, 222 | { "frequency": 114, "id": "脱被曝" }, 223 | { "frequency": 102, "id": "復興" }, 224 | { "frequency": 108, "id": "1tp" }, 225 | { "frequency": 191, "id": "housyanou" }, 226 | { "frequency": 117, "id": "iwakamiyasumi8" }, 227 | { "frequency": 154, "id": "宮城" }, 228 | { "frequency": 236, "id": "newsjp" }, 229 | { "frequency": 108, "id": "tokyofm" }, 230 | { "frequency": 105, "id": "iwakami" }, 231 | { "frequency": 104, "id": "原発ゼロ" }, 232 | { "frequency": 103, "id": "fukushim" }, 233 | { "frequency": 190, "id": "健康" }, 234 | { "frequency": 173, "id": "miyagi" }, 235 | { "frequency": 122, "id": "skmtnews" }, 236 | { "frequency": 102, "id": "News" }, 237 | { "frequency": 178, "id": "給食" }, 238 | { "frequency": 168, "id": "fuku" }, 239 | { "frequency": 125, "id": "matome" }, 240 | { "frequency": 101, "id": "支援" }, 241 | { "frequency": 126, "id": "育児" }, 242 | { "frequency": 8175, "id": "福島" }, 243 | { "frequency": 1376, "id": "嘆願" }, 244 | { "frequency": 834, "id": "フク" }, 245 | { "frequency": 5596, "id": "放射性物質" }, 246 | { "frequency": 173, "id": "フクイチ" }, 247 | { "frequency": 4095, "id": "拡散" }, 248 | { "frequency": 3783, "id": "拡張希望" }, 249 | { "frequency": 1143, "id": "フクイチ嘆願" }, 250 | { "frequency": 461, "id": "フクイ" }, 251 | { "frequency": 1131, "id": "フ" }, 252 | { "frequency": 120, "id": "放射線量" }, 253 | { "frequency": 319, "id": "eqjp" }, 254 | { "frequency": 127, "id": "kaigo" }, 255 | { "frequency": 131, "id": "anpi" } 256 | ], 257 | "links": [ 258 | { "source": "nuclearjp", "target": "genpatsu" }, 259 | { "source": "nuclearjp", "target": "原発" }, 260 | { "source": "genpatsu", "target": "fukunp" }, 261 | { "source": "genpatsu", "target": "kaminoseki" }, 262 | { "source": "genpatsu", "target": "放射能汚染" }, 263 | { "source": "genpatsu", "target": "脱原発" }, 264 | { "source": "genpatsu", "target": "放射能" }, 265 | { "source": "genpatsu", "target": "原発" }, 266 | { "source": "genpatsu", "target": "被爆" }, 267 | { "source": "genpatsu", "target": "nuclearJP" }, 268 | { "source": "genpatsu", "target": "反原発" }, 269 | { "source": "genpatsu", "target": "東電" }, 270 | { "source": "genpatsu", "target": "食品汚染" }, 271 | { "source": "genpatsu", "target": "震災" }, 272 | { "source": "genpatsu", "target": "セシウム" }, 273 | { "source": "genpatsu", "target": "fpaj" }, 274 | { "source": "genpatsu", "target": "save_fukushima" }, 275 | { "source": "genpatsu", "target": "genpatu" }, 276 | { "source": "genpatsu", "target": "nicojishin" }, 277 | { "source": "genpatsu", "target": "jishin" }, 278 | { "source": "genpatsu", "target": "nhk_news" }, 279 | { "source": "genpatsu", "target": "nhk" }, 280 | { "source": "genpatsu", "target": "nikkei" }, 281 | { "source": "genpatsu", "target": "googlenewsjp" }, 282 | { "source": "genpatsu", "target": "ldnews" }, 283 | { "source": "genpatsu", "target": "news" }, 284 | { "source": "genpatsu", "target": "ニュース" }, 285 | { "source": "genpatsu", "target": "再稼働反対" }, 286 | { "source": "genpatsu", "target": "ntv" }, 287 | { "source": "genpatsu", "target": "ge" }, 288 | { "source": "genpatsu", "target": "hibaku" }, 289 | { "source": "genpatsu", "target": "nonukes" }, 290 | { "source": "genpatsu", "target": "311animal" }, 291 | { "source": "genpatsu", "target": "yokohama" }, 292 | { "source": "genpatsu", "target": "fukushima" }, 293 | { "source": "genpatsu", "target": "Japan" }, 294 | { "source": "genpatsu", "target": "gen" }, 295 | { "source": "genpatsu", "target": "福島市" }, 296 | { "source": "genpatsu", "target": "被曝" }, 297 | { "source": "genpatsu", "target": "CHIBAREI" }, 298 | { "source": "genpatsu", "target": "nicohou" }, 299 | { "source": "genpatsu", "target": "h" }, 300 | { "source": "genpatsu", "target": "osen" }, 301 | { "source": "genpatsu", "target": "山本太郎" }, 302 | { "source": "genpatsu", "target": "r_socialnews" }, 303 | { "source": "genpatsu", "target": "dig954" }, 304 | { "source": "genpatsu", "target": "etv" }, 305 | { "source": "genpatsu", "target": "yamagata" }, 306 | { "source": "genpatsu", "target": "tvasahi" }, 307 | { "source": "genpatsu", "target": "asamadetv" }, 308 | { "source": "genpatsu", "target": "tochigi" }, 309 | { "source": "genpatsu", "target": "tepco" }, 310 | { "source": "genpatsu", "target": "福島の子供達" }, 311 | { "source": "genpatsu", "target": "f" }, 312 | { "source": "genpatsu", "target": "食品" }, 313 | { "source": "genpatsu", "target": "原発とめろ" }, 314 | { "source": "genpatsu", "target": "g" }, 315 | { "source": "genpatsu", "target": "IWJ_TOKYO1" }, 316 | { "source": "genpatsu", "target": "IWJ_OSAKA1" }, 317 | { "source": "genpatsu", "target": "原発川柳" }, 318 | { "source": "genpatsu", "target": "Jp_geiger" }, 319 | { "source": "genpatsu", "target": "放射線" }, 320 | { "source": "genpatsu", "target": "紫陽花革命" }, 321 | { "source": "genpatsu", "target": "緑党" }, 322 | { "source": "genpatsu", "target": "311care" }, 323 | { "source": "genpatsu", "target": "ngfood" }, 324 | { "source": "genpatsu", "target": "okfood" }, 325 | { "source": "genpatsu", "target": "jp_geiger" }, 326 | { "source": "genpatsu", "target": "cnic" }, 327 | { "source": "genpatsu", "target": "save" }, 328 | { "source": "genpatsu", "target": "yjfc_fukushima1np_compensation" }, 329 | { "source": "genpatsu", "target": "TPP" }, 330 | { "source": "genpatsu", "target": "seiji" }, 331 | { "source": "genpatsu", "target": "tbs" }, 332 | { "source": "genpatsu", "target": "大飯原発再稼働決定をただちに撤回せよ" }, 333 | { "source": "genpatsu", "target": "マスコミ" }, 334 | { "source": "genpatsu", "target": "yokohama_save" }, 335 | { "source": "genpatsu", "target": "kosodate" }, 336 | { "source": "genpatsu", "target": "kodomo" }, 337 | { "source": "genpatsu", "target": "ikuji" }, 338 | { "source": "genpatsu", "target": "blogos" }, 339 | { "source": "genpatsu", "target": "jisin" }, 340 | { "source": "genpatsu", "target": "genpats" }, 341 | { "source": "genpatsu", "target": "電力" }, 342 | { "source": "genpatsu", "target": "NHK" }, 343 | { "source": "genpatsu", "target": "tkgg" }, 344 | { "source": "genpatsu", "target": "r_blog" }, 345 | { "source": "genpatsu", "target": "hakatta" }, 346 | { "source": "genpatsu", "target": "IWJ_FUKUSHIMA1" }, 347 | { "source": "genpatsu", "target": "群馬" }, 348 | { "source": "genpatsu", "target": "sokotoko" }, 349 | { "source": "genpatsu", "target": "瓦礫" }, 350 | { "source": "genpatsu", "target": "橋下イラネ" }, 351 | { "source": "genpatsu", "target": "移住" }, 352 | { "source": "genpatsu", "target": "Fukushima" }, 353 | { "source": "genpatsu", "target": "genpat" }, 354 | { "source": "genpatsu", "target": "FNN" }, 355 | { "source": "genpatsu", "target": "japan" }, 356 | { "source": "genpatsu", "target": "tokyo" }, 357 | { "source": "genpatsu", "target": "fukusima" }, 358 | { "source": "genpatsu", "target": "saigai" }, 359 | { "source": "genpatsu", "target": "maga9" }, 360 | { "source": "genpatsu", "target": "geiger" }, 361 | { "source": "genpatsu", "target": "shinso" }, 362 | { "source": "genpatsu", "target": "atmc" }, 363 | { "source": "genpatsu", "target": "官邸前" }, 364 | { "source": "genpatsu", "target": "tokyofm_timeline" }, 365 | { "source": "genpatsu", "target": "TBS" }, 366 | { "source": "genpatsu", "target": "opkodomotachi" }, 367 | { "source": "genpatsu", "target": "福島県" }, 368 | { "source": "genpatsu", "target": "sa" }, 369 | { "source": "genpatsu", "target": "radiation" }, 370 | { "source": "genpatsu", "target": "houshanou" }, 371 | { "source": "genpatsu", "target": "関電" }, 372 | { "source": "genpatsu", "target": "再稼働" }, 373 | { "source": "genpatsu", "target": "sendai" }, 374 | { "source": "genpatsu", "target": "chiba" }, 375 | { "source": "genpatsu", "target": "jnsc" }, 376 | { "source": "genpatsu", "target": "民主党" }, 377 | { "source": "genpatsu", "target": "原発事故" }, 378 | { "source": "genpatsu", "target": "touden" }, 379 | { "source": "genpatsu", "target": "政治" }, 380 | { "source": "genpatsu", "target": "headline" }, 381 | { "source": "genpatsu", "target": "niftynews" }, 382 | { "source": "genpatsu", "target": "goo_nagaikenji20070927" }, 383 | { "source": "genpatsu", "target": "housyasen" }, 384 | { "source": "genpatsu", "target": "nuclear" }, 385 | { "source": "genpatsu", "target": "5月5日原発全基停止" }, 386 | { "source": "genpatsu", "target": "大飯原発再稼働迫る" }, 387 | { "source": "genpatsu", "target": "IWJ_FUKUOKA1" }, 388 | { "source": "genpatsu", "target": "がれき" }, 389 | { "source": "genpatsu", "target": "大飯" }, 390 | { "source": "genpatsu", "target": "除染" }, 391 | { "source": "genpatsu", "target": "廃炉" }, 392 | { "source": "genpatsu", "target": "yjfc_311eq_fukushima_1np" }, 393 | { "source": "genpatsu", "target": "東京" }, 394 | { "source": "genpatsu", "target": "joqr" }, 395 | { "source": "genpatsu", "target": "miraie" }, 396 | { "source": "genpatsu", "target": "デモ" }, 397 | { "source": "genpatsu", "target": "twitr" }, 398 | { "source": "genpatsu", "target": "RakutenIchiba" }, 399 | { "source": "genpatsu", "target": "hamaosen" }, 400 | { "source": "genpatsu", "target": "TEPCO" }, 401 | { "source": "genpatsu", "target": "反核燃サイクル" }, 402 | { "source": "genpatsu", "target": "毎日新聞" }, 403 | { "source": "genpatsu", "target": "Tokyo" }, 404 | { "source": "genpatsu", "target": "save_child" }, 405 | { "source": "genpatsu", "target": "occupyoi" }, 406 | { "source": "genpatsu", "target": "0Bq" }, 407 | { "source": "genpatsu", "target": "IWJ_OITA1" }, 408 | { "source": "genpatsu", "target": "内部被曝" }, 409 | { "source": "genpatsu", "target": "汚染" }, 410 | { "source": "genpatsu", "target": "toden" }, 411 | { "source": "genpatsu", "target": "座り込み" }, 412 | { "source": "genpatsu", "target": "childF" }, 413 | { "source": "genpatsu", "target": "NN2012Live" }, 414 | { "source": "genpatsu", "target": "j" }, 415 | { "source": "genpatsu", "target": "hinan" }, 416 | { "source": "genpatsu", "target": "ibaraki" }, 417 | { "source": "genpatsu", "target": "大阪" }, 418 | { "source": "genpatsu", "target": "広域処理反対" }, 419 | { "source": "genpatsu", "target": "ji" }, 420 | { "source": "genpatsu", "target": "脱プルサーマル" }, 421 | { "source": "genpatsu", "target": "bot" }, 422 | { "source": "genpatsu", "target": "minsyu" }, 423 | { "source": "genpatsu", "target": "自民党" }, 424 | { "source": "genpatsu", "target": "SmartNews" }, 425 | { "source": "genpatsu", "target": "t" }, 426 | { "source": "genpatsu", "target": "fujitv" }, 427 | { "source": "genpatsu", "target": "jwave" }, 428 | { "source": "genpatsu", "target": "tsunami" }, 429 | { "source": "genpatsu", "target": "genpa" }, 430 | { "source": "genpatsu", "target": "再稼動反対" }, 431 | { "source": "genpatsu", "target": "ETV" }, 432 | { "source": "genpatsu", "target": "dommune" }, 433 | { "source": "genpatsu", "target": "keizai" }, 434 | { "source": "genpatsu", "target": "瓦礫受入反対派の声を届けよう" }, 435 | { "source": "genpatsu", "target": "北九州" }, 436 | { "source": "genpatsu", "target": "i" }, 437 | { "source": "genpatsu", "target": "newsJP" }, 438 | { "source": "genpatsu", "target": "yjfc_decontamination" }, 439 | { "source": "genpatsu", "target": "Gwatcherver2" }, 440 | { "source": "genpatsu", "target": "千葉" }, 441 | { "source": "genpatsu", "target": "fu" }, 442 | { "source": "genpatsu", "target": "fuk" }, 443 | { "source": "genpatsu", "target": "kanagawa" }, 444 | { "source": "genpatsu", "target": "横浜" }, 445 | { "source": "genpatsu", "target": "茨城" }, 446 | { "source": "genpatsu", "target": "地震" }, 447 | { "source": "genpatsu", "target": "福島原発" }, 448 | { "source": "genpatsu", "target": "IWJ_TOKYO2" }, 449 | { "source": "genpatsu", "target": "大飯原発" }, 450 | { "source": "genpatsu", "target": "IWJ_FUKUI1" }, 451 | { "source": "genpatsu", "target": "選挙" }, 452 | { "source": "genpatsu", "target": "setsuden" }, 453 | { "source": "genpatsu", "target": "原発マフィア" }, 454 | { "source": "genpatsu", "target": "東京電力" }, 455 | { "source": "genpatsu", "target": "経済" }, 456 | { "source": "genpatsu", "target": "genp" }, 457 | { "source": "genpatsu", "target": "videonews" }, 458 | { "source": "genpatsu", "target": "原発再稼働" }, 459 | { "source": "genpatsu", "target": "saitama" }, 460 | { "source": "genpatsu", "target": "守る会" }, 461 | { "source": "genpatsu", "target": "sav" }, 462 | { "source": "genpatsu", "target": "ふくしま集団疎開裁判" }, 463 | { "source": "genpatsu", "target": "子供" }, 464 | { "source": "genpatsu", "target": "kokkai" }, 465 | { "source": "genpatsu", "target": "避難" }, 466 | { "source": "genpatsu", "target": "save_children" }, 467 | { "source": "genpatsu", "target": "nishinippon" }, 468 | { "source": "genpatsu", "target": "iw" }, 469 | { "source": "genpatsu", "target": "iitate" }, 470 | { "source": "genpatsu", "target": "matsudo" }, 471 | { "source": "genpatsu", "target": "kashiwa" }, 472 | { "source": "genpatsu", "target": "疎開" }, 473 | { "source": "genpatsu", "target": "yamerunakan" }, 474 | { "source": "genpatsu", "target": "jikocho" }, 475 | { "source": "genpatsu", "target": "hakaru" }, 476 | { "source": "genpatsu", "target": "ガレキ" }, 477 | { "source": "genpatsu", "target": "脱被曝" }, 478 | { "source": "genpatsu", "target": "復興" }, 479 | { "source": "genpatsu", "target": "1tp" }, 480 | { "source": "genpatsu", "target": "housyanou" }, 481 | { "source": "genpatsu", "target": "iwakamiyasumi8" }, 482 | { "source": "genpatsu", "target": "宮城" }, 483 | { "source": "genpatsu", "target": "newsjp" }, 484 | { "source": "genpatsu", "target": "tokyofm" }, 485 | { "source": "genpatsu", "target": "iwakami" }, 486 | { "source": "genpatsu", "target": "原発ゼロ" }, 487 | { "source": "genpatsu", "target": "fukushim" }, 488 | { "source": "genpatsu", "target": "健康" }, 489 | { "source": "genpatsu", "target": "miyagi" }, 490 | { "source": "genpatsu", "target": "skmtnews" }, 491 | { "source": "genpatsu", "target": "News" }, 492 | { "source": "genpatsu", "target": "給食" }, 493 | { "source": "genpatsu", "target": "fuku" }, 494 | { "source": "genpatsu", "target": "matome" }, 495 | { "source": "genpatsu", "target": "支援" }, 496 | { "source": "genpatsu", "target": "育児" }, 497 | { "source": "放射能汚染", "target": "原発" }, 498 | { "source": "脱原発", "target": "原発" }, 499 | { "source": "脱原発", "target": "緑党" }, 500 | { "source": "脱原発", "target": "廃炉" }, 501 | { "source": "脱原発", "target": "脱プルサーマル" }, 502 | { "source": "脱原発", "target": "再稼動反対" }, 503 | { "source": "脱原発", "target": "原発マフィア" }, 504 | { "source": "脱原発", "target": "脱被曝" }, 505 | { "source": "脱原発", "target": "原発ゼロ" }, 506 | { "source": "放射能", "target": "原発" }, 507 | { "source": "放射能", "target": "福島の子供達" }, 508 | { "source": "放射能", "target": "反核燃サイクル" }, 509 | { "source": "放射能", "target": "脱プルサーマル" }, 510 | { "source": "放射能", "target": "原発マフィア" }, 511 | { "source": "放射能", "target": "守る会" }, 512 | { "source": "原発", "target": "被爆" }, 513 | { "source": "原発", "target": "反原発" }, 514 | { "source": "原発", "target": "東電" }, 515 | { "source": "原発", "target": "食品汚染" }, 516 | { "source": "原発", "target": "震災" }, 517 | { "source": "原発", "target": "福島" }, 518 | { "source": "原発", "target": "セシウム" }, 519 | { "source": "原発", "target": "嘆願" }, 520 | { "source": "原発", "target": "フク" }, 521 | { "source": "原発", "target": "放射性物質" }, 522 | { "source": "原発", "target": "ニュース" }, 523 | { "source": "原発", "target": "再稼働反対" }, 524 | { "source": "原発", "target": "nonukes" }, 525 | { "source": "原発", "target": "フクイチ" }, 526 | { "source": "原発", "target": "拡散" }, 527 | { "source": "原発", "target": "拡張希望" }, 528 | { "source": "原発", "target": "福島市" }, 529 | { "source": "原発", "target": "被曝" }, 530 | { "source": "原発", "target": "CHIBAREI" }, 531 | { "source": "原発", "target": "nicohou" }, 532 | { "source": "原発", "target": "山本太郎" }, 533 | { "source": "原発", "target": "食品" }, 534 | { "source": "原発", "target": "原発とめろ" }, 535 | { "source": "原発", "target": "IWJ_TOKYO1" }, 536 | { "source": "原発", "target": "IWJ_OSAKA1" }, 537 | { "source": "原発", "target": "原発川柳" }, 538 | { "source": "原発", "target": "放射線" }, 539 | { "source": "原発", "target": "紫陽花革命" }, 540 | { "source": "原発", "target": "緑党" }, 541 | { "source": "原発", "target": "ngfood" }, 542 | { "source": "原発", "target": "okfood" }, 543 | { "source": "原発", "target": "jp_geiger" }, 544 | { "source": "原発", "target": "TPP" }, 545 | { "source": "原発", "target": "マスコミ" }, 546 | { "source": "原発", "target": "電力" }, 547 | { "source": "原発", "target": "フクイチ嘆願" }, 548 | { "source": "原発", "target": "フクイ" }, 549 | { "source": "原発", "target": "hakatta" }, 550 | { "source": "原発", "target": "IWJ_FUKUSHIMA1" }, 551 | { "source": "原発", "target": "群馬" }, 552 | { "source": "原発", "target": "瓦礫" }, 553 | { "source": "原発", "target": "橋下イラネ" }, 554 | { "source": "原発", "target": "移住" }, 555 | { "source": "原発", "target": "maga9" }, 556 | { "source": "原発", "target": "官邸前" }, 557 | { "source": "原発", "target": "tokyofm_timeline" }, 558 | { "source": "原発", "target": "TBS" }, 559 | { "source": "原発", "target": "opkodomotachi" }, 560 | { "source": "原発", "target": "福島県" }, 561 | { "source": "原発", "target": "関電" }, 562 | { "source": "原発", "target": "再稼働" }, 563 | { "source": "原発", "target": "フ" }, 564 | { "source": "原発", "target": "民主党" }, 565 | { "source": "原発", "target": "原発事故" }, 566 | { "source": "原発", "target": "政治" }, 567 | { "source": "原発", "target": "nuclear" }, 568 | { "source": "原発", "target": "5月5日原発全基停止" }, 569 | { "source": "原発", "target": "大飯原発再稼働迫る" }, 570 | { "source": "原発", "target": "IWJ_FUKUOKA1" }, 571 | { "source": "原発", "target": "がれき" }, 572 | { "source": "原発", "target": "大飯" }, 573 | { "source": "原発", "target": "除染" }, 574 | { "source": "原発", "target": "廃炉" }, 575 | { "source": "原発", "target": "東京" }, 576 | { "source": "原発", "target": "デモ" }, 577 | { "source": "原発", "target": "hamaosen" }, 578 | { "source": "原発", "target": "TEPCO" }, 579 | { "source": "原発", "target": "反核燃サイクル" }, 580 | { "source": "原発", "target": "毎日新聞" }, 581 | { "source": "原発", "target": "Tokyo" }, 582 | { "source": "原発", "target": "save_child" }, 583 | { "source": "原発", "target": "occupyoi" }, 584 | { "source": "原発", "target": "0Bq" }, 585 | { "source": "原発", "target": "IWJ_OITA1" }, 586 | { "source": "原発", "target": "内部被曝" }, 587 | { "source": "原発", "target": "汚染" }, 588 | { "source": "原発", "target": "座り込み" }, 589 | { "source": "原発", "target": "NN2012Live" }, 590 | { "source": "原発", "target": "大阪" }, 591 | { "source": "原発", "target": "広域処理反対" }, 592 | { "source": "原発", "target": "脱プルサーマル" }, 593 | { "source": "原発", "target": "自民党" }, 594 | { "source": "原発", "target": "再稼動反対" }, 595 | { "source": "原発", "target": "ETV" }, 596 | { "source": "原発", "target": "瓦礫受入反対派の声を届けよう" }, 597 | { "source": "原発", "target": "北九州" }, 598 | { "source": "原発", "target": "i" }, 599 | { "source": "原発", "target": "千葉" }, 600 | { "source": "原発", "target": "横浜" }, 601 | { "source": "原発", "target": "茨城" }, 602 | { "source": "原発", "target": "地震" }, 603 | { "source": "原発", "target": "福島原発" }, 604 | { "source": "原発", "target": "IWJ_TOKYO2" }, 605 | { "source": "原発", "target": "大飯原発" }, 606 | { "source": "原発", "target": "IWJ_FUKUI1" }, 607 | { "source": "原発", "target": "選挙" }, 608 | { "source": "原発", "target": "原発マフィア" }, 609 | { "source": "原発", "target": "東京電力" }, 610 | { "source": "原発", "target": "経済" }, 611 | { "source": "原発", "target": "原発再稼働" }, 612 | { "source": "原発", "target": "守る会" }, 613 | { "source": "原発", "target": "ふくしま集団疎開裁判" }, 614 | { "source": "原発", "target": "子供" }, 615 | { "source": "原発", "target": "避難" }, 616 | { "source": "原発", "target": "save_children" }, 617 | { "source": "原発", "target": "iw" }, 618 | { "source": "原発", "target": "疎開" }, 619 | { "source": "原発", "target": "yamerunakan" }, 620 | { "source": "原発", "target": "jikocho" }, 621 | { "source": "原発", "target": "ガレキ" }, 622 | { "source": "原発", "target": "放射線量" }, 623 | { "source": "原発", "target": "脱被曝" }, 624 | { "source": "原発", "target": "復興" }, 625 | { "source": "原発", "target": "宮城" }, 626 | { "source": "原発", "target": "iwakami" }, 627 | { "source": "原発", "target": "原発ゼロ" }, 628 | { "source": "原発", "target": "健康" }, 629 | { "source": "原発", "target": "給食" }, 630 | { "source": "原発", "target": "支援" }, 631 | { "source": "原発", "target": "育児" }, 632 | { "source": "震災", "target": "福島" }, 633 | { "source": "nicojishin", "target": "jishin" }, 634 | { "source": "jishin", "target": "311care" }, 635 | { "source": "jishin", "target": "jisin" }, 636 | { "source": "jishin", "target": "eqjp" }, 637 | { "source": "jishin", "target": "kaigo" }, 638 | { "source": "jishin", "target": "anpi" }, 639 | { "source": "福島の子供達", "target": "福島" }, 640 | { "source": "群馬", "target": "福島" }, 641 | { "source": "大飯", "target": "福島" }, 642 | { "source": "除染", "target": "福島" }, 643 | { "source": "東京", "target": "福島" }, 644 | { "source": "千葉", "target": "福島" }, 645 | { "source": "茨城", "target": "福島" }, 646 | { "source": "ふくしま集団疎開裁判", "target": "福島" }, 647 | { "source": "子供", "target": "福島" }, 648 | { "source": "避難", "target": "福島" }, 649 | { "source": "疎開", "target": "福島" }, 650 | { "source": "復興", "target": "福島" }, 651 | { "source": "宮城", "target": "福島" }, 652 | { "source": "支援", "target": "福島" }, 653 | { "source": "福島", "target": "嘆願" }, 654 | { "source": "福島", "target": "フク" }, 655 | { "source": "福島", "target": "放射性物質" }, 656 | { "source": "福島", "target": "フクイチ" }, 657 | { "source": "福島", "target": "拡散" }, 658 | { "source": "福島", "target": "拡張希望" }, 659 | { "source": "福島", "target": "フクイチ嘆願" }, 660 | { "source": "福島", "target": "フクイ" }, 661 | { "source": "福島", "target": "フ" }, 662 | { "source": "福島", "target": "放射線量" }, 663 | { "source": "嘆願", "target": "放射性物質" }, 664 | { "source": "フク", "target": "放射性物質" }, 665 | { "source": "放射性物質", "target": "フクイチ" }, 666 | { "source": "放射性物質", "target": "拡張希望" }, 667 | { "source": "放射性物質", "target": "フクイチ嘆願" }, 668 | { "source": "放射性物質", "target": "フクイ" }, 669 | { "source": "放射性物質", "target": "フ" } 670 | ] 671 | } 672 | -------------------------------------------------------------------------------- /src/App.jsx: -------------------------------------------------------------------------------- 1 | import { Route } from "react-router-dom"; 2 | import { 3 | IonApp, 4 | IonContent, 5 | IonHeader, 6 | IonItem, 7 | IonRouterOutlet, 8 | IonMenu, 9 | IonList, 10 | IonSplitPane, 11 | IonTitle, 12 | IonToolbar, 13 | } from "@ionic/react"; 14 | import { IonReactRouter } from "@ionic/react-router"; 15 | 16 | import Home from "./pages/Home"; 17 | import Lesson01 from "./pages/Lesson01"; 18 | import Lesson02 from "./pages/Lesson02"; 19 | import Lesson03 from "./pages/Lesson03"; 20 | import Lesson04 from "./pages/Lesson04"; 21 | import Lesson05 from "./pages/Lesson05"; 22 | import Lesson06 from "./pages/Lesson06"; 23 | import Lesson07 from "./pages/Lesson07"; 24 | import Lesson08 from "./pages/Lesson08"; 25 | import Lesson09 from "./pages/Lesson09"; 26 | import Lesson10 from "./pages/Lesson10"; 27 | import Answer01 from "./pages/Answer01"; 28 | import Answer02 from "./pages/Answer02"; 29 | import Answer03 from "./pages/Answer03"; 30 | import Answer04 from "./pages/Answer04"; 31 | import Answer05 from "./pages/Answer05"; 32 | import Answer06 from "./pages/Answer06"; 33 | import Answer07 from "./pages/Answer07"; 34 | import Answer08 from "./pages/Answer08"; 35 | import Answer09 from "./pages/Answer09"; 36 | import Answer10 from "./pages/Answer10"; 37 | 38 | export default function App() { 39 | return ( 40 | 41 | 42 | 43 | 44 | 45 | 46 | Menu 47 | 48 | 49 | 50 | 51 | Introduction 52 | Lesson 01 53 | Lesson 02 54 | Lesson 03 55 | Lesson 04 56 | Lesson 05 57 | Lesson 06 58 | Lesson 07 59 | Lesson 08 60 | Lesson 09 61 | Lesson 10 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | ); 92 | } 93 | -------------------------------------------------------------------------------- /src/components/AnswerPage.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import { 3 | IonButtons, 4 | IonBackButton, 5 | IonCheckbox, 6 | IonContent, 7 | IonHeader, 8 | IonItem, 9 | IonLabel, 10 | IonList, 11 | IonTitle, 12 | IonToolbar, 13 | IonPage, 14 | useIonViewWillEnter, 15 | } from "@ionic/react"; 16 | import Markdown from "./Markdown"; 17 | 18 | const AnswerPage = ({ 19 | answer, 20 | convertData, 21 | dataUrl, 22 | lessonUrl, 23 | title, 24 | Chart, 25 | }) => { 26 | const [data, setData] = useState(null); 27 | const [showAnswer, setShowAnswer] = useState(false); 28 | 29 | useIonViewWillEnter(() => { 30 | if (dataUrl) { 31 | fetch(dataUrl) 32 | .then((response) => response.json()) 33 | .then((data) => { 34 | setData(data); 35 | }); 36 | } 37 | }); 38 | 39 | return ( 40 | 41 | 42 | 43 | 44 | 45 | 46 | {title} 47 | 48 | 49 | 50 | 51 | 52 | 実行結果 53 |
54 | {data && } 55 |
56 |
57 | 58 | setShowAnswer(e.detail.checked)} 62 | > 63 | 解答例を表示 64 | 65 | 66 | {showAnswer && ( 67 | 68 | 解答例 69 | 70 | 71 | 72 | )} 73 |
74 |
75 |
76 | ); 77 | }; 78 | 79 | export default AnswerPage; 80 | -------------------------------------------------------------------------------- /src/components/Chart01.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveBar } from "@nivo/bar"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | 40 | ); 41 | }; 42 | 43 | export default Chart; 44 | -------------------------------------------------------------------------------- /src/components/Chart02.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveBar } from "@nivo/bar"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | 39 | ); 40 | }; 41 | 42 | export default Chart; 43 | -------------------------------------------------------------------------------- /src/components/Chart03.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveScatterPlot } from "@nivo/scatterplot"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | { 11 | return e + " kg"; 12 | }} 13 | yScale={{ type: "linear", min: "auto", max: "auto" }} 14 | yFormat={(e) => { 15 | return e + " cm"; 16 | }} 17 | blendMode="multiply" 18 | axisTop={null} 19 | axisRight={null} 20 | axisBottom={{ 21 | orient: "bottom", 22 | tickSize: 5, 23 | tickPadding: 5, 24 | tickRotation: 0, 25 | legend: "体重", 26 | legendPosition: "middle", 27 | legendOffset: 46, 28 | }} 29 | axisLeft={{ 30 | orient: "left", 31 | tickSize: 5, 32 | tickPadding: 5, 33 | tickRotation: 0, 34 | legend: "身長", 35 | legendPosition: "middle", 36 | legendOffset: -60, 37 | }} 38 | /> 39 | ); 40 | }; 41 | 42 | export default Chart; 43 | -------------------------------------------------------------------------------- /src/components/Chart04.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveScatterPlot } from "@nivo/scatterplot"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | { 11 | return e + " kg"; 12 | }} 13 | yScale={{ type: "linear", min: "auto", max: "auto" }} 14 | yFormat={(e) => { 15 | return e + " cm"; 16 | }} 17 | blendMode="multiply" 18 | axisTop={null} 19 | axisRight={null} 20 | axisBottom={{ 21 | orient: "bottom", 22 | tickSize: 5, 23 | tickPadding: 5, 24 | tickRotation: 0, 25 | legend: "Sepal Length", 26 | legendPosition: "middle", 27 | legendOffset: 46, 28 | }} 29 | axisLeft={{ 30 | orient: "left", 31 | tickSize: 5, 32 | tickPadding: 5, 33 | tickRotation: 0, 34 | legend: "Petal Width", 35 | legendPosition: "middle", 36 | legendOffset: -60, 37 | }} 38 | legends={[ 39 | { 40 | anchor: "top-left", 41 | direction: "row", 42 | justify: false, 43 | translateX: 0, 44 | translateY: -30, 45 | itemWidth: 100, 46 | itemHeight: 12, 47 | itemsSpacing: 5, 48 | itemDirection: "left-to-right", 49 | symbolSize: 12, 50 | symbolShape: "circle", 51 | effects: [ 52 | { 53 | on: "hover", 54 | style: { 55 | itemOpacity: 1, 56 | }, 57 | }, 58 | ], 59 | }, 60 | ]} 61 | /> 62 | ); 63 | }; 64 | 65 | export default Chart; 66 | -------------------------------------------------------------------------------- /src/components/Chart05.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveBar } from "@nivo/bar"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | 63 | ); 64 | }; 65 | 66 | export default Chart; 67 | -------------------------------------------------------------------------------- /src/components/Chart06.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveParallelCoordinates } from "@nivo/parallel-coordinates"; 3 | 4 | // Custom tooltip component 5 | const CustomTooltip = ({ variable, value, datum }) => { 6 | const tooltipStyle = { 7 | background: 'white', 8 | padding: '9px 12px', 9 | border: '1px solid #ccc', 10 | borderRadius: '3px', 11 | boxShadow: '0 2px 4px rgba(0,0,0,0.1)', 12 | fontSize: '16px', 13 | color: '#333' 14 | }; 15 | 16 | return ( 17 |
18 | {datum.data && ( 19 |
20 |
21 | 性別: {datum.data.gender} 22 |
23 |
24 | BMI: {datum.data.bmi.toFixed(2)} 25 |
26 |
27 | 体重: {datum.data.weight} kg 28 |
29 |
30 | 身長: {datum.data.height} cm 31 |
32 |
33 | )} 34 |
35 | ); 36 | }; 37 | 38 | const Chart = ({ data }) => { 39 | // Map gender values to numeric values and add id to each data item 40 | const dataWithIds = data.map((item, index) => ({ 41 | ...item, 42 | id: index.toString(), 43 | genderValue: item.gender === "男性" ? 1 : 0, 44 | })); 45 | 46 | // console.log(dataWithIds); 47 | 48 | return ( 49 | value === 1 ? "男性" : "女性", 65 | tooltipFormat: value => value === 1 ? "男性" : "女性", 66 | }, 67 | { 68 | id: "BMI", 69 | value: "bmi", 70 | min: "auto", 71 | max: "auto", 72 | ticksPosition: "before", 73 | legendPosition: "middle", 74 | legendOffset: 10, 75 | }, 76 | { 77 | id: "体重", 78 | value: "weight", 79 | min: "auto", 80 | max: "auto", 81 | ticksPosition: "before", 82 | legend: "体重", 83 | legendPosition: "middle", 84 | legendOffset: 10, 85 | }, 86 | { 87 | id: "身長", 88 | value: "height", 89 | min: "auto", 90 | max: "auto", 91 | legend: "身長", 92 | legendPosition: "middle", 93 | ticksPosition: 'after', 94 | legendOffset: -10, 95 | }, 96 | ]} 97 | lineWidth={3} 98 | lineOpacity={0.1} 99 | margin={{ top: 50, right: 60, bottom: 50, left: 60 }} 100 | animate={true} 101 | theme={{ 102 | axis: { 103 | domain: { 104 | line: { 105 | stroke: "rgb(136, 158, 174)", 106 | strokeWidth: 2, 107 | }, 108 | }, 109 | ticks: { 110 | line: { 111 | stroke: "rgb(136, 158, 174)", 112 | strokeWidth: 2, 113 | }, 114 | }, 115 | }, 116 | }} 117 | /> 118 | ); 119 | }; 120 | 121 | export default Chart; 122 | -------------------------------------------------------------------------------- /src/components/Chart07.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveLine } from "@nivo/line"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | 67 | ); 68 | }; 69 | 70 | export default Chart; 71 | -------------------------------------------------------------------------------- /src/components/Chart08.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveNetwork } from "@nivo/network"; 3 | 4 | const cmp = (v1, v2) => { 5 | if (v1 === v2) { 6 | return 0; 7 | } else if (v1 > v2) { 8 | return 1; 9 | } else { 10 | return -1; 11 | } 12 | }; 13 | 14 | const Chart = ({ data }) => { 15 | data.nodes.sort((node1, node2) => cmp(node1.id, node2.id)); 16 | data.links.sort((link1, link2) => { 17 | if (cmp(link1.source, link2.source) === 0) { 18 | return cmp(link1.target, link2.target); 19 | } else { 20 | return cmp(link1.source, link2.source); 21 | } 22 | }); 23 | 24 | // Set node size for all nodes 25 | for (const node of data.nodes) { 26 | node.size = 5; 27 | } 28 | 29 | return ( 30 | "green"} 40 | nodeBorderColor={() => "none"} 41 | linkColor={() => "gray"} 42 | animate={true} 43 | motionConfig={{ 44 | mass: 2, 45 | tension: 170, 46 | friction: 30, 47 | clamp: true, 48 | precision: 0.01, 49 | velocity: 0, 50 | }} 51 | /> 52 | ); 53 | }; 54 | 55 | export default Chart; 56 | -------------------------------------------------------------------------------- /src/components/Chart09.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveSunburst } from "@nivo/sunburst"; 3 | 4 | const Chart = ({ data }) => { 5 | return ( 6 | 21 | ); 22 | }; 23 | 24 | export default Chart; 25 | -------------------------------------------------------------------------------- /src/components/Chart10.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { ResponsiveNetwork } from "@nivo/network"; 3 | 4 | const cmp = (v1, v2) => { 5 | if (v1 === v2) { 6 | return 0; 7 | } else if (v1 > v2) { 8 | return 1; 9 | } else { 10 | return -1; 11 | } 12 | }; 13 | 14 | const Chart = ({ data }) => { 15 | data.nodes.sort((node1, node2) => cmp(node1.id, node2.id)); 16 | data.links.sort((link1, link2) => { 17 | if (cmp(link1.source, link2.source) === 0) { 18 | return cmp(link1.target, link2.target); 19 | } else { 20 | return cmp(link1.source, link2.source); 21 | } 22 | }); 23 | 24 | return ( 25 | node.radius || 5} 32 | nodeColor={(node) => node.color} 33 | nodeBorderColor={() => "none"} 34 | linkColor={() => "gray"} 35 | animate={true} 36 | /> 37 | ); 38 | }; 39 | 40 | export default Chart; 41 | -------------------------------------------------------------------------------- /src/components/LessonPage.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import { 3 | IonButtons, 4 | IonContent, 5 | IonHeader, 6 | IonItem, 7 | IonLabel, 8 | IonList, 9 | IonMenuButton, 10 | IonTitle, 11 | IonToolbar, 12 | IonPage, 13 | useIonViewWillEnter, 14 | } from "@ionic/react"; 15 | import Markdown from "./Markdown"; 16 | 17 | const LessonPage = ({ 18 | answerUrl, 19 | convertData, 20 | dataUrl, 21 | instruction, 22 | title, 23 | Chart, 24 | }) => { 25 | const [data, setData] = useState(null); 26 | 27 | useIonViewWillEnter(() => { 28 | if (dataUrl) { 29 | fetch(dataUrl) 30 | .then((response) => response.json()) 31 | .then((data) => { 32 | setData(data); 33 | }); 34 | } 35 | }); 36 | 37 | return ( 38 | 39 | 40 | 41 | 42 | 43 | 44 | {title} 45 | 46 | 47 | 48 | 49 | 50 | 説明 51 | 52 | 53 | 54 | 実行結果 55 |
56 | {data && } 57 |
58 |
59 | 表示例を見る 60 |
61 |
62 |
63 | ); 64 | }; 65 | 66 | export default LessonPage; 67 | -------------------------------------------------------------------------------- /src/components/Markdown.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import MarkdownIt from "markdown-it"; 3 | import hljs from "highlight.js"; 4 | 5 | const md = new MarkdownIt({ 6 | html: true, 7 | linkify: true, 8 | typographer: true, 9 | highlight: (str, lang) => { 10 | if (lang && hljs.getLanguage(lang)) { 11 | try { 12 | const content = hljs.highlight(str, { 13 | language: lang, 14 | ignoreIllegals: true, 15 | }).value; 16 | return `
${content}
`; 17 | } catch (__) {} 18 | } 19 | return `
${md.utils.escapeHtml(str)}
`; 20 | }, 21 | }); 22 | 23 | const Markdown = ({ text }) => { 24 | return ( 25 |
26 |
30 |
31 | ); 32 | }; 33 | 34 | export default Markdown; 35 | -------------------------------------------------------------------------------- /src/main.jsx: -------------------------------------------------------------------------------- 1 | import "@ionic/react/css/core.css"; 2 | import "@ionic/react/css/normalize.css"; 3 | import "@ionic/react/css/structure.css"; 4 | import "@ionic/react/css/typography.css"; 5 | import "@ionic/react/css/padding.css"; 6 | import "highlight.js/styles/github.css"; 7 | 8 | import { createRoot } from "react-dom/client"; 9 | import { setupIonicReact } from "@ionic/react"; 10 | import App from "./App"; 11 | 12 | setupIonicReact(); 13 | createRoot(document.getElementById("content")).render(); 14 | -------------------------------------------------------------------------------- /src/pages/Answer01/answer.md: -------------------------------------------------------------------------------- 1 | 配列の要素の変換には `map` を使いましょう。 2 | 3 | ```javascript 4 | const convertData = (input) => { 5 | return input.map(([name, count]) => ({ 6 | name, 7 | count, 8 | })); 9 | }; 10 | ``` 11 | -------------------------------------------------------------------------------- /src/pages/Answer01/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart01"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return input.map(([name, count]) => ({ 8 | name, 9 | count, 10 | })); 11 | }; 12 | 13 | const Answer = () => { 14 | return ( 15 | 23 | ); 24 | }; 25 | 26 | export default Answer; 27 | -------------------------------------------------------------------------------- /src/pages/Answer02/answer.md: -------------------------------------------------------------------------------- 1 | `count` の降順でソートして、先頭 20 件を取り出してあげましょう。 2 | 配列から連続する一部を取り出すには `slice` を使うことができます。 3 | 4 | ```javascript 5 | const convertData = (input) => { 6 | input.sort((item1, item2) => item2.count - item1.count); 7 | return input.slice(0, 20); 8 | }; 9 | ``` 10 | -------------------------------------------------------------------------------- /src/pages/Answer02/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart02"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | input.sort((item1, item2) => item2.count - item1.count); 8 | return input.slice(0, 20); 9 | }; 10 | 11 | const Answer = () => { 12 | return ( 13 | 21 | ); 22 | }; 23 | 24 | export default Answer; 25 | -------------------------------------------------------------------------------- /src/pages/Answer03/answer.md: -------------------------------------------------------------------------------- 1 | 配列から、条件を満たす要素のみを残した配列を得るためには `filter` を使います。 2 | 3 | ```javascript 4 | const convertData = (input) => { 5 | return input.filter((item) => item.gender === "男性"); 6 | }; 7 | ``` 8 | -------------------------------------------------------------------------------- /src/pages/Answer03/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart03"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return input.filter((item) => item.gender === "男性"); 8 | }; 9 | 10 | const Answer = () => { 11 | return ( 12 | { 16 | return [ 17 | { 18 | id: "男性", 19 | data: convertData(input), 20 | }, 21 | ]; 22 | }} 23 | lessonUrl="/lesson03" 24 | title="Lesson 03 - Answer" 25 | Chart={Chart} 26 | /> 27 | ); 28 | }; 29 | 30 | export default Answer; 31 | -------------------------------------------------------------------------------- /src/pages/Answer04/answer.md: -------------------------------------------------------------------------------- 1 | はじめに、アヤメの品種の名前を重複なく配列に格納する必要があります。 2 | 要素を重複なく数えるには、 `Set` を使いましょう。 3 | `Set` では配列のメソッドを使えないので、 `Array.from` で配列に戻してあげましょう。 4 | この配列の名前を `species` とします。 5 | 6 | `species` に対して`map` メソッドを使って、それぞれのアヤメの品種ごとのデータを作成します。 7 | 目的のデータの各要素は、 `id` にアヤメの品種の名前、 `data` に該当する品種のデータを持っています。 8 | `input` の `filter` メソッドを使って、アヤメの品種が一致するレコードのみを取り出しましょう。 9 | 更に、`filter` の結果に対して `map` メソッドを使って、`sepalLength` を `x` 、`petalWidth` を `y` に変換したオブジェクトを作りましょう。 10 | 11 | ```javascript 12 | const convertData = (input) => { 13 | const species = Array.from(new Set(input.map(({ species }) => species))); 14 | return species.map((species) => { 15 | return { 16 | id: species, 17 | data: input 18 | .filter((item) => item.species === species) 19 | .map(({ sepalLength: x, petalWidth: y }) => ({ x, y })), 20 | }; 21 | }); 22 | }; 23 | ``` 24 | -------------------------------------------------------------------------------- /src/pages/Answer04/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart04"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | const species = Array.from(new Set(input.map(({ species }) => species))); 8 | return species.map((species) => { 9 | return { 10 | id: species, 11 | data: input 12 | .filter((item) => item.species === species) 13 | .map(({ sepalLength: x, petalWidth: y }) => ({ x, y })), 14 | }; 15 | }); 16 | }; 17 | 18 | const Answer = () => { 19 | return ( 20 | 28 | ); 29 | }; 30 | 31 | export default Answer; 32 | -------------------------------------------------------------------------------- /src/pages/Answer05/answer.md: -------------------------------------------------------------------------------- 1 | ヒストグラムでは、それぞれの棒のことをビン(階級)と呼びます。 2 | 方針としては、最初に頻度 0 で初期化したビンを用意しておき、データを順番に処理して該当するビンの頻度を 1 ずつ増やすようにすると良いでしょう。 3 | 4 | はじめに性別の配列と、身長の最小値・最大値を計算します。 5 | 性別は今回は男性と女性のみとわかっていますが、`Set` を使ってデータから重複ない集合を作る方がベターでしょう。 6 | 配列の最小値・最大値はそれぞれ `Math.min` と `Math.max` で得られます。 7 | 小数点の四捨五入には `Math.round` を使います。 8 | 9 | 要素数 `n` の配列を `map` で作る方法はいくつかありますが、 `Array.from({ length: n })` という方法を紹介しておきます。 10 | 11 | それぞれのデータを見て、注意深く対応したビンの添字を計算しましょう。 12 | ここでは、 `Math.round(y) - i` で計算を行っています。 13 | 14 | ```javascript 15 | const convertData = (input) => { 16 | const genders = Array.from(new Set(input.map(({ gender }) => gender))); 17 | const min = Math.round(Math.min(...input.map(({ y }) => y))); 18 | const max = Math.round(Math.max(...input.map(({ y }) => y))); 19 | const bins = Array.from({ length: max - min + 1 }).map((_, i) => { 20 | const obj = { 21 | bin: (min + i).toString(), 22 | }; 23 | for (const gender of genders) { 24 | obj[gender] = 0; 25 | } 26 | return obj; 27 | }); 28 | for (const { y, gender } of input) { 29 | const i = Math.round(y) - min; 30 | bins[i][gender] += 1; 31 | } 32 | return bins; 33 | }; 34 | ``` 35 | -------------------------------------------------------------------------------- /src/pages/Answer05/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart05"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | const genders = Array.from(new Set(input.map(({ gender }) => gender))); 8 | const min = Math.round(Math.min(...input.map(({ y }) => y))); 9 | const max = Math.round(Math.max(...input.map(({ y }) => y))); 10 | const bins = Array.from({ length: max - min + 1 }).map((_, i) => { 11 | const obj = { 12 | bin: (min + i).toString(), 13 | }; 14 | for (const gender of genders) { 15 | obj[gender] = 0; 16 | } 17 | return obj; 18 | }); 19 | for (const { y, gender } of input) { 20 | const i = Math.round(y) - min; 21 | bins[i][gender] += 1; 22 | } 23 | return bins; 24 | }; 25 | 26 | const Answer = () => { 27 | return ( 28 | 36 | ); 37 | }; 38 | 39 | export default Answer; 40 | -------------------------------------------------------------------------------- /src/pages/Answer06/answer.md: -------------------------------------------------------------------------------- 1 | `map` メソッドでデータを変換しながら BMI の計算を行いましょう。 2 | 3 | ```javascript 4 | const convertData = (input) => { 5 | const colors = { 6 | 男性: "blue", 7 | 女性: "red", 8 | }; 9 | return input.map(({ gender, x, y }) => { 10 | return { 11 | color: colors[gender], 12 | gender, 13 | bmi: x / (y / 100) ** 2, 14 | weight: x, 15 | height: y, 16 | }; 17 | }); 18 | }; 19 | ``` 20 | -------------------------------------------------------------------------------- /src/pages/Answer06/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart06"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | const colors = { 8 | 男性: "blue", 9 | 女性: "red", 10 | }; 11 | return input.map(({ gender, x, y }) => { 12 | return { 13 | color: colors[gender], 14 | gender, 15 | bmi: x / (y / 100) ** 2, 16 | weight: x, 17 | height: y, 18 | }; 19 | }); 20 | }; 21 | 22 | const Answer = () => { 23 | return ( 24 | 32 | ); 33 | }; 34 | 35 | export default Answer; 36 | -------------------------------------------------------------------------------- /src/pages/Answer07/answer.md: -------------------------------------------------------------------------------- 1 | はじめに、それぞれのツイートの日付を `2020-01-26` のような形式に直さないといけません。 2 | 日付を扱うために `Date` クラスを使用しましょう。 3 | その際にタイムゾーンのズレを直すことに注意しましょう。 4 | また、日と月は 1 桁の場合に 0 埋めすることを忘れないようにしましょう。 5 | 文字列の 0 埋めには `padStart` メソッドが便利です。 6 | 7 | あとは、ツイートとリツイートに分けて件数を数えていきましょう。 8 | 9 | ```javascript 10 | const convertData = (input) => { 11 | for (const item of input) { 12 | const d = new Date(`${item.createdAt} UTC`); 13 | const year = d.getFullYear(); 14 | const month = `${d.getMonth() + 1}`.padStart(2, "0"); 15 | const date = `${d.getDate()}`.padStart(2, "0"); 16 | item.createdAt = `${year}-${month}-${date}`; 17 | } 18 | const dates = Array.from(new Set(input.map(({ createdAt }) => createdAt))); 19 | dates.sort(); 20 | const count = { tweet: {}, retweet: {} }; 21 | for (const d of dates) { 22 | count.tweet[d] = 0; 23 | count.retweet[d] = 0; 24 | } 25 | for (const { createdAt, isRetweet } of input) { 26 | if (isRetweet) { 27 | count.retweet[createdAt] += 1; 28 | } else { 29 | count.tweet[createdAt] += 1; 30 | } 31 | } 32 | return ["tweet", "retweet"].map((key) => { 33 | return { 34 | id: key, 35 | data: dates.map((d) => { 36 | return { 37 | x: d, 38 | y: count[key][d], 39 | }; 40 | }), 41 | }; 42 | }); 43 | }; 44 | ``` 45 | -------------------------------------------------------------------------------- /src/pages/Answer07/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart07"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | for (const item of input) { 8 | const d = new Date(`${item.createdAt} UTC`); 9 | const year = d.getFullYear(); 10 | const month = `${d.getMonth() + 1}`.padStart(2, "0"); 11 | const date = `${d.getDate()}`.padStart(2, "0"); 12 | item.createdAt = `${year}-${month}-${date}`; 13 | } 14 | const dates = Array.from(new Set(input.map(({ createdAt }) => createdAt))); 15 | dates.sort(); 16 | const count = { tweet: {}, retweet: {} }; 17 | for (const d of dates) { 18 | count.tweet[d] = 0; 19 | count.retweet[d] = 0; 20 | } 21 | for (const { createdAt, isRetweet } of input) { 22 | if (isRetweet) { 23 | count.retweet[createdAt] += 1; 24 | } else { 25 | count.tweet[createdAt] += 1; 26 | } 27 | } 28 | return ["tweet", "retweet"].map((key) => { 29 | return { 30 | id: key, 31 | data: dates.map((d) => { 32 | return { 33 | x: d, 34 | y: count[key][d], 35 | }; 36 | }), 37 | }; 38 | }); 39 | }; 40 | 41 | const Answer = () => { 42 | return ( 43 | 51 | ); 52 | }; 53 | 54 | export default Answer; 55 | -------------------------------------------------------------------------------- /src/pages/Answer08/answer.md: -------------------------------------------------------------------------------- 1 | タグが共起する回数を数える必要があります。 2 | ここでは、 `count["Python"]["Ruby"]` のようにして `Python` と `Ruby` の共起回数を表すとしましょう。 3 | 各記事について `tags` の添字 `(i, j)` (ただし i < j)で二重ループをするとその記事に含まれるタグの 2 ペアを列挙することができます。 4 | 実装すると以下のようになります。 5 | 6 | ```javascript 7 | for (const item of input) { 8 | const n = item.tags.length; 9 | for (let j = 0; j < n; ++j) { 10 | for (let i = 0; i < j; ++i) { 11 | count[item.tags[i]][item.tags[j]] += 1; 12 | } 13 | } 14 | } 15 | ``` 16 | 17 | `count` を初期化するために、最初に重複しないタグの配列を `Set` を使って作っておくと良いでしょう。 18 | 19 | ただし、1 つ目のタグと 2 つ目のタグの順番について気をつけないといけません。 20 | つまり、`Python` と `Ruby` の共起回数は `count["Python"]["Ruby"]` と `count["Ruby"]["Python"]` のいずれか片方だけで表さないといけません。 21 | 例えば、上記の処理を行う前に、全ての記事のタグをソートしておくとこれを解決できます。 22 | 23 | 共起回数を数え終わったら、共起回数が 2 以上のタグのペアでリンクの配列 `links` を作りましょう。 24 | `count` の値を見ながらタグの配列を二重ループするだけで良いです。 25 | 26 | 最後に、`links` に含まれるタグを重複なく列挙して `nodes` を作る必要があります。 27 | これも リンクの `source` と `target` を `Set` を使って処理すると良いでしょう。 28 | 29 | ```javascript 30 | const convertData = (input) => { 31 | for (const item of input) { 32 | item.tags.sort(); 33 | } 34 | 35 | const tagSet = new Set(); 36 | for (const item of input) { 37 | for (const tag of item.tags) { 38 | tagSet.add(tag); 39 | } 40 | } 41 | const tags = Array.from(tagSet); 42 | 43 | const count = {}; 44 | for (const tag1 of tags) { 45 | count[tag1] = {}; 46 | for (const tag2 of tags) { 47 | count[tag1][tag2] = 0; 48 | } 49 | } 50 | 51 | for (const item of input) { 52 | const n = item.tags.length; 53 | for (let j = 0; j < n; ++j) { 54 | for (let i = 0; i < j; ++i) { 55 | count[item.tags[i]][item.tags[j]] += 1; 56 | } 57 | } 58 | } 59 | 60 | const links = []; 61 | for (const tag1 of tags) { 62 | for (const tag2 of tags) { 63 | if (count[tag1][tag2] >= 2) { 64 | links.push({ 65 | source: tag1, 66 | target: tag2, 67 | }); 68 | } 69 | } 70 | } 71 | 72 | const nodeSet = new Set(); 73 | for (const { source, target } of links) { 74 | nodeSet.add(source); 75 | nodeSet.add(target); 76 | } 77 | 78 | const nodes = Array.from(nodeSet).map((tag) => { 79 | return { 80 | id: tag, 81 | }; 82 | }); 83 | 84 | return { 85 | nodes, 86 | links, 87 | }; 88 | }; 89 | ``` 90 | -------------------------------------------------------------------------------- /src/pages/Answer08/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart08"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | for (const item of input) { 8 | item.tags.sort(); 9 | } 10 | 11 | const tagSet = new Set(); 12 | for (const item of input) { 13 | for (const tag of item.tags) { 14 | tagSet.add(tag); 15 | } 16 | } 17 | const tags = Array.from(tagSet); 18 | 19 | const count = {}; 20 | for (const tag1 of tags) { 21 | count[tag1] = {}; 22 | for (const tag2 of tags) { 23 | count[tag1][tag2] = 0; 24 | } 25 | } 26 | 27 | for (const item of input) { 28 | const n = item.tags.length; 29 | for (let j = 0; j < n; ++j) { 30 | for (let i = 0; i < j; ++i) { 31 | count[item.tags[i]][item.tags[j]] += 1; 32 | } 33 | } 34 | } 35 | 36 | const links = []; 37 | for (const tag1 of tags) { 38 | for (const tag2 of tags) { 39 | if (count[tag1][tag2] >= 2) { 40 | links.push({ 41 | source: tag1, 42 | target: tag2, 43 | }); 44 | } 45 | } 46 | } 47 | 48 | const nodeSet = new Set(); 49 | for (const { source, target } of links) { 50 | nodeSet.add(source); 51 | nodeSet.add(target); 52 | } 53 | 54 | const nodes = Array.from(nodeSet).map((tag) => { 55 | return { 56 | id: tag, 57 | }; 58 | }); 59 | 60 | return { 61 | nodes, 62 | links, 63 | }; 64 | }; 65 | 66 | const Answer = () => { 67 | return ( 68 | 76 | ); 77 | }; 78 | 79 | export default Answer; 80 | -------------------------------------------------------------------------------- /src/pages/Answer09/answer.md: -------------------------------------------------------------------------------- 1 | 全データの中の省 (`ministry`)、省の中の部局 (`bureau`)、部局の中の課(`department`)と言うように 3 つの階層を作る必要があります。 2 | 3 | 今の階層から 1 つ下の階層を作るための処理を考えます。 4 | 例えば、`x` 省の中の部局のデータを作るには、以下のように処理することができます。 5 | 6 | 1. 全データの中から `x` 省の事業を絞り込む 7 | 2. `x` 省の事業に出現する部局を重複なく配列 `bureaus` に格納する 8 | 3. `bureaus` を順番に処理し、各部局に対応するデータを作成する(部局の中の課のデータを作成する) 9 | 4. `bureaus` から、各部局に含まれる事業数が全体の 1%以下の要素を取り除く 10 | 5. `bureaus` を部局に含まれる事業数の降順でソートする 11 | 6. `bureaus` の末尾に、4.で取り除いた事業数の合計を持ったその他の要素を追加する 12 | 13 | 部局の中の課も同様に処理することができます。 14 | 15 | ```javascript 16 | const convertData = (input) => { 17 | const ratio = 0.01; 18 | const ministryCount = {}; 19 | const ministries = Array.from( 20 | new Set(input.map(({ ministry }) => ministry)) 21 | ).map((ministry) => { 22 | const ministryProjects = input.filter((item) => item.ministry === ministry); 23 | const bureauCount = {}; 24 | const bureaus = Array.from( 25 | new Set(ministryProjects.map(({ bureau }) => bureau)) 26 | ) 27 | .map((bureau) => { 28 | const bureauProjects = ministryProjects.filter( 29 | (item) => item.bureau === bureau 30 | ); 31 | const departments = Array.from( 32 | new Set(bureauProjects.map(({ department }) => department)) 33 | ) 34 | .map((department) => { 35 | const departmentProjects = bureauProjects.filter( 36 | (item) => item.department === department 37 | ); 38 | return { 39 | name: department, 40 | count: departmentProjects.length, 41 | }; 42 | }) 43 | .filter(({ count }) => count / input.length >= ratio); 44 | departments.sort((item1, item2) => item2.count - item1.count); 45 | departments.push({ 46 | name: "その他", 47 | count: 48 | bureauProjects.length - 49 | departments.reduce((a, { count }) => a + count, 0), 50 | }); 51 | bureauCount[bureau] = bureauProjects.length; 52 | return { 53 | name: bureau, 54 | children: departments, 55 | }; 56 | }) 57 | .filter(({ name }) => bureauCount[name] / input.length >= ratio); 58 | bureaus.sort( 59 | (item1, item2) => bureauCount[item2.name] - bureauCount[item1.name] 60 | ); 61 | bureaus.push({ 62 | name: "その他", 63 | count: 64 | ministryProjects.length - 65 | bureaus.reduce((a, { name }) => a + bureauCount[name], 0), 66 | }); 67 | ministryCount[ministry] = ministryProjects.length; 68 | return { 69 | name: ministry, 70 | children: bureaus, 71 | }; 72 | }); 73 | ministries.sort( 74 | (item1, item2) => ministryCount[item2.name] - ministryCount[item1.name] 75 | ); 76 | return { 77 | children: ministries, 78 | }; 79 | }; 80 | ``` 81 | -------------------------------------------------------------------------------- /src/pages/Answer09/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart09"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | const ratio = 0.01; 8 | const ministryCount = {}; 9 | const ministries = Array.from( 10 | new Set(input.map(({ ministry }) => ministry)), 11 | ).map((ministry) => { 12 | const ministryProjects = input.filter((item) => item.ministry === ministry); 13 | const bureauCount = {}; 14 | const bureaus = Array.from( 15 | new Set(ministryProjects.map(({ bureau }) => bureau)), 16 | ) 17 | .map((bureau) => { 18 | const bureauProjects = ministryProjects.filter( 19 | (item) => item.bureau === bureau, 20 | ); 21 | const departments = Array.from( 22 | new Set(bureauProjects.map(({ department }) => department)), 23 | ) 24 | .map((department) => { 25 | const departmentProjects = bureauProjects.filter( 26 | (item) => item.department === department, 27 | ); 28 | return { 29 | name: department, 30 | count: departmentProjects.length, 31 | }; 32 | }) 33 | .filter(({ count }) => count / input.length >= ratio); 34 | departments.sort((item1, item2) => item2.count - item1.count); 35 | departments.push({ 36 | name: "その他", 37 | count: 38 | bureauProjects.length - 39 | departments.reduce((a, { count }) => a + count, 0), 40 | }); 41 | bureauCount[bureau] = bureauProjects.length; 42 | return { 43 | name: bureau, 44 | children: departments, 45 | }; 46 | }) 47 | .filter(({ name }) => bureauCount[name] / input.length >= ratio); 48 | bureaus.sort( 49 | (item1, item2) => bureauCount[item2.name] - bureauCount[item1.name], 50 | ); 51 | bureaus.push({ 52 | name: "その他", 53 | count: 54 | ministryProjects.length - 55 | bureaus.reduce((a, { name }) => a + bureauCount[name], 0), 56 | }); 57 | ministryCount[ministry] = ministryProjects.length; 58 | return { 59 | name: ministry, 60 | children: bureaus, 61 | }; 62 | }); 63 | ministries.sort( 64 | (item1, item2) => ministryCount[item2.name] - ministryCount[item1.name], 65 | ); 66 | return { 67 | children: ministries, 68 | }; 69 | }; 70 | 71 | const Answer = () => { 72 | return ( 73 | 81 | ); 82 | }; 83 | 84 | export default Answer; 85 | -------------------------------------------------------------------------------- /src/pages/Answer10/answer.md: -------------------------------------------------------------------------------- 1 | やることは、(1) 次数が 1 のノードとそこから伸びるリンクを取り除く、(2) `id` が「福島」のノードから始まり、そこから `source` と `target` をつないで辿れるノードを全て見つける、(3) 面積が `frequency` に比例するように `radius` を決めることの 3 つです。 2 | 順番に行っていきましょう。 3 | 4 | はじめに、各ノードの次数を求めます。 5 | 最初に全てのハッシュタグの次数として 0 を持った `degree` を初期化しておきます。 6 | `input.links` を順番に処理し、`source` と `target` に対応するハッシュタグの次数をそれぞれ 1 ずつ増やすていくことで全ノードの次数を求めることができます。 7 | あとは次数が 2 以上のハッシュタグを残すように `input.nodes` と `input.links` に `filter` を適用します。 8 | 9 | 次に、次数 1 のノードを取り除いたデータを有向グラフとして、「福島」ハッシュタグから到達可能なノードの集合を得ます。 10 | あるハッシュタグを `source` として、そこから `target` としてつながっているハッシュタグを配列として持っておけば良いでしょう。 11 | 具体的には、以下のようなデータ構造になります。 12 | 13 | ```json 14 | { 15 | 16 | : 17 | "福島": ["嘆願", "フク", "放射性物質", "フクイチ", "拡散", "拡張希望", "フクイチ嘆願", "フクイ", "フ", "放射線量", "放射性物質"], 18 | "放射性物質": ["フクイチ", "拡張希望", "フクイチ嘆願", "フクイ", "フ"], 19 | : 20 | } 21 | ``` 22 | 23 | このデータ構造は、グラフの隣接リストと呼ばれるものです。 24 | 25 | 隣接リストが構築できたら、「福島」を開始ノードとして、グラフの深さ優先探索または幅優先探索を行うことで到達可能なノードを求めることができます。 26 | 以下の実装例では、キュー(queue)を使った幅優先探索を行っています。 27 | JavaScript では、配列の先頭から要素を取り出す `shift` と配列の末尾に要素を追加する `push` を使うことで配列をキューのように扱うことができます。 28 | 29 | 最後に、面積が`frequency` の値に比例するように`radius` を決めるためには、`radius` は `frequency` の平方根に比例するようにしなければいけません。 30 | まずは `frequency` の値を 0 から 1 の範囲に正規化するために、`frequency` の値を`frequency` の最大値で割りましょう。 31 | 正規化した `frequency` の値の平方根と`radius` の最大値 20 を掛けた値を`radius` とすれば目的が達せられます。 32 | 例えば、`frequency` の最大値が 100 のときの場合で考えてみましょう。 33 | `frequency` の値が 100 であれば、正規化した値は 1.0 であり、`radius` の値は 20 となります。 34 | このときの面積は 400π です。 35 | もう 1 つ `frequency` の値が 50 であれば正規化した値は 0.5 であり、`radius` はその平方根に 20 を掛けた 14.12... です。 36 | このときの面積は約 200π で、確かに`frequency` の値と面積が比例するように計算できていることが確かめられます。 37 | 38 | ```javascript 39 | const convertData = (input) => { 40 | const degree = {}; 41 | for (const { id } of input.nodes) { 42 | degree[id] = 0; 43 | } 44 | for (const { source, target } of input.links) { 45 | degree[source] += 1; 46 | degree[target] += 1; 47 | } 48 | 49 | const removedTags = new Set( 50 | input.nodes.map(({ id }) => id).filter((tag) => degree[tag] <= 1) 51 | ); 52 | const nodes = input.nodes.filter(({ id }) => !removedTags.has(id)); 53 | const links = input.links.filter( 54 | ({ source, target }) => !removedTags.has(source) && !removedTags.has(target) 55 | ); 56 | 57 | const neighbors = {}; 58 | for (const { id } of nodes) { 59 | neighbors[id] = []; 60 | } 61 | for (const { source, target } of links) { 62 | neighbors[source].push(target); 63 | } 64 | 65 | const visited = new Set(); 66 | const queue = ["福島"]; 67 | while (queue.length > 0) { 68 | const u = queue.shift(); 69 | if (visited.has(u)) { 70 | continue; 71 | } 72 | visited.add(u); 73 | for (const v of neighbors[u]) { 74 | queue.push(v); 75 | } 76 | } 77 | 78 | const maxFrequency = Math.max( 79 | ...input.nodes.map(({ frequency }) => frequency) 80 | ); 81 | for (const node of nodes) { 82 | node.radius = Math.sqrt(node.frequency / maxFrequency) * 20; 83 | node.color = visited.has(node.id) ? "red" : "blue"; 84 | } 85 | 86 | return { nodes, links }; 87 | }; 88 | ``` 89 | -------------------------------------------------------------------------------- /src/pages/Answer10/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import AnswerPage from "../../components/AnswerPage"; 3 | import Chart from "../../components/Chart10"; 4 | import answer from "./answer.md?raw"; 5 | 6 | const convertData = (input) => { 7 | const degree = {}; 8 | for (const { id } of input.nodes) { 9 | degree[id] = 0; 10 | } 11 | for (const { source, target } of input.links) { 12 | degree[source] += 1; 13 | degree[target] += 1; 14 | } 15 | 16 | const removedTags = new Set( 17 | input.nodes.map(({ id }) => id).filter((tag) => degree[tag] <= 1), 18 | ); 19 | const nodes = input.nodes.filter(({ id }) => !removedTags.has(id)); 20 | const links = input.links.filter( 21 | ({ source, target }) => 22 | !removedTags.has(source) && !removedTags.has(target), 23 | ); 24 | 25 | const neighbors = {}; 26 | for (const { id } of nodes) { 27 | neighbors[id] = []; 28 | } 29 | for (const { source, target } of links) { 30 | neighbors[source].push(target); 31 | } 32 | 33 | const visited = new Set(); 34 | const queue = ["福島"]; 35 | while (queue.length > 0) { 36 | const u = queue.shift(); 37 | if (visited.has(u)) { 38 | continue; 39 | } 40 | visited.add(u); 41 | for (const v of neighbors[u]) { 42 | queue.push(v); 43 | } 44 | } 45 | 46 | const maxFrequency = Math.max( 47 | ...input.nodes.map(({ frequency }) => frequency), 48 | ); 49 | for (const node of nodes) { 50 | node.radius = Math.sqrt(node.frequency / maxFrequency) * 20; 51 | node.color = visited.has(node.id) ? "red" : "blue"; 52 | } 53 | 54 | return { nodes, links }; 55 | }; 56 | 57 | const Answer = () => { 58 | return ( 59 | 67 | ); 68 | }; 69 | 70 | export default Answer; 71 | -------------------------------------------------------------------------------- /src/pages/Home/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { 3 | IonButtons, 4 | IonContent, 5 | IonHeader, 6 | IonMenuButton, 7 | IonTitle, 8 | IonToolbar, 9 | IonPage, 10 | } from "@ionic/react"; 11 | 12 | const Home = () => { 13 | return ( 14 | 15 | 16 | 17 | 18 | 19 | 20 | Introduction 21 | 22 | 23 | 24 |
25 |

日本大学文理学部情報科学科尾上ゼミのJavaScript演習資料です。

26 |

27 | リポジトリ 28 | を読んで演習を進めましょう。 29 |

30 |
31 |
32 |
33 | ); 34 | }; 35 | 36 | export default Home; 37 | -------------------------------------------------------------------------------- /src/pages/Lesson01/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart01"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson01/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは日本大学文理学部の各学科の定員を棒グラフで表示したいと思っています。 2 | 3 | データが `input` として以下のように与えられます。 4 | 5 | ```json 6 | [ 7 | ["哲学科", 88], 8 | ["史学科", 133], 9 | ["国文学科", 133], 10 | : 11 | ["情報科学科", 80], 12 | ["物理学科", 70], 13 | ["生命科学科", 70], 14 | ["化学科", 90] 15 | ] 16 | ``` 17 | 18 | 棒グラフを表示するために、`input` を以下のようなオブジェクトの配列に変換する必要があります。 19 | 20 | ```json 21 | [ 22 | { "name": "哲学科", "count": 88 }, 23 | { "name": "史学科", "count": 133 }, 24 | { "name": "国文学科", "count": 133 }, 25 | : 26 | { "name": "情報科学科", "count": 80 }, 27 | { "name": "物理学科", "count": 70 }, 28 | { "name": "生命科学科", "count": 70 }, 29 | { "name": "化学科", "count": 90 } 30 | ] 31 | ``` 32 | 33 | おのうえさんはうまくデータを変換することができませんでした。 34 | おのうえさんを助けるために、`src/pages/Lesson01/index.js` を開き `input` のデータを目的の形式に変換する関数 `convertData` を実装してください。 35 | 36 | ```javascript 37 | const convertData = (input) => { 38 | return []; // ここを作りましょう! 39 | }; 40 | ``` 41 | -------------------------------------------------------------------------------- /src/pages/Lesson02/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart02"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson02/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは [Qiita](https://qiita.com) に投稿された記事に付けられているタグの集計をしました。 2 | 3 | 集計結果は `input` として以下のように与えられます。 4 | 5 | ```json 6 | [ 7 | { "tag": "JavaScript", "count": 30644 }, 8 | { "tag": "Node.js", "count": 10235 }, 9 | { "tag": "CI", "count": 598 }, 10 | { "tag": "java8", "count": 951 }, 11 | : 12 | ] 13 | ``` 14 | 15 | おのうえさんはこの中から`count` の数が上位 20 件のデータを棒グラフで表示したいと思っています。 16 | 17 | おのうえさんはうまくデータを変換することができませんでした。 18 | おのうえさんを助けるために、`src/pages/Lesson02/index.js` を開き`input` から `count` が上位 20 件の要素のみを取り出した配列を返す関数 `convertData` を実装してください。 19 | 20 | ```javascript 21 | const convertData = (input) => { 22 | return []; // ここを作りましょう! 23 | }; 24 | ``` 25 | -------------------------------------------------------------------------------- /src/pages/Lesson03/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart03"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | { 16 | return [ 17 | { 18 | id: "男性", 19 | data: convertData(input), 20 | }, 21 | ]; 22 | }} 23 | instruction={instruction} 24 | title="Lesson 03" 25 | Chart={Chart} 26 | /> 27 | ); 28 | }; 29 | 30 | export default Lesson; 31 | -------------------------------------------------------------------------------- /src/pages/Lesson03/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは 200 人分の男女の身長と体重のデータを持っています。 2 | (出典:[日本人 20 歳の身長と体重サンプルデータ - Excel VBA 数学教室](https://excelmath.atelierkobato.com/height/)) 3 | 4 | データは `input` として以下のように与えられます。 5 | 6 | ```json 7 | [ 8 | { "name": "宇内 歓行", "gender": "男性", "y": 183.87, "x": 85.54 }, 9 | { "name": "大小原 康幸", "gender": "男性", "y": 179.54, "x": 80.94 }, 10 | { "name": "朝永 孝幸", "gender": "男性", "y": 173.62, "x": 72.99 }, 11 | { "name": "瀬治山 啓之", "gender": "男性", "y": 167.83, "x": 62.86 }, 12 | : 13 | ] 14 | 15 | ``` 16 | 17 | おのうえさんはこの中から男性のデータのみを散布図で表示したいと思っています。 18 | 19 | おのうえさんはうまくデータを変換することができませんでした。 20 | おのうえさんを助けるために、`src/pages/Lesson03/index.js` を開き `input` から `gender` が男性の要素のみを取り出した配列を返す関数 `convertData` を実装してください。 21 | 22 | ```javascript 23 | const convertData = (input) => { 24 | return []; // ここを作りましょう! 25 | }; 26 | ``` 27 | -------------------------------------------------------------------------------- /src/pages/Lesson04/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart04"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson04/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんはデータサイエンティストを目指すため、iris データセットの分析をしようと思いました。 2 | 3 | iris データセットにはアヤメのがく片の長さ(sepalLength)、がく片の幅(sepalWidth)、花びらの長さ(petalLength)、花びらの幅(petalWidth)、アヤメの品種(species)の 5 つの属性が各個体ごとに含まれています。 4 | 5 | iris データセットは `input` として以下のように与えられます。 6 | 7 | ```json 8 | [ 9 | { 10 | "sepalLength": 5.1, 11 | "sepalWidth": 3.5, 12 | "petalLength": 1.4, 13 | "petalWidth": 0.2, 14 | "species": "setosa" 15 | }, 16 | { 17 | "sepalLength": 4.9, 18 | "sepalWidth": 3.0, 19 | "petalLength": 1.4, 20 | "petalWidth": 0.2, 21 | "species": "setosa" 22 | }, 23 | { 24 | "sepalLength": 4.7, 25 | "sepalWidth": 3.2, 26 | "petalLength": 1.3, 27 | "petalWidth": 0.2, 28 | "species": "setosa" 29 | }, 30 | : 31 | ] 32 | ``` 33 | 34 | おのうえさんは、手始めにがく片の長さと花びらの幅の関係を散布図として表示したいと思っています。 35 | なおかつ、散布図の点はアヤメの品種ごとに変えたいと思っています。 36 | 37 | 目的の散布図を表示するためには、以下のような形式のデータを用意する必要があります。 38 | 39 | ```json 40 | [ 41 | { 42 | "id": "setosa", 43 | "data": [ 44 | { "x": 5.1, "y": 0.2 }, 45 | { "x": 4.9, "y": 0.2 }, 46 | { "x": 4.7, "y": 0.2 }, 47 | : 48 | ] 49 | }, 50 | { 51 | "id": "versicolor", 52 | "data": [ 53 | { "x": 7, "y": 1.4 }, 54 | { "x": 6.4, "y": 1.5 }, 55 | { "x": 6.9, "y": 1.5 }, 56 | : 57 | ] 58 | }, 59 | : 60 | ] 61 | ``` 62 | 63 | 目的の形式は、アヤメの品種ごとに `id` 属性と `data` 属性を持った配列です。 64 | `id` にはアヤメの品種の名前、`data` にはその品種のがく片の長さを `x` 、花びらの幅を `y` とした値が含まれています。 65 | 66 | おのうえさんはうまくデータを変換することができませんでした。 67 | おのうえさんを助けるために、`src/pages/Lesson04/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 68 | 69 | ```javascript 70 | const convertData = (input) => { 71 | return []; // ここを作りましょう! 72 | }; 73 | ``` 74 | -------------------------------------------------------------------------------- /src/pages/Lesson05/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart05"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson05/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは 200 人分の男女の身長と体重のデータを持っています。 2 | (出典:[日本人 20 歳の身長と体重サンプルデータ - Excel VBA 数学教室](https://excelmath.atelierkobato.com/height/)) 3 | 4 | データは `input` として以下のように与えられます。 5 | 6 | ```json 7 | [ 8 | { "name": "宇内 歓行", "gender": "男性", "y": 183.87, "x": 85.54 }, 9 | { "name": "大小原 康幸", "gender": "男性", "y": 179.54, "x": 80.94 }, 10 | { "name": "朝永 孝幸", "gender": "男性", "y": 173.62, "x": 72.99 }, 11 | { "name": "瀬治山 啓之", "gender": "男性", "y": 167.83, "x": 62.86 }, 12 | : 13 | ] 14 | 15 | ``` 16 | 17 | `y` は身長、 `x` は体重を表しています。 18 | 19 | おのうえさんは、身長のヒストグラムを表示したいと思いました。 20 | そのためには、それぞれの人の身長を小数点以下で四捨五入し、その値の人が何人いるかの頻度を数える必要があります。 21 | また、それぞれの身長の中で男女を色分けして内訳を表したいと思っています。 22 | 23 | 目的のヒストグラムを表示するために以下のような集計データを作る必要があります。 24 | 25 | ```json 26 | [ 27 | : 28 | { "bin": "155", "男性": 0, "女性": 3 }, 29 | { "bin": "156", "男性": 0, "女性": 9 }, 30 | { "bin": "157", "男性": 4, "女性": 5 }, 31 | { "bin": "158", "男性": 1, "女性": 4 }, 32 | { "bin": "159", "男性": 0, "女性": 6 }, 33 | { "bin": "160", "男性": 2, "女性": 2 }, 34 | { "bin": "161", "男性": 4, "女性": 8 }, 35 | { "bin": "162", "男性": 1, "女性": 7 }, 36 | { "bin": "163", "男性": 4, "女性": 5 }, 37 | { "bin": "164", "男性": 2, "女性": 5 }, 38 | : 39 | ] 40 | ``` 41 | 42 | 各要素の `bin` には身長の値を表す文字列が、`男性` と `女性` にはこの身長の値に該当する男女それぞれの人数が格納されています。 43 | 44 | おのうえさんはうまくデータを変換することができませんでした。 45 | おのうえさんを助けるために、`src/pages/Lesson05/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 46 | 47 | ```javascript 48 | const convertData = (input) => { 49 | return []; // ここを作りましょう! 50 | }; 51 | ``` 52 | -------------------------------------------------------------------------------- /src/pages/Lesson06/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart06"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson06/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは 200 人分の男女の身長と体重のデータを持っています。 2 | (出典:[日本人 20 歳の身長と体重サンプルデータ - Excel VBA 数学教室](https://excelmath.atelierkobato.com/height/)) 3 | 4 | データは `input` として以下のように与えられます。 5 | 6 | ```json 7 | [ 8 | { "name": "宇内 歓行", "gender": "男性", "y": 183.87, "x": 85.54 }, 9 | { "name": "大小原 康幸", "gender": "男性", "y": 179.54, "x": 80.94 }, 10 | { "name": "朝永 孝幸", "gender": "男性", "y": 173.62, "x": 72.99 }, 11 | { "name": "瀬治山 啓之", "gender": "男性", "y": 167.83, "x": 62.86 }, 12 | : 13 | ] 14 | 15 | ``` 16 | 17 | `y` は身長(cm)、 `x` は体重(kg)を表しています。 18 | 19 | おのうえさんは、性別と BMI、体重、身長の関係を平行座標プロットで表示しようと思いました。 20 | そのためには、以下のような形式のデータを用意する必要があります。 21 | 22 | ```json 23 | [ 24 | { 25 | "color": "blue", 26 | "gender": "男性", 27 | "bmi": 25.301571348557395, 28 | "weight": 85.54, 29 | "height": 183.87 30 | }, 31 | { 32 | "color": "blue", 33 | "gender": "男性", 34 | "bmi": 25.109655734148824, 35 | "weight": 80.94, 36 | "height": 179.54 37 | }, 38 | { 39 | "color": "blue", 40 | "gender": "男性", 41 | "bmi": 24.213850678215394, 42 | "weight": 72.99, 43 | "height": 173.62 44 | }, 45 | { 46 | "color": "blue", 47 | "gender": "男性", 48 | "bmi": 22.316967837390205, 49 | "weight": 62.86, 50 | "height": 167.83 51 | }, 52 | : 53 | ] 54 | ``` 55 | 56 | `bmi` は、体重(kg) / 身長(m) ^ 2 で計算する必要があります。 57 | また、`color` には、男性は `blue` 、女性は `red` を格納します。 58 | 59 | おのうえさんはうまくデータを変換することができませんでした。 60 | おのうえさんを助けるために、`src/pages/Lesson06/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 61 | 62 | ```javascript 63 | const convertData = (input) => { 64 | return []; // ここを作りましょう! 65 | }; 66 | ``` 67 | -------------------------------------------------------------------------------- /src/pages/Lesson07/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart07"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return []; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson07/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは 日本時間で 2020 年 1 月 26 日から 2020 年 2 月 1 日の 1 週間の間に行われた新型コロナウイルス関係のツイートとリツイートの一部を入手しました。 2 | 3 | データは `input` として以下のように与えられます。 4 | 5 | ```json 6 | [ 7 | { 8 | "createdAt": "2020-01-25 15:02:17", 9 | "text": "@Yuri_FoL お疲れ様でした。自分は体調不良でポケ活できませんでした。明日はラティオス色違い狙いに東京に行く予定です。コロナウイルスには気をつけます。", 10 | "isRetweet": true 11 | }, 12 | { 13 | "createdAt": "2020-01-25 15:10:22", 14 | "text": "コロナウィルスもろてくるわ😊 https://t.co/b0aH6IjDvH", 15 | "isRetweet": true 16 | }, 17 | { 18 | "createdAt": "2020-01-25 15:12:54", 19 | "text": "凄い政策に〜でも遅かったかな汗\n中国、27日から海外団体旅行を禁止 新型肺炎拡散防止で: 日本経済新聞 https://t.co/mUlafCh27h", 20 | "isRetweet": false 21 | }, 22 | { 23 | "createdAt": "2020-01-25 15:17:14", 24 | "text": "これは良い口実が出来た。二階よ。良く読んで見ろよ。\n安倍首相の政権維持にも関わる習近平国賓招待来日は今回の新型肺炎を理由に断る事が出来る。\n\n中国・習近平主席「国賓来日」に暗雲! 新型肺炎が“春節パンデミック”の恐れ…初期段階での… https://t.co/M8ZNj5rJWf", 25 | "isRetweet": true 26 | }, 27 | : 28 | ] 29 | ``` 30 | 31 | `createdAt` は日付を表していますが、UTC(協定世界時)で表されているため、日本時間(GMT+09:00)からマイナス 9 時間ずれています。 32 | すなわち、データ上の"2020-01-25 15:02:17" は日本時間の"2020-01-26 00:02:17"を表しています。 33 | また、`isRetweet` は `true` のときリツイートを、 `false` のときリツイートではないツイートであることを表しています。 34 | 35 | おのうえさんは、このデータのツイートとリツイートの件数を 1 日ごとに折れ線グラフで表示しようと思いました。 36 | そのためには、以下のような形式のデータを用意する必要があります。 37 | 38 | ```json 39 | [ 40 | { 41 | "id": "tweet", 42 | "data": [ 43 | : 44 | { "x": "2020-01-28", "y": 72 }, 45 | { "x": "2020-01-29", "y": 89 }, 46 | { "x": "2020-02-01", "y": 59 } 47 | : 48 | ] 49 | }, 50 | { 51 | "id": "retweet", 52 | "data": [ 53 | : 54 | { "x": "2020-01-28", "y": 49 }, 55 | { "x": "2020-01-29", "y": 95 }, 56 | { "x": "2020-01-30", "y": 85 }, 57 | : 58 | ] 59 | } 60 | ] 61 | ``` 62 | 63 | `x` はツイートが行われた日付を、`y` はその日のツイートまたはリツイートの件数を表しています。 64 | 65 | おのうえさんはうまくデータを変換することができませんでした。 66 | おのうえさんを助けるために、`src/pages/Lesson07/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 67 | 68 | ```javascript 69 | const convertData = (input) => { 70 | return []; // ここを作りましょう! 71 | }; 72 | ``` 73 | -------------------------------------------------------------------------------- /src/pages/Lesson08/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart08"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return { nodes: [], links: [] }; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson08/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは 2019 年 4 月に Qiita に投稿された記事に付けられたタグのリストを入手しました。 2 | 3 | データは `input` として以下のように与えられます。 4 | 5 | ```json 6 | [ 7 | { "id": "602b2731267295fd2b9d", "tags": ["Python", "Windows", "初心者", "Python3", "VSCode"] }, 8 | { "id": "2bd7cfbbfb829893b22d", "tags": ["jsdo", "複素数"] }, 9 | { "id": "36365bcdf30eaea65250", "tags": ["Rails", "jQuery", "Ajax"] }, 10 | { "id": "20cc50c5d6c4bfdb351f", "tags": ["Ansible", "inspec"] }, 11 | { "id": "9391b263683ba1846aa0", "tags": ["PHP", "EC-CUBE", "新元号", "令和"] }, 12 | : 13 | ] 14 | ``` 15 | 16 | おのうえさんは、このデータのタグの共起関係をネットワーク図で表示しようと思いました。 17 | すなわち、タグをネットワークのノードとし、同じ記事内に含まれる全てのタグのペアをネットワークのリンクで結びます。 18 | 例えば、ある記事のタグが `Python`, `Ruby`, `初心者` の 3 つであるとき、`Python` と `Ruby`、`Python` と `初心者`、`Ruby` と `初心者` の 3 つのペアがリンクで結ばれます。 19 | 20 | ただし、全ての共起関係をネットワーク図にすると複雑になるなので、あるタグのペアを含んだ記事が 2 つ以上あるもののみを表示することにしました。 21 | 例えば、 `Python` と `Ruby` の間のリンクが存在するためには、 `Python` と `Ruby` の 2 つともを含んだ記事が 2 個以上ある必要があります。 22 | 23 | 目的のネットワーク図を表示するためには以下のような形式のデータを用意する必要があります。 24 | 25 | ```json 26 | { 27 | "nodes": [ 28 | { "id": ".NET" }, 29 | { "id": "AWS" }, 30 | { "id": "ActiveRecord" }, 31 | { "id": "Ajax" }, 32 | { "id": "Android" }, 33 | : 34 | ], 35 | "links": [ 36 | { "source": ".NET", "target": "C#" }, 37 | { "source": "AWS", "target": "CloudFront" }, 38 | { "source": "AWS", "target": "EC2" }, 39 | { "source": "AWS", "target": "ENI" }, 40 | { "source": "AWS", "target": "Linux" }, 41 | : 42 | ] 43 | } 44 | ``` 45 | 46 | データは `nodes` と `links` の 2 つのプロパティを持ちます。 47 | `nodes` はノードの配列で、各要素は `id` プロパティにタグ名を格納します。 48 | `links` はリンクの配列で、各要素は `source` と `target` それぞれにそのリンクが結ぶ 2 つのタグ名を格納します。 49 | 50 | ここで、`links` には、`source` と `target` を入れ替えた要素が含まれてはいけません。 51 | 例えば、`Python` と `Ruby` のタグのリンクは、 `{ "source": "Python", "target": "Ruby" }` か `{ "source": "Ruby", "target": "Python" }` のいずれか片方だけしか含まれていてはいけません。 52 | 53 | おのうえさんはうまくデータを変換することができませんでした。 54 | おのうえさんを助けるために、`src/pages/Lesson08/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 55 | 56 | ```javascript 57 | const convertData = (input) => { 58 | return { nodes: [], links: [] }; // ここを作りましょう! 59 | }; 60 | ``` 61 | -------------------------------------------------------------------------------- /src/pages/Lesson09/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart09"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return { children: [] }; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson09/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは、2018 年に行われた文部科学省、経済産業省、総務省の 3 省の行政事業のリストを入手しました。 2 | 事業は各省(ministry)の中の部局(bureau)の中の担当課(department)によって実施されます。 3 | 4 | データは `input` として以下のように与えられます。 5 | 6 | ```json 7 | [ 8 | { 9 | "projectName": "地方教育費及び行政の実態調査", 10 | "ministry": "文部科学省", 11 | "bureau": "総合教育政策局", 12 | "department": "調査企画課" 13 | }, 14 | { 15 | "projectName": "外国教育事情等調査", 16 | "ministry": "文部科学省", 17 | "bureau": "総合教育政策局", 18 | "department": "調査企画課" 19 | }, 20 | { 21 | "projectName": "学校基本調査", 22 | "ministry": "文部科学省", 23 | "bureau": "総合教育政策局", 24 | "department": "調査企画課" 25 | }, 26 | : 27 | ] 28 | ``` 29 | 30 | おのうえさんは、各部局・担当課の事業数をサンバースト図で表示しようと思いました。 31 | サンバースト図では、事業の数を省の中の部局、部局の中の課と階層的に表します。 32 | 33 | 全データの中の省、省の中の部局、部局の中の課はそれぞれ、その要素に含まれる事業数の降順でソートします。 34 | また、サンバースト図を描く上で、事業数の少ない部局と課を表示しないために、事業数が全体の 1%に満たない部局と課は「その他」としてまとめることにしました。 35 | その他は、そこの含まれる事業数によらず、それぞれの階層の一番末尾に表示します。 36 | 37 | 目的のサンバースト図を表示するためには以下のような形式のデータを用意する必要があります。 38 | 39 | ```json 40 | { 41 | "children": [ 42 | { 43 | "name": "文部科学省", 44 | "children": [ 45 | { 46 | "name": "総合教育政策局", 47 | "children": [ 48 | { "name": "地域学習推進課", "count": 15 }, 49 | { "name": "生涯学習推進課", "count": 14 }, 50 | { "name": "調査企画課", "count": 13 }, 51 | { "name": "その他", "count": 29 } 52 | ] 53 | }, 54 | { 55 | "name": "初等中等教育局", 56 | "children": [ 57 | { "name": "その他", "count": 65 } 58 | ] 59 | }, 60 | : 61 | { 62 | "name": "その他", 63 | "count": 35 64 | } 65 | ] 66 | }, 67 | { 68 | "name": "経済産業省", 69 | "children": [ 70 | { 71 | "name": "資源エネルギー庁 資源・燃料部", 72 | "children": [ 73 | { "name": "石油精製備蓄課", "count": 16 }, 74 | { "name": "石油流通課", "count": 14 }, 75 | { "name": "その他", "count": 22 } 76 | ] 77 | }, 78 | { 79 | "name": "産業技術環境局", 80 | "children": [ 81 | { "name": "その他", "count": 49 } 82 | ] 83 | }, 84 | : 85 | { 86 | "name": "その他", 87 | "count": 109 88 | } 89 | ] 90 | }, 91 | : 92 | } 93 | ``` 94 | 95 | 子を持たない要素(課またはその他の部局)は、そこに含まれる事業数を `count` プロパティに持ちます。 96 | それ以外の要素は、その下に含まれる子要素の配列を `children` プロパティに持ちます。 97 | また、各要素はそれぞれの省名、部局名、課名を `name` プロパティに持ちます。 98 | 99 | おのうえさんはうまくデータを変換することができませんでした。 100 | おのうえさんを助けるために、`src/pages/Lesson09/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 101 | 102 | ```javascript 103 | const convertData = (input) => { 104 | return { children: [] }; // ここを作りましょう! 105 | }; 106 | ``` 107 | -------------------------------------------------------------------------------- /src/pages/Lesson10/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import LessonPage from "../../components/LessonPage"; 3 | import Chart from "../../components/Chart10"; 4 | import instruction from "./instruction.md?raw"; 5 | 6 | const convertData = (input) => { 7 | return { nodes: [], links: [] }; // ここを作りましょう! 8 | }; 9 | 10 | const Lesson = () => { 11 | return ( 12 | 20 | ); 21 | }; 22 | 23 | export default Lesson; 24 | -------------------------------------------------------------------------------- /src/pages/Lesson10/instruction.md: -------------------------------------------------------------------------------- 1 | おのうえさんは、福島第一原子力発電所事故に関連する話題の遷移ネットワークのデータを入手しました。 2 | 話題の遷移とは、ある話題のあとにある話題が起こったという有向グラフで表されます。 3 | ここで、話題とは特に Twitter 上のハッシュタグを表しています。 4 | 5 | データは `input` として以下のように与えられます。 6 | 7 | ```json 8 | { 9 | "nodes": [ 10 | { "frequency": 742, "id": "nuclearjp" }, 11 | { "frequency": 14493, "id": "genpatsu" }, 12 | { "frequency": 660, "id": "fukunp" }, 13 | { "frequency": 358, "id": "kaminoseki" }, 14 | { "frequency": 455, "id": "放射能汚染" }, 15 | : 16 | ], 17 | "links": [ 18 | { "source": "nuclearjp", "target": "genpatsu" }, 19 | { "source": "nuclearjp", "target": "原発" }, 20 | { "source": "genpatsu", "target": "fukunp" }, 21 | { "source": "genpatsu", "target": "kaminoseki" }, 22 | { "source": "genpatsu", "target": "放射能汚染" }, 23 | : 24 | ] 25 | } 26 | ``` 27 | 28 | `nodes` は話題遷移ネットワークのノードを表していて、`id` は話題を表すハッシュタグ、`frequency` はそのハッシュタグが現れた回数です。 29 | `links` は話題遷移ネットワークのリンクを表していて、`source`のハッシュタグから`target`のハッシュタグへ話題が移ったことを表しています。 30 | 31 | おのうえさんは、このデータをネットワーク図として表示しようとしています。 32 | ただし、ネットワークを簡略化するために、1 本しかリンクを持たない、すなわち次数が 1 のノードを取り除きたいです。 33 | そして、ノードの面積はノードの `frequency` の値に比例するようにしようと思っています。 34 | ノードの面積は、ノードの半径を表す `radius` プロパティで決定されます。 35 | 最も大きいノードの半径の値は 20 にすることにしました。 36 | 37 | さらに、おのうえさんはハッシュタグ「福島」からの話題の遷移に注目しようと思ったので、「福島」から遷移する全てのノードを赤色で塗り、それ以外のノードは青色で塗ることにしました。 38 | ノードの色は、ノードの`color` プロパティで変更でき、赤色は `"red"`、青色は`"blue"` をそれぞれ `color` プロパティに設定します。 39 | 40 | ネットワーク図の表示に必要なデータの形式は `input` と同様ですが、不要なノードとリンクを取り除き、各ノードには `radius` と `color` プロパティを適切に設定する必要があります。 41 | 42 | おのうえさんはうまくデータを変換することができませんでした。 43 | おのうえさんを助けるために、`src/pages/Lesson10/index.js` を開き `input` のデータを目的の形式に変換する `convertData` を実装してください。 44 | 45 | ```javascript 46 | const convertData = (input) => { 47 | return { nodes: [], links: [] }; // ここを作りましょう! 48 | }; 49 | ``` 50 | -------------------------------------------------------------------------------- /vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from "vite"; 2 | import react from "@vitejs/plugin-react"; 3 | 4 | export default defineConfig({ 5 | plugins: [react()], 6 | build: { 7 | chunkSizeWarningLimit: 3000, 8 | }, 9 | }); 10 | --------------------------------------------------------------------------------