Class LineChartBuilder

LineChartBuilder

折れ線グラフのビルダー。詳しくは、Google Charts のドキュメントをご覧ください。

こちらは折れ線グラフの作成方法を示した例です。データが Google スプレッドシートからインポートされた。

  // Get sample data from a spreadsheet.
  var dataSourceUrl = 'https://docs.google.com/spreadsheet/tq?range=A1%3AG5' +
      '&key=0Aq4s9w_HxMs7dHpfX05JdmVSb1FpT21sbXd4NVE3UEE&gid=2&headers=-1';

  var chartBuilder = Charts.newLineChart()
      .setTitle('Yearly Rainfall')
      .setXAxisTitle('Month')
      .setYAxisTitle('Rainfall (in)')
      .setDimensions(600, 500)
      .setCurveStyle(Charts.CurveStyle.SMOOTH)
      .setPointStyle(Charts.PointStyle.MEDIUM)
      .setDataSourceUrl(dataSourceUrl);

  var chart = chartBuilder.build();

メソッド

メソッド戻り値の型概要
build()Chartグラフを作成します。
reverseCategories()LineChartBuilder領域軸の系列の描画を反転します。
setBackgroundColor(cssValue)LineChartBuilderグラフの背景色を設定します。
setColors(cssValues)LineChartBuilderグラフの線の色を設定します。
setCurveStyle(style)LineChartBuilderグラフの曲線に使用するスタイルを設定します。
setDataSourceUrl(url)LineChartBuilderGoogle などの外部ソースからデータを取り込むために使用されるデータソースの URL を設定します。 スプレッドシート。
setDataTable(tableBuilder)LineChartBuilderDataTableBuilder を使用して、グラフに使用するデータ表を設定します。
setDataTable(table)LineChartBuilderグラフの線と X 軸のラベルを含むデータ表を設定します。
setDataViewDefinition(dataViewDefinition)LineChartBuilderグラフで使用するデータビューの定義を設定します。
setDimensions(width, height)LineChartBuilderグラフのディメンションを設定します。
setLegendPosition(position)LineChartBuilderグラフに対する凡例の位置を設定します。
setLegendTextStyle(textStyle)LineChartBuilderグラフの凡例のテキスト スタイルを設定します。
setOption(option, value)LineChartBuilderこのグラフの詳細オプションを設定します。
setPointStyle(style)LineChartBuilder線内のポイントのスタイルを設定します。
setRange(start, end)LineChartBuilderグラフの範囲を設定します。
setTitle(chartTitle)LineChartBuilderグラフのタイトルを設定します。
setTitleTextStyle(textStyle)LineChartBuilderグラフのタイトルのテキスト スタイルを設定します。
setXAxisTextStyle(textStyle)LineChartBuilder横軸のテキスト スタイルを設定します。
setXAxisTitle(title)LineChartBuilder横軸にタイトルを追加します。
setXAxisTitleTextStyle(textStyle)LineChartBuilder横軸のタイトルのテキスト スタイルを設定します。
setYAxisTextStyle(textStyle)LineChartBuilder縦軸のテキスト スタイルを設定します。
setYAxisTitle(title)LineChartBuilder縦軸にタイトルを追加します。
setYAxisTitleTextStyle(textStyle)LineChartBuilder縦軸のタイトルのテキスト スタイルを設定します。
useLogScale()LineChartBuilder範囲の軸を対数スケールに変換します(すべての値が正である必要があります)。

詳細なドキュメント

build()

グラフを作成します。

戻る

Chart - ドキュメントや UI 要素に埋め込んだり、静的アセットとして使用したりできる Chart オブジェクト。 説明します。


reverseCategories()

領域軸の系列の描画を反転します。縦長の範囲グラフ(折れ線、 面グラフや縦棒グラフなど)、横軸は右から左に描画されます。対象 水平範囲グラフ(棒グラフなど)の場合、縦軸は上から下に描画されます。 下に表示されます。円グラフでは、スライスが反時計回りに描画されることを意味します。

// Creates a pie chart builder and sets drawing of the slices in a counter-clockwise manner.
var builder = Charts.newPieChart();
builder.reverseCategories();

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setBackgroundColor(cssValue)

グラフの背景色を設定します。

// Creates a line chart builder and sets the background color to gray
var builder = Charts.newLineChart();
builder.setBackgroundColor("gray");

パラメータ

名前説明
cssValueString色の CSS 値("blue""#00f" など)。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setColors(cssValues)

グラフの線の色を設定します。

// Creates a line chart builder and sets the first two lines to be drawn in green and red,
// respectively.
var builder = Charts.newLineChart();
builder.setColors(["green", "red"]);

パラメータ

名前説明
cssValuesString[]カラー CSS 値の配列(["red", "#acf"] など)。n 番目の要素 配列内の は、グラフ内の n 番目の線の色を表します。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setCurveStyle(style)

グラフの曲線に使用するスタイルを設定します。許容カーブについては CurveStyle をご覧ください あります。

// Creates a line chart builder and curves the lines in the chart.
var builder = Charts.newLineChart();
builder.setCurveStyle(Charts.CurveStyle.SMOOTH)

パラメータ

名前説明
styleCurveStyleグラフ内の曲線のスタイル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。

関連情報


setDataSourceUrl(url)

Google などの外部ソースからデータを取り込むために使用されるデータソースの URL を設定します。 スプレッドシート。データソースの URL と DataTable が指定されている場合、データソースの URL は無視されます。

データソースのクエリの詳細については、Google Charts のドキュメントをご覧ください。

パラメータ

名前説明
urlStringデータソースの URL(クエリ パラメータを含む)。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setDataTable(tableBuilder)

DataTableBuilder を使用して、グラフに使用するデータ表を設定します。これは便利な方法です。 build() を呼び出すことなく、データテーブルを設定できます。

パラメータ

名前説明
tableBuilderDataTableBuilderデータテーブル ビルダー。新しいデータテーブルが それ以降のビルダーの更新はグラフに反映されません。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setDataTable(table)

グラフの線と X 軸のラベルを含むデータ表を設定します。「 最初の列は文字列で、横軸のラベルが含まれている必要があります。任意の数の列 すべて数値でなければなりません。各列は別々の行として表示されます。

パラメータ

名前説明
tableDataTableSourceグラフに使用するデータテーブル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setDataViewDefinition(dataViewDefinition)

グラフで使用するデータビューの定義を設定します。

パラメータ

名前説明
dataViewDefinitionDataViewDefinition表示するビューを定義するデータビュー定義オブジェクト。 グラフ描画の特定のデータソースから派生した値。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setDimensions(width, height)

グラフのディメンションを設定します。

パラメータ

名前説明
widthIntegerグラフの幅(ピクセル単位)。
heightIntegerグラフの高さ(ピクセル単位)。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setLegendPosition(position)

グラフに対する凡例の位置を設定します。デフォルトでは、凡例はありません。

// Creates a line chart builder and sets the legend position to right.
var builder = Charts.newLineChart();
builder.setLegendPosition(Charts.Position.RIGHT);

パラメータ

名前説明
positionPosition凡例の位置。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setLegendTextStyle(textStyle)

グラフの凡例のテキスト スタイルを設定します。

// Creates a line chart builder and sets it up for a  blue, 26-point legend.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setLegendTextStyle(style);

パラメータ

名前説明
textStyleTextStyleグラフの凡例に使用するテキスト スタイル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setOption(option, value)

このグラフの詳細オプションを設定します。詳しくは、 このグラフをご覧ください。指定したオプションが無効な場合、このメソッドは機能しません。

// Build a line chart with a 1-second animation duration.
var builder = Charts.newLineChart();
builder.setOption('animation.duration', 1000);
var chart = builder.build();

パラメータ

名前説明
optionString設定するオプション。
valueObject設定する値。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setPointStyle(style)

線内のポイントのスタイルを設定します。デフォルトでは、ポイントには特定のスタイルはなく、 線が表示されます。

// Creates a line chart builder and sets large point style.
var builder = Charts.newLineChart();
builder.setPointStyle(Charts.PointStyle.LARGE);

パラメータ

名前説明
stylePointStyle線上のポイントに使用するスタイル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。

関連情報


setRange(start, end)

グラフの範囲を設定します。

範囲外のデータポイントがある場合は、それらのデータが含まれるように範囲が拡張されます あります。

パラメータ

名前説明
startNumber範囲の軸の最下方のグリッド線の値。
endNumber範囲の軸の最も高いグリッド線の値。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setTitle(chartTitle)

グラフのタイトルを設定します。タイトルはグラフの中央に表示されます。

// Creates a line chart builder and title to 'My Line Chart'.
var builder = Charts.newLineChart();
builder.setTitle('My Line Chart')

パラメータ

名前説明
chartTitleStringグラフのタイトル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setTitleTextStyle(textStyle)

グラフのタイトルのテキスト スタイルを設定します。

// Creates a line chart builder and sets it up for a  blue, 26-point title.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setTitleTextStyle(style);

パラメータ

名前説明
textStyleTextStyleグラフのタイトルに使用するテキスト スタイル。TextStyleBuilder オブジェクトを作成するには、Charts.newTextStyle() を呼び出します。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setXAxisTextStyle(textStyle)

横軸のテキスト スタイルを設定します。

// Creates a line chart builder and sets the X-axis text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setXAxisTextStyle(textStyle);

パラメータ

名前説明
textStyleTextStyle横軸のタイトルに使用するテキスト スタイル。TextStyleBuilder オブジェクトを作成するには、Charts.newTextStyle() を呼び出します。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setXAxisTitle(title)

横軸にタイトルを追加します。タイトルは中央に配置され、軸の値の下に表示されます できます。

// Creates a line chart builder and sets the X-axis title.
var builder = Charts.newLineChart();
builder.setTitle('X-axis Title')

パラメータ

名前説明
titleStringX 軸のタイトル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setXAxisTitleTextStyle(textStyle)

横軸のタイトルのテキスト スタイルを設定します。

// Creates a line chart builder and sets the X-axis title text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setXAxisTitleTextStyle(textStyle);

パラメータ

名前説明
textStyleTextStyle横軸のタイトルに使用するテキスト スタイル。TextStyleBuilder オブジェクトを作成するには、Charts.newTextStyle() を呼び出します。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setYAxisTextStyle(textStyle)

縦軸のテキスト スタイルを設定します。

// Creates a line chart builder and sets the Y-axis text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setYAxisTextStyle(textStyle);

パラメータ

名前説明
textStyleTextStyle横軸のタイトルに使用するテキスト スタイル。TextStyleBuilder オブジェクトを作成するには、Charts.newTextStyle() を呼び出します。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setYAxisTitle(title)

縦軸にタイトルを追加します。タイトルは中央に配置され、値の左側に表示されます。 できます。

// Creates a line chart builder and sets the Y-axis title.
var builder = Charts.newLineChart();
builder.setYAxisTitle('Y-axis Title')

パラメータ

名前説明
titleStringY 軸のタイトル。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


setYAxisTitleTextStyle(textStyle)

縦軸のタイトルのテキスト スタイルを設定します。

// Creates a line chart builder and sets the Y-axis title text style to blue, 18-point font.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var builder = Charts.newLineChart();
builder.setYAxisTitleTextStyle(textStyle);

パラメータ

名前説明
textStyleTextStyle横軸のタイトルに使用するテキスト スタイル。TextStyleBuilder オブジェクトを作成するには、Charts.newTextStyle() を呼び出します。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。


useLogScale()

範囲の軸を対数スケールに変換します(すべての値が正である必要があります)。範囲 軸は縦軸(折れ線グラフ、面グラフ、縦棒グラフ)で、 横軸(棒グラフなど)の場合は、横軸になります。

戻る

LineChartBuilder - このビルダーはチェーンに役立ちます。