Charts Servicesによるデータテーブルとチャートの利用 (3/6)
作成:2011-09-26 08:50
更新:2011-09-26 08:50
更新:2011-09-26 08:50
■PieChartBuilderによる円グラフの作成
では、作成したDataTableをもとにチャートを作成しましょう。まずは比較的シンプルなものとして、「円グラフ」を作成してみます。
円グラフも、DataTableと同様、まず「PieChartBuilder」というオブジェクトを生成し、それにデータ(DataTable)を設定して、その他必要な設定などを行った後、「build」でチャートであるChartオブジェクトを生成する、といった作業を行います。
これらの主なメソッド類について整理していきましょう。これもDataTaleと同様、基本的にPieChartBuilderを返すように設計されているため、そのままメソッドチェーンで記述することができます。
・PieChartBuilderの作成
・DataTableの設定
・タイトルの設定
・チャートサイズの設定
・背景色の設定
・各項目の色の設定
・立体化
・列の反転
・チャートの生成
実際のチャート作成の例を下にあげておきます。これで簡単な円グラフが作成されます。――ただし、作成したものを「どうやって利用すればいいか?」を知らなければ、作ったオブジェクトも役立たずですね。まだこの段階では、何も画面には表示されません。ただ単に「Google Apps Scriptのサーバーにオブジェクトが生成されている(だろう)」というだけでしかありません。
円グラフも、DataTableと同様、まず「PieChartBuilder」というオブジェクトを生成し、それにデータ(DataTable)を設定して、その他必要な設定などを行った後、「build」でチャートであるChartオブジェクトを生成する、といった作業を行います。
これらの主なメソッド類について整理していきましょう。これもDataTaleと同様、基本的にPieChartBuilderを返すように設計されているため、そのままメソッドチェーンで記述することができます。
・PieChartBuilderの作成
変数 = Charts.newPieChart();PieChartBuilderオブジェクトを生成します。これで変数にPieChartBuilderが得られます。後は、このオブジェクトからメソッドを呼び出してチャートを作成します。
・DataTableの設定
変数 =【PieChartBuilder】.setDataTable(【DataTable】);あらかじめ作成しておいたDataTableオブジェクトをチャートに設定します。これで、このデータをもとにチャートを作成するようになります。
・タイトルの設定
変数 =【PieChartBuilder】.setTitle( テキスト );チャートのタイトルを設定します。これはチャートを表示する際に用いられます。
・チャートサイズの設定
変数 =【PieChartBuilder】.setDimensions( 横幅 , 縦幅 );チャートのサイズを設定します。引数には、横幅と縦幅(それぞれドット数)を指定します。
・背景色の設定
【PieChartBuilder】.setBackgroundColor( 色の値 );チャートの背景色を設定するものです。色の値は、スタイルシートで用いられるテキスト("#FF00AA"といった形式)をそのまま指定できます。
・各項目の色の設定
変数 =【PieChartBuilder】.setColors( 配列 );チャートの各項目の色を設定します。引数には、色の値を配列にまとめたものを指定します。色の値は、setBackgroundColorと同様、スタイルシートの値を指定します。
・立体化
変数 =【PieChartBuilder】.set3D();これを呼び出すと、チャートを立体的に表示させることができます。引数はありません。
・列の反転
変数 =【PieChartBuilder】.reverseCategories();これを呼び出すと、列の並び順を反転させてチャートを生成します。引数はありません。
・チャートの生成
変数 =【PieChartBuilder】.build();チャートを生成し、Chartオブジェクトを返します。これでチャートが完成です。
実際のチャート作成の例を下にあげておきます。これで簡単な円グラフが作成されます。――ただし、作成したものを「どうやって利用すればいいか?」を知らなければ、作ったオブジェクトも役立たずですね。まだこの段階では、何も画面には表示されません。ただ単に「Google Apps Scriptのサーバーにオブジェクトが生成されている(だろう)」というだけでしかありません。
(by. SYODA-Tuyano.)
※プログラムリストが表示されない場合
AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。
●プログラム・リスト●
function createPieChart() { var data = Charts.newDataTable() .addColumn(Charts.ColumnType.STRING, "OS") .addColumn(Charts.ColumnType.NUMBER, "シェア") .addRow(["Windows", 47]) .addRow(["Android", 19]) .addRow(["iOS", 14]) .addRow(["Mac OS", 4]) .addRow(["Linux", 2]) .addRow(["その他", 4]) .build(); var chart = Charts.newPieChart() .setDataTable(data) .setTitle("OSのシェア") .setDimensions(400, 350) .build(); }
※関連コンテンツ
「Google Apps Scriptプログラミング [中級編]」に戻る