テーブル表示ツールjQueryプラグインFlexigrid

IDEA*IDEAの2008年3月24日のエントリー jQueryでテーブルをかなり便利にフォーマットしてくれる『Flexigrid』
jQueryを使って実に簡単にテーブルをいろいろ便利にしてくれるライブラリ
と紹介されていたのが Paulo P.Marinas 氏に依る Flexigrid にて2008年6月現在BETA版として公開されておられますのを、 当ブログにも使用してみたところ、 業務にも実に有用に使用可能に成り得るユーティリティ javascript ではないかと感じました。

本ツールはjQueryのプラグインとして作成されており、 様々なオプションが使用可能ですので、 必要性を鑑みて実装することが出来、 当アーティクルでは
  1. テーブル表示・非表示切替機能
  2. 列表示選択機能
  3. 列幅可変機能
を利用していますが、列をソートする機能は上手く動作させられませんでした。
列幅可変機能につきましては、 列幅どころかテーブルの幅自体可変ですのでエッジを摘まんでドラッグして広げてみて下さい。

AjaxらしくJSON形式データを用いて動的データとの通信も可能ですので、 利用価値は実に高いと思われ、当該機能の実際のサンプルは上記 Flexigrid 頁内のExample 3 にてご覧いただけ、 また当アーティクルにおけるサンプルは、 アーティクルに直接アクセスされている方以外は、 タイトル若しくは[続きを読む]をクリックしてご覧いただきたいと思います。

データは総務省・統計局の
人口推計 > 月報 > 平成17年国勢調査結果確定人口に基づく改定数値(平成17年10月~18年7月)
全国推計人口-男女,年齢階級別 に公開されているものを利用させていただきました。
スポンサーリンク
総数 126,253 61,632 64,621 126,189 61,601 64,588 126,155 61,577 64,578 126,166 61,575 64,591 126,134 61,561 64,573 126,136 61,557 64,579 126,162 61,563 64,599
0~4歳 5,515 2,824 2,690 5,504 2,819 2,685 5,498 2,816 2,682 5,496 2,815 2,681 5,489 2,812 2,677 5,483 2,808 2,674 5,478 2,806 2,672
5~9歳 5,912 3,031 2,881 5,908 3,029 2,880 5,903 3,026 2,877 5,904 3,027 2,878 5,896 3,023 2,873 5,891 3,020 2,871 5,889 3,019 2,870
10~14歳 5,978 3,064 2,914 5,974 3,062 2,911 5,974 3,062 2,912 5,971 3,061 2,910 5,968 3,059 2,909 5,968 3,059 2,909 5,969 3,059 2,910
15~19歳 6,483 3,332 3,151 6,463 3,322 3,142 6,447 3,313 3,134 6,432 3,305 3,127 6,419 3,298 3,121 6,407 3,291 3,116 6,398 3,286 3,112
20~24歳 7,200 3,692 3,508 7,185 3,686 3,499 7,174 3,682 3,493 7,173 3,681 3,492 7,160 3,675 3,486 7,156 3,673 3,483 7,154 3,672 3,482
25~29歳 8,035 4,086 3,948 7,998 4,069 3,929 7,970 4,055 3,915 7,942 4,040 3,901 7,912 4,026 3,886 7,886 4,013 3,873 7,864 4,002 3,862
30~34歳 9,580 4,860 4,721 9,560 4,850 4,709 9,544 4,842 4,701 9,531 4,835 4,696 9,515 4,828 4,687 9,503 4,822 4,681 9,491 4,816 4,675
35~39歳 8,616 4,361 4,255 8,659 4,382 4,277 8,700 4,402 4,298 8,753 4,429 4,325 8,804 4,455 4,349 8,862 4,484 4,378 8,918 4,512 4,406
40~44歳 8,042 4,056 3,986 8,004 4,039 3,966 7,976 4,024 3,953 7,947 4,008 3,939 7,914 3,993 3,922 7,891 3,980 3,911 7,879 3,974 3,905
45~49歳 7,633 3,830 3,803 7,617 3,822 3,795 7,605 3,816 3,789 7,596 3,811 3,785 7,597 3,811 3,786 7,594 3,810 3,784 7,589 3,806 3,783
50~54歳 8,624 4,301 4,323 8,557 4,270 4,287 8,511 4,246 4,265 8,476 4,228 4,248 8,451 4,216 4,235 8,428 4,205 4,224 8,409 4,194 4,215
55~59歳 10,408 5,158 5,250 10,513 5,207 5,305 10,576 5,238 5,338 10,642 5,270 5,372 10,696 5,297 5,398 10,733 5,315 5,418 10,753 5,324 5,428
60~64歳 8,408 4,088 4,320 8,307 4,040 4,267 8,250 4,012 4,238 8,185 3,981 4,205 8,145 3,960 4,184 8,117 3,947 4,171 8,102 3,939 4,163
65~69歳 7,429 3,546 3,883 7,436 3,550 3,886 7,448 3,557 3,891 7,456 3,562 3,894 7,469 3,568 3,901 7,482 3,574 3,908 7,503 3,584 3,919
70~74歳 6,689 3,068 3,621 6,714 3,080 3,634 6,732 3,090 3,643 6,733 3,092 3,641 6,745 3,098 3,647 6,754 3,102 3,652 6,760 3,105 3,655
75~79歳 5,286 2,272 3,015 5,316 2,285 3,031 5,328 2,292 3,037 5,343 2,300 3,043 5,351 2,303 3,047 5,351 2,304 3,047 5,357 2,307 3,050
80~84歳 3,466 1,249 2,217 3,494 1,265 2,229 3,516 1,277 2,239 3,547 1,294 2,253 3,564 1,302 2,262 3,585 1,312 2,272 3,599 1,320 2,280
85歳以上 2,951 815 2,135 2,980 823 2,157 3,002 828 2,174 3,038 837 2,200 3,040 837 2,204 3,045 837 2,208 3,050 838 2,212
0~14歳 17,404 8,919 8,485 17,386 8,910 8,475 17,375 8,905 8,470 17,371 8,903 8,469 17,353 8,893 8,460 17,341 8,887 8,455 17,337 8,884 8,452
15~64歳 83,028 41,763 41,264 82,864 41,688 41,176 82,754 41,630 41,124 82,678 41,587 41,090 82,612 41,560 41,052 82,578 41,540 41,037 82,556 41,525 41,032
65歳以上 25,821 10,950 14,871 25,940 11,003 14,937 26,026 11,043 14,983 26,116 11,085 15,032 26,169 11,108 15,061 26,217 11,130 15,087 26,269 11,154 15,115
75歳以上 11,704 4,336 7,368 11,789 4,372 7,417 11,846 4,396 7,450 11,928 4,431 7,497 11,955 4,443 7,513 11,981 4,453 7,527 12,006 4,464 7,542
スポンサーリンク

「テーブル表示ツールjQueryプラグインFlexigrid」への1件のフィードバック

  1. Hamazo Top30ブログでよく使われている言葉

    インターネットが今や検索エンジンを中心に回っていることは云わずもがなでしょう。これがどう云うことかと云えばホームページ及びブログに対してのアクセスは多く検索エンジンから齎せられるからです。検索エンジンでは利用者は皆キーワードを入力します。検索エンジンは入

コメントは受け付けていません。