「オープンソース」を使ってみよう (第32回 Geeklogを使って集計データをGoogle Chartsで表示しよう)
01/22
Use it ! OSS No Comments
Tweet
Google Chartsを活用すると、CMSならではのDBから算出した情報を
リアルタイムにグラフ化して表示することが可能になります。
Google Charts 3D円形グラフの作成方法
事例:
OSS Japanに登録されたOSSをライセンス別にリアルタイム集計した表です。
ライセンスを含んだOSSの登録には、GeeklogのdataBoxプラグインを活用しています。
OSS Japanに登録されたOSSをライセンス別にリアルタイム集計した表
ページのコード:
<script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = google.visualization.arrayToDataTable([ ['Task', 'Hours per Day'], ['GPL-2.0', [databox:count category_code:alloss|GPL-2_0 mode:and]], ['LGPL-2.1', [databox:count category_code:alloss|LGPL-2_1 mode:and]], ['BSD-2-Clause', [databox:count category_code:alloss|BSD-2-Clause mode:and]], ['Apache-2.0', [databox:count category_code:alloss|Apache-2_0 mode:and]], ['GPL-3.0', [databox:count category_code:alloss|GPL-3_0 mode:and]], ['MIT', [databox:count category_code:alloss|MIT mode:and]], ['AGPL-3.0', [databox:count category_code:alloss|AGPL-3_0 mode:and]], ['MPL-2.0', [databox:count category_code:alloss|MPL-2_0 mode:and]], ['LGPL-3.0', [databox:count category_code:alloss|LGPL-3_0 mode:and]], ['BSD-3-Clause', [databox:count category_code:alloss|BSD-3-Clause mode:and]], ['EPL-1.0', [databox:count category_code:alloss|EPL-1_0 mode:and]], ['AFL-3.0', [databox:count category_code:alloss|AFL-3_0 mode:and]], ['APL-1.0', [databox:count category_code:alloss|APL-1_0 mode:and]], ['APSL-2.0', [databox:count category_code:alloss|APSL-2_0 mode:and]], ['Artistic-2.0', [databox:count category_code:alloss|Artistic-2_0 mode:and]], ['AAL', [databox:count category_code:alloss|AAL mode:and]], ['BSL-1.0', [databox:count category_code:alloss|BSL-1_0 mode:and]], ['CECILL-2.1', [databox:count category_code:alloss|CECILL-2_1 mode:and]], ['CATOSL-1.1', [databox:count category_code:alloss|CATOSL-1_1 mode:and]], ['CDDL-1.0', [databox:count category_code:alloss|CDDL-1_0 mode:and]], ['CPAL-1.0', [databox:count category_code:alloss|CPAL-1_0 mode:and]], ['CUA-OPL-1.0', [databox:count category_code:alloss|CUA-OPL-1_0 mode:and]], ['EUDatagrid', [databox:count category_code:alloss|EUDatagrid mode:and]], ['ECL-2.0', [databox:count category_code:alloss|ECL-2_0 mode:and]], ['EFL-2.0', [databox:count category_code:alloss|EFL-2_0 mode:and]], ['Entessa', [databox:count category_code:alloss|Entessa mode:and]], ['EUPL-1.1', [databox:count category_code:alloss|EUPL-1_1 mode:and]], ['Fair', [databox:count category_code:alloss|Fair mode:and]], ['Frameworx-1.0', [databox:count category_code:alloss|Frameworx-1_0 mode:and]], ['HPND', [databox:count category_code:alloss|HPND mode:and]], ['IPL-1.0', [databox:count category_code:alloss|IPL-1_0 mode:and]], ['IPA', [databox:count category_code:alloss|IPA mode:and]], ['ISC', [databox:count category_code:alloss|ISC mode:and]], ['LPPL-1.3c', [databox:count category_code:alloss|LPPL-1_3c mode:and]], ['LPL-1.02', [databox:count category_code:alloss|LPL-1_02 mode:and]], ['MirOS', [databox:count category_code:alloss|MirOS mode:and]], ['MS-PL', [databox:count category_code:alloss|MS-PL mode:and]], ['MS-RL', [databox:count category_code:alloss|MS-RL mode:and]], ['Motosoto', [databox:count category_code:alloss|Motosoto mode:and]], ['Multics', [databox:count category_code:alloss|Multics mode:and]], ['NASA-1.3', [databox:count category_code:alloss|NASA-1_3 mode:and]], ['NTP', [databox:count category_code:alloss|NTP mode:and]], ['Naumen', [databox:count category_code:alloss|Naumen mode:and]], ['NGPL', [databox:count category_code:alloss|NGPL mode:and]], ['Nokia', [databox:count category_code:alloss|Nokia mode:and]], ['NPOSL-3.0', [databox:count category_code:alloss|NPOSL-3_0 mode:and]], ['OCLC-2.0', [databox:count category_code:alloss|OCLC-2_0 mode:and]], ['OFL-1.1', [databox:count category_code:alloss|OFL-1_1 mode:and]], ['OGTSL', [databox:count category_code:alloss|OGTSL mode:and]], ['OSL-3.0', [databox:count category_code:alloss|OSL-3_0 mode:and]], ['PHP-3.0', [databox:count category_code:alloss|PHP-3_0 mode:and]], ['PostgreSQL', [databox:count category_code:alloss|PostgreSQL mode:and]], ['Python-2.0', [databox:count category_code:alloss|Python-2_0 mode:and]], ['CNRI-Python', [databox:count category_code:alloss|CNRI-Python mode:and]], ['QPL-1.0', [databox:count category_code:alloss|QPL-1_0 mode:and]], ['RPSL-1.0', [databox:count category_code:alloss|RPSL-1_0 mode:and]], ['RPL-1.5', [databox:count category_code:alloss|RPL-1_5 mode:and]], ['RSCPL', [databox:count category_code:alloss|RSCPL mode:and]], ['SimPL-2.0', [databox:count category_code:alloss|SimPL-2_0 mode:and]], ['Sleepycat', [databox:count category_code:alloss|Sleepycat mode:and]], ['SPL-1.0', [databox:count category_code:alloss|SPL-1_0 mode:and]], ['Watcom-1.0', [databox:count category_code:alloss|Watcom-1_0 mode:and]], ['NCSA', [databox:count category_code:alloss|NCSA mode:and]], ['VSL-1.0', [databox:count category_code:alloss|VSL-1_0 mode:and]], ['W3C', [databox:count category_code:alloss|W3C mode:and]], ['WXwindows', [databox:count category_code:alloss|WXwindows mode:and]], ['Xnet', [databox:count category_code:alloss|Xnet mode:and]], ['ZPL-2.0', [databox:count category_code:alloss|ZPL-2_0 mode:and]], ['Zlib', [databox:count category_code:alloss|Zlib mode:and]], ['その他', [databox:count category_code:alloss|OtherLicense mode:and]] ]); // Set chart options var options = { title: 'ライセンス比率', is3D: true, }; var chart = new google.visualization.PieChart(document.getElementById('piechart')); chart.draw(data, options); } </script> <div id="piechart" style="width: 100%; min-height: 800px; padding;0" class="rounded-img"></div>
ライセンスの集計値は、GeeklogのDataBoxプラグインの自動タグで表示させています。
以下の自動タグでは、alloss, GPL-3.0のカテゴリをandのモードで集計した数値を表示
します。
[databox:count category_code:alloss|GPL-3.0 mode:and]]
編集画面:
dataBoxプラグインで使える自動タグ一覧:
dataBoxプラグインで使えるテンプレート変数一覧:
Geeklogをインストールする方法:
設置条件
PHP: PHP5.2.0 以上
データベース: MySQL 4.1.2 以上。(MySQL5推奨)
MySQLの文字セット: UTF-8 Unicode
文字コード照合順: utf8_general_ci
WWWサーバ: Apache全バージョン Zeus IIS
dataBoxプラグインをインストールする方法:
ダウンロード:
dataBoxプラグインをインストールする
Geeklogにプラグインをインストールする方法:
————————-
Geeklog Japan
今駒 哲子
————————-