うん、いい感じ。
Contents
Bootstrap Table お試せた
ファーストお試せた
Bootstrap table。フリー、オープン、かな。GitHub で管理されてて Donate 言うてるということは。
| name | members | score | dropped | votes | kurtosis | skew |
|---|---|---|---|---|---|---|
| 3月のライオン 第2シリーズ | 47819 | 8.78 | 0.5 |  |
-0.86397 | 0.94986 |
| アグレッシブ烈子 | 10390 | 7.49 | 8.1 |  |
-0.72291 | 0.73413 |
| アイカツスターズ！ | 7637 | 7.35 | 8.0 |  |
-1.26476 | 0.38567 |
| ボールルームへようこそ | 96372 | 8.37 | 4.1 |  |
-0.97778 | 0.79052 |
| ブラッククローバー | 155697 | 6.57 | 8.9 |  |
-0.60210 | 0.60693 |
| ブレンド・S | 101063 | 7.66 | 2.4 |  |
-0.61915 | 0.87345 |
| BORUTO -NARUTO NEXT GENERATIONS- | 168005 | 7.25 | 6.0 |  |
-0.73602 | 0.70465 |
| CARDFIGHT!! ヴァンガードG Z | 1498 | 6.91 | 5.0 |  |
0.52320 | 1.10706 |
| ちびまる子ちゃん | 1510 | 7.39 | 20.8 |  |
-1.47405 | 0.23226 |
| 「映画 中二病でも恋がしたい！ -Take On Me-」ミニドラマ『公開直前の・・・回顧劇場』 | 2825 | 7.28 | 0.6 |  |
3.69334 | 2.22016 |
| シンデレラガールズ劇場 第2期 | 3699 | 6.74 | 2.4 |  |
-0.74577 | 0.74099 |
| 클로저스 : SIDE BLACKLAMBS | 8705 | 7.08 | 2.9 |  |
-1.19092 | 0.36578 |
| Code:Realize ～創世の姫君～ | 37633 | 6.58 | 10.0 |  |
-1.19859 | 0.47130 |
| クレヨンしんちゃん | 31675 | 7.73 | 25.3 |  |
-1.60955 | 0.32466 |
| 名探偵コナン | 143707 | 8.25 | 15.3 |  |
-1.60830 | 0.44326 |
| ドラえもん (2005) | 4211 | 7.59 | 19.3 |  |
-1.51141 | 0.28359 |
| ドラゴンボール超（スーパー） | 194417 | 7.49 | 7.4 |  |
-1.41126 | 0.38350 |
| Fate/Apocrypha | 133541 | 7.24 | 5.3 |  |
-0.80583 | 0.71288 |
| Fate/Grand Order | 2832 | 7.2 | 2.0 |  |
-0.74735 | 0.50660 |
| 牙狼＜GARO＞-VANISHING LINE- | 27766 | 7.18 | 6.0 |  |
-0.43851 | 0.93555 |
| 銀魂。ポロリ編 | 39172 | 8.91 | 1.0 |  |
2.73799 | 1.98536 |
| グランクレスト戦記 | 13261 | 7.54 | 0.1 |  |
1.02438 | 1.35002 |
| ぐでたま | 3986 | 7.36 | 7.2 |  |
-0.84210 | 0.65240 |
| ガンダムビルドファイターズ バトローグ | 2685 | 7.05 | 2.5 |  |
-0.15968 | 1.03766 |
| 干物妹！うまるちゃんR | 67857 | 7.62 | 2.0 |  |
-0.84587 | 0.74367 |
| 一人之下 THE OUTCAST 2ndシーズン | 4552 | 7.33 | 0.7 |  |
0.55757 | 1.19888 |
| 鬼灯の冷徹 第弐期 | 15378 | 7.84 | 1.5 |  |
-0.72416 | 0.79038 |
| 宝石の国 | 49118 | 8.09 | 3.2 |  |
-1.40338 | 0.54934 |
| 狐妖小红娘 南国 | 747 | 7.17 | 2.3 |  |
-0.96033 | 0.68612 |
| アイドリッシュセブン | 5335 | 7.61 | 1.5 |  |
-1.44009 | 0.47774 |
| アイドルタイムプリパラ | 2044 | 6.74 | 7.5 |  |
-1.19714 | 0.22334 |
| 妹さえいればいい。 | 75524 | 7.3 | 5.0 |  |
-0.51241 | 0.85977 |
| イナズマイレブン アウターコード | 2029 | 7.29 | 4.7 |  |
-1.16412 | 0.36764 |
| いぬやしき | 135552 | 8.04 | 2.1 |  |
-0.73322 | 0.81472 |
| いつだって僕らの恋は10センチだった。 | 33686 | 7.63 | 1.1 |  |
-0.93216 | 0.70778 |
| Just Because! | 99534 | 7.41 | 3.9 |  |
-0.74432 | 0.79712 |
| 十二大戦 | 113288 | 6.83 | 3.8 |  |
-0.05564 | 1.06350 |
| 血界戦線 & BEYOND | 105672 | 8.12 | 0.8 |  |
-0.62419 | 0.85649 |
| キノの旅 -the Beautiful World- | 68082 | 7.61 | 3.4 |  |
-0.54178 | 0.91322 |
| キラキラ☆プリキュアアラモード | 3940 | 7.03 | 6.7 |  |
0.17282 | 0.96882 |
| きららファンタジア | 2551 | 6.73 | 1.4 |  |
0.96015 | 1.33100 |
| このはな綺譚 | 43814 | 7.63 | 6.1 |  |
-0.86979 | 0.69823 |
| クジラの子らは砂上に歌う | 53220 | 7.52 | 3.5 |  |
-0.77245 | 0.76101 |
| ラブライブ！サンシャイン!! 第2期 | 33486 | 7.96 | 1.4 |  |
-1.22801 | 0.53958 |
| まじかるすいーとプリズム・ナナ | 7483 | 6.98 | 0.8 |  |
-0.20120 | 1.00957 |
| 魔法陣グルグル | 14381 | 7.95 | 6.2 |  |
-0.90939 | 0.67262 |
| 魔法使いの嫁 | 217983 | 8.57 | 1.1 |  |
-1.22983 | 0.75206 |
| 機動戦士ガンダムTHE ORIGIN | 24134 | 8.4 | 1.4 |  |
-0.70686 | 0.93719 |
| 夏目友人帳 陸 特別編 | 8970 | 8.53 | 0.5 |  |
-1.34910 | 0.71195 |
| ネト充のススメ | 117606 | 7.94 | 1.7 |  |
-0.26062 | 1.01016 |
| 忍たま乱太郎 | 2898 | 7.16 | 25.3 |  |
-0.26499 | 0.81032 |
| ONE PIECE | 650855 | 8.55 | 11.4 |  |
0.28584 | 1.19903 |
| おそ松さん 第2期 | 22734 | 8.04 | 2.3 |  |
-1.53187 | 0.45047 |
| ピングー in ザ・シティ | 19410 | 8.48 | 13.3 |  |
4.79744 | 2.57444 |
| ポケットモンスター サン＆ムーン | 23849 | 7.05 | 10.4 |  |
-0.36163 | 0.90995 |
| 全职法师 第2季 | 10203 | 6.75 | 3.0 |  |
-0.47575 | 0.81401 |
| 進撃の巨人 LOST GIRLS | 42376 | 8.36 | 0.1 |  |
-1.04346 | 0.74968 |
| 食戟のソーマ 餐ノ皿 | 165392 | 8.57 | 0.5 |  |
-1.15974 | 0.77495 |
| 少女終末旅行 | 73985 | 7.98 | 3.4 |  |
-0.84580 | 0.70516 |
| 将国のアルタイル | 33452 | 7.33 | 13.0 |  |
-0.97969 | 0.45099 |
| ザ・キング・オブ・ファイターズ デスティニー | 1052 | 6.76 | 3.5 |  |
0.62359 | 1.09040 |
| アイドルマスター SideM | 8613 | 7.34 | 4.8 |  |
-1.22804 | 0.37292 |
| 東方二次創作同人アニメ 夢想夏郷 | 21916 | 7.12 | 4.0 |  |
-0.27501 | 0.90735 |
| トリック・オア・アリス | 5697 | 7.11 | 1.0 |  |
2.29177 | 1.75051 |
| UQ HOLDER! ～魔法先生ネギま！2～ | 49457 | 7.16 | 3.1 |  |
-0.46831 | 0.85406 |
| 宇宙戦艦ヤマト2202 愛の戦士たち | 6536 | 8.17 | 0.9 |  |
-1.14163 | 0.75176 |
| ヴァイオレット・エヴァーガーデン | 135847 | 8.91 | 0.1 |  |
3.86807 | 2.30219 |
| 妖怪アパートの幽雅な日常 | 31699 | 6.9 | 12.6 |  |
-0.64550 | 0.73246 |
| 妖怪ウォッチ | 10426 | 6.81 | 16.7 |  |
-0.70847 | 0.59279 |
| 結城友奈は勇者である -鷲尾須美の章- | 17278 | 7.61 | 2.4 |  |
-0.84375 | 0.76824 |
| 結城友奈は勇者である -勇者の章- | 15704 | 7.84 | 0.4 |  |
-1.51219 | 0.42116 |
| 遊戯王VRAINS | 13812 | 6.89 | 8.5 |  |
-0.03661 | 0.96425 |
というかそもそもFancyGridをお試そうとした際に考えた「動的にグラフを作る」のは諦めて、data URIs の形で画像を埋め込んでるので、「FancyGrid、うーん」の一つ(グラフ連携がうまくいかん)を解決したくて Bootstrap table たのではなくて。
何してるかはソースの表示でみてちょ、と言うだけだと今の場合ボリューミーなので…。Getting started 見ながらやればすぐに出来るよ。今ワタシがやったのは Via data attributes のパターンね。
ドキュメントが、「慣れれば」という前提付きで滅茶苦茶親切丁寧に書いてあるので非常に印象が良い。結構日常使いにいいんじゃないかなという気がしてる。(ほかのものも調べ中ではあるけれど、いったんこれを使い続けてみようと思う。)
追記: data URIs と jquery lazy load の相性が悪い
Bootstrap Table そのものの話とは全然関係ないが、data URIs と jquery lazy load の相性が悪いか…。暫定的に WordPress の lazy load プラグインを止めることにする。
追記: Toolbar (data-search)
あまりに「ファーストお試せた」に過ぎるので、こんなんもでけますよーもちっとはないと、ヲ、とは思わんだろうなぁと思ったので、Toolbar なお試し:
| name | members | score | dropped (%) | score vs votes | < 8 + dropped | kurtosis | skew |
|---|---|---|---|---|---|---|---|
| 銀魂。ポロリ編 | 39657 | 8.95 | 1.0 |  |
5.1 | 1.8704 | 1.7263 |
| ヴァイオレット・エヴァーガーデン | 137364 | 8.91 | 0.1 | |
0.3 | 3.8516 | 2.2974 |
| 3月のライオン 第2シリーズ | 48409 | 8.79 | 0.5 | |
2.3 | -0.8579 | 0.9537 |
| 魔法使いの嫁 | 220370 | 8.57 | 1.1 |  |
4.1 | -1.2326 | 0.7531 |
| 食戟のソーマ 餐ノ皿 | 167685 | 8.56 | 0.5 |  |
6.3 | -1.1311 | 0.7841 |
| ONE PIECE | 651695 | 8.55 | 11.4 | |
21.7 | 0.2858 | 1.1990 |
| 夏目友人帳 陸 特別編 | 9038 | 8.53 | 0.5 | |
3.7 | -1.3496 | 0.7123 |
| 宝石の国 | 52394 | 8.48 | 3.1 |  |
8.8 | -1.2310 | 0.6914 |
| ピングー in ザ・シティ | 19404 | 8.48 | 13.5 | |
23.2 | 4.7957 | 2.5739 |
| 機動戦士ガンダムTHE ORIGIN | 24172 | 8.4 | 1.4 | |
5.6 | -0.7114 | 0.9348 |
| ボールルームへようこそ | 97035 | 8.37 | 4.1 | |
11.6 | -0.9738 | 0.7922 |
| 進撃の巨人 LOST GIRLS | 42830 | 8.35 | 0.2 |  |
1.0 | -1.1796 | 0.6864 |
| 名探偵コナン | 143850 | 8.25 | 15.3 | |
25.4 | -1.6082 | 0.4434 |
| 宇宙戦艦ヤマト2202 愛の戦士たち | 6573 | 8.17 | 0.9 | |
2.4 | -1.1385 | 0.7515 |
| 血界戦線 & BEYOND | 108074 | 8.16 | 0.8 |  |
6.0 | -0.4199 | 0.9620 |
| 少女終末旅行 | 75546 | 8.12 | 3.5 |  |
10.2 | -0.8934 | 0.7191 |
| いぬやしき | 138784 | 8.03 | 2.2 |  |
11.6 | -0.7430 | 0.8072 |
| おそ松さん 第2期 | 22845 | 8.03 | 2.4 |  |
7.2 | -1.5166 | 0.4511 |
| 魔法陣グルグル | 14474 | 7.96 | 6.2 |  |
15.0 | -0.8923 | 0.6827 |
| ラブライブ！サンシャイン!! 第2期 | 33698 | 7.95 | 1.5 |  |
7.4 | -1.2570 | 0.5244 |
| ネト充のススメ | 119669 | 7.94 | 1.7 | |
15.6 | -0.2546 | 1.0131 |
| 鬼灯の冷徹 第弐期 | 15526 | 7.85 | 1.6 | |
6.3 | -0.7352 | 0.7879 |
| 結城友奈は勇者である -勇者の章- | 15832 | 7.85 | 0.4 |  |
3.2 | -1.4721 | 0.4318 |
| クレヨンしんちゃん | 31697 | 7.73 | 25.3 |  |
36.8 | -1.6105 | 0.3242 |
| ブレンド・S | 105488 | 7.71 | 2.4 |  |
15.4 | -0.4548 | 0.9706 |
| このはな綺譚 | 44371 | 7.65 | 6.3 |  |
18.1 | -0.8551 | 0.7170 |
| いつだって僕らの恋は10センチだった。 | 34450 | 7.61 | 1.1 |  |
5.6 | -0.9478 | 0.6855 |
| 結城友奈は勇者である -鷲尾須美の章- | 17410 | 7.61 | 2.4 | |
13.2 | -0.8436 | 0.7678 |
| アイドリッシュセブン | 5367 | 7.6 | 1.6 |  |
4.3 | -1.3972 | 0.5028 |
| ドラえもん (2005) | 4216 | 7.59 | 19.3 | |
31.7 | -1.5032 | 0.2905 |
| 干物妹！うまるちゃんR | 68920 | 7.59 | 2.1 |  |
11.8 | -0.6218 | 0.8853 |
| キノの旅 -the Beautiful World- | 69054 | 7.59 | 3.5 |  |
14.2 | -0.5272 | 0.9386 |
| グランクレスト戦記 | 13632 | 7.51 | 0.1 |  |
0.4 | 0.5469 | 1.2005 |
| アグレッシブ烈子 | 10395 | 7.49 | 8.1 | |
21.1 | -0.7196 | 0.7351 |
| ドラゴンボール超（スーパー） | 194973 | 7.49 | 7.4 | |
25.7 | -1.4117 | 0.3835 |
| クジラの子らは砂上に歌う | 53569 | 7.49 | 3.7 |  |
10.4 | -0.7703 | 0.7597 |
| Just Because! | 100294 | 7.42 | 3.9 |  |
10.9 | -0.7589 | 0.7882 |
| 将国のアルタイル | 33771 | 7.4 | 13.0 |  |
23.6 | -0.9806 | 0.4934 |
| ちびまる子ちゃん | 1511 | 7.39 | 20.9 | |
30.2 | -1.4631 | 0.2399 |
| 妹さえいればいい。 | 78456 | 7.38 | 4.9 |  |
18.7 | -0.5635 | 0.9114 |
| アイカツスターズ！ | 7650 | 7.35 | 8.0 | |
16.5 | -1.2532 | 0.3975 |
| ぐでたま | 3993 | 7.35 | 7.2 | |
15.7 | -0.8674 | 0.6422 |
| 一人之下 THE OUTCAST 2ndシーズン | 4615 | 7.34 | 0.8 |  |
1.8 | 0.0082 | 1.0494 |
| アイドルマスター SideM | 8665 | 7.34 | 4.8 | |
11.0 | -1.2321 | 0.3637 |
| イナズマイレブン アウターコード | 2033 | 7.29 | 4.7 | |
14.9 | -1.1598 | 0.3638 |
| 「映画 中二病でも恋がしたい！ -Take On Me-」ミニドラマ『公開直前の・・・回顧劇場』 | 3057 | 7.27 | 0.7 |  |
1.2 | 3.5748 | 2.1877 |
| 狐妖小红娘 南国 | 804 | 7.25 | 2.2 |  |
8.3 | -1.3116 | 0.5578 |
| BORUTO -NARUTO NEXT GENERATIONS- | 168563 | 7.24 | 6.0 | |
22.5 | -0.7346 | 0.7048 |
| Fate/Apocrypha | 134191 | 7.23 | 5.3 |  |
15.3 | -0.8069 | 0.7122 |
| Fate/Grand Order | 2852 | 7.2 | 2.0 | |
7.5 | -0.6992 | 0.5278 |
| 牙狼＜GARO＞-VANISHING LINE- | 28052 | 7.18 | 6.2 | |
14.7 | -0.4405 | 0.9311 |
| 忍たま乱太郎 | 2898 | 7.16 | 25.3 | |
35.8 | -0.2590 | 0.8141 |
| UQ HOLDER! ～魔法先生ネギま！2～ | 50090 | 7.15 | 3.2 |  |
17.3 | -0.4082 | 0.8737 |
| 東方二次創作同人アニメ 夢想夏郷 | 21933 | 7.12 | 4.0 | |
25.7 | -0.2660 | 0.9103 |
| トリック・オア・アリス | 5701 | 7.11 | 1.0 | |
1.3 | 2.2918 | 1.7505 |
| 클로저스 : SIDE BLACKLAMBS | 8753 | 7.09 | 2.9 |  |
6.0 | -1.1927 | 0.3663 |
| ポケットモンスター サン＆ムーン | 23938 | 7.05 | 10.4 | |
24.8 | -0.3579 | 0.9117 |
| ガンダムビルドファイターズ バトローグ | 2697 | 7.04 | 2.5 | |
23.7 | -0.0455 | 1.0723 |
| キラキラ☆プリキュアアラモード | 3953 | 7.03 | 6.7 | |
16.8 | 0.1571 | 0.9630 |
| まじかるすいーとプリズム・ナナ | 7486 | 6.97 | 0.8 |  |
1.2 | -0.0810 | 1.0679 |
| 妖怪アパートの幽雅な日常 | 31941 | 6.92 | 12.6 |  |
25.9 | -0.5659 | 0.7538 |
| CARDFIGHT!! ヴァンガードG Z | 1517 | 6.91 | 5.0 |  |
13.6 | 0.6623 | 1.1461 |
| 遊戯王VRAINS | 13846 | 6.89 | 8.6 | |
21.4 | -0.0242 | 0.9662 |
| 十二大戦 | 114672 | 6.81 | 3.9 | |
26.4 | -0.0559 | 1.0642 |
| 妖怪ウォッチ | 10436 | 6.81 | 16.8 |  |
30.2 | -0.7071 | 0.5928 |
| ザ・キング・オブ・ファイターズ デスティニー | 1071 | 6.78 | 3.5 |  |
15.1 | 0.5271 | 1.0649 |
| お酒は夫婦になってから | 45692 | 6.75 | 5.7 |  |
18.9 | -0.6215 | 0.8077 |
| 全职法师 第2季 | 10314 | 6.75 | 3.1 |  |
25.2 | -0.4407 | 0.8246 |
| シンデレラガールズ劇場 第2期 | 3718 | 6.74 | 2.3 |  |
12.4 | -0.6929 | 0.7669 |
| アイドルタイムプリパラ | 2051 | 6.73 | 7.6 | |
14.3 | -1.2290 | 0.1988 |
| きららファンタジア | 2547 | 6.73 | 1.4 | |
3.0 | 0.9601 | 1.3310 |
| グランブルーファンタジー | 3133 | 6.66 | 5.4 |  |
10.4 | -0.2846 | 0.7991 |
| シンデレラガールズ劇場 火曜シンデレラシアター | 1428 | 6.63 | 2.1 |  |
13.9 | -0.9078 | 0.7091 |
| ブラッククローバー | 156662 | 6.56 | 9.1 | |
21.8 | -0.6047 | 0.6046 |
| Code:Realize ～創世の姫君～ | 37981 | 6.56 | 10.2 |  |
20.1 | -1.0994 | 0.5574 |
data-search 以外もカラムの表示非表示切り替えなどが使えるが、ワタシのこの WordPress ブログのスタイルと相性悪く、表示がガタガタになるので紹介はやめとく(同じ理由で、ページング(data-pagination) も簡単に出来る(data-pagination)がこれも同じく)。
なお、この検索ボックス、例えば「宝石の国」なら「houseki」と打ち込んでもヒットする。すげーと思ったが、多分これは違くて、url リンク(https://myanimelist.net/anime/35557/Houseki_no_Kuni_TV/stats)に反応してるんじゃないかと思う。もし「翻訳」機能内蔵してるならスゲーよね、けど違うと思う。
追記: Toolbar (data-show-toggle, data-show-columns)
今回のはhtml: iframe に動的に html をぶち込むを踏まえて iframe に閉じ込めたので、「フレームのソースを表示」で何してるかみてちょ。
ツールバーのスタイルがおかしいのがどうにもならなくて苦労していたが、これは公式ドキュメントがあまりに不案内だ。正しい Getting Started は結果的には CDN を使う場合は:
CDN は cdnjs、maxcdn のどちらかに統一、は多分出来ると思う
1 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
2 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/bootstrap-table.min.css">
3 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
4 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
5 <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.11.1/bootstrap-table.min.js"></script>
要するに bootstrap-table はより基礎的な bootstrap の上に成り立っている、という説明が最初になく、そのインポートの説明もない。結局いつもお世話になる w3cschools の Bootstrap 説明 を読んで理解出来た。
追記: ページング (data-pagination)
一つ上の追記と同じく、「フレームのソースを表示」で何してるかみてちょ。
iframe と相性よくないのかなぁ、ページ送りボタンが iframe サイズを必ず追い越してしまう。必ずスクロールバー動かさないといけないんじゃページングの意味ない…。
