チャートタイトル

Spread.Sheets では、スプレッドシートのデータを視覚化する際にチャートのタイトルを構成できます。基本的には、チャートタイトルは、チャートに付ける名前です。

チャートのタイトルをカスタマイズする

タイトルをチャートに追加するには、Chartクラスのtitle メソッドを使用します。このメソッドのさまざまなオプションを使用することで、チャートにカスタムテキストを設定できるほか、フォントファミリの定義、フォントのサイズや色の変更も行えます。

次の図は、基本コンポーネントをカスタマイズしたチャートを示します。このチャートのタイトルは「年間売上高」です。

コードの使用

次のコードは、チャートの基本コンポーネントを設定する方法を示します。

JavaScript	コードのコピー
var activeSheet = spread.getActiveSheet(); activeSheet.suspendPaint(); // チャートのデータを準備します。 activeSheet.setValue(0, 1, "2016年"); activeSheet.setValue(0, 2, "2017年"); activeSheet.setValue(0, 3, "2018年"); activeSheet.setValue(1, 0, "携帯電話"); activeSheet.setValue(2, 0, "ラップトップ"); activeSheet.setValue(3, 0, "タブレット"); for (var r = 1; r <= 3; r++) { for (var c = 1; c <= 3; c++) { activeSheet.setValue(r, c, parseInt(Math.random() * 10000)); } } // チャートを追加します。 var chart = activeSheet.charts.add('Chart1', GC.Spread.Sheets.Charts.ChartType.columnClustered, 20, 110, 550, 250, "A1:D4"); // チャートタイトルを設定します。 var title = chart.title(); title.text = "年間売上高"; title.fontFamily = "Cambria"; title.fontSize = 28; title.color = "#696969"; chart.title(title);

JavaScript

コードのコピー

var activeSheet = spread.getActiveSheet();

activeSheet.suspendPaint();

// チャートのデータを準備します。
activeSheet.setValue(0, 1, "2016年");
activeSheet.setValue(0, 2, "2017年");
activeSheet.setValue(0, 3, "2018年");
activeSheet.setValue(1, 0, "携帯電話");
activeSheet.setValue(2, 0, "ラップトップ");
activeSheet.setValue(3, 0, "タブレット");
for (var r = 1; r <= 3; r++)

{
for (var c = 1; c <= 3; c++) {
activeSheet.setValue(r, c, parseInt(Math.random() * 10000));
}
}

// チャートを追加します。
var chart = activeSheet.charts.add('Chart1', GC.Spread.Sheets.Charts.ChartType.columnClustered, 20, 110, 550, 250, "A1:D4");

// チャートタイトルを設定します。
var title = chart.title();
title.text = "年間売上高";
title.fontFamily = "Cambria";
title.fontSize = 28;
title.color = "#696969";
chart.title(title);