Class LineChartBuilder

LineChartBuilder

Builder untuk diagram garis. Untuk mengetahui detail selengkapnya, lihat dokumentasi Google Charts.

Berikut adalah contoh yang menunjukkan cara membuat diagram garis. Data diimpor dari spreadsheet Google.

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

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

const chart = chartBuilder.build();

Metode

MetodeJenis hasil yang ditampilkanDeskripsi singkat
build()ChartMembuat diagram.
reverseCategories()LineChartBuilderMembalikkan gambar deret di sumbu domain.
setBackgroundColor(cssValue)LineChartBuilderMenetapkan warna latar belakang untuk diagram.
setColors(cssValues)LineChartBuilderMenetapkan warna untuk garis dalam diagram.
setCurveStyle(style)LineChartBuilderMenetapkan gaya yang akan digunakan untuk kurva dalam diagram.
setDataSourceUrl(url)LineChartBuilderMenetapkan URL sumber data yang digunakan untuk mengambil data dari sumber eksternal, seperti Google Spreadsheet.
setDataTable(tableBuilder)LineChartBuilderMenetapkan tabel data yang akan digunakan untuk diagram menggunakan DataTableBuilder.
setDataTable(table)LineChartBuilderMenetapkan tabel data yang berisi garis untuk diagram, serta label sumbu X.
setDataViewDefinition(dataViewDefinition)LineChartBuilderMenetapkan definisi tampilan data yang akan digunakan untuk diagram.
setDimensions(width, height)LineChartBuilderMenetapkan dimensi untuk diagram.
setLegendPosition(position)LineChartBuilderMenetapkan posisi legenda sehubungan dengan diagram.
setLegendTextStyle(textStyle)LineChartBuilderMenetapkan gaya teks legenda diagram.
setOption(option, value)LineChartBuilderMenetapkan opsi lanjutan untuk diagram ini.
setPointStyle(style)LineChartBuilderMenetapkan gaya untuk titik dalam garis.
setRange(start, end)LineChartBuilderMenetapkan rentang untuk diagram.
setTitle(chartTitle)LineChartBuilderMenetapkan judul diagram.
setTitleTextStyle(textStyle)LineChartBuilderMenetapkan gaya teks judul diagram.
setXAxisTextStyle(textStyle)LineChartBuilderMenetapkan gaya teks sumbu horizontal.
setXAxisTitle(title)LineChartBuilderMenambahkan judul ke sumbu horizontal.
setXAxisTitleTextStyle(textStyle)LineChartBuilderMenetapkan gaya teks judul sumbu horizontal.
setYAxisTextStyle(textStyle)LineChartBuilderMenetapkan gaya teks sumbu vertikal.
setYAxisTitle(title)LineChartBuilderMenambahkan judul ke sumbu vertikal.
setYAxisTitleTextStyle(textStyle)LineChartBuilderMenetapkan gaya teks judul sumbu vertikal.
useLogScale()LineChartBuilderMembuat sumbu rentang menjadi skala logaritmik (memerlukan semua nilai positif).

Dokumentasi mendetail

build()

Membuat diagram.

Pulang pergi

Chart — Objek Diagram, yang dapat disematkan ke dalam dokumen, elemen UI, atau digunakan sebagai gambar statis.


reverseCategories()

Membalikkan gambar deret di sumbu domain. Untuk diagram rentang vertikal (seperti diagram garis, area, atau kolom), ini berarti sumbu horizontal digambar dari kanan ke kiri. Untuk diagram rentang horizontal (seperti diagram batang), ini berarti sumbu vertikal digambar dari atas ke bawah. Untuk diagram lingkaran, ini berarti irisan digambar berlawanan arah jarum jam.

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

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setBackgroundColor(cssValue)

Menetapkan warna latar belakang untuk diagram.

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

Parameter

NamaJenisDeskripsi
cssValueStringNilai CSS untuk warna (seperti "blue" atau "#00f").

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setColors(cssValues)

Menetapkan warna untuk garis dalam diagram.

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

Parameter

NamaJenisDeskripsi
cssValuesString[]Array nilai CSS warna, seperti ["red", "#acf"]. Elemen ke-n dalam array mewakili warna garis ke-n dalam diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setCurveStyle(style)

Menetapkan gaya yang akan digunakan untuk kurva dalam diagram. Lihat CurveStyle untuk mengetahui gaya kurva yang diizinkan.

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

Parameter

NamaJenisDeskripsi
styleCurveStyleGaya untuk kurva dalam diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.

Lihat juga


setDataSourceUrl(url)

Menetapkan URL sumber data yang digunakan untuk mengambil data dari sumber eksternal, seperti Google Spreadsheet. Jika URL sumber data dan DataTable disediakan, URL sumber data akan diabaikan.

Untuk informasi selengkapnya tentang cara membuat kueri sumber data, lihat dokumentasi Google Charts.

Parameter

NamaJenisDeskripsi
urlStringURL sumber data, termasuk parameter kueri.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setDataTable(tableBuilder)

Menetapkan tabel data yang akan digunakan untuk diagram menggunakan DataTableBuilder. Ini adalah metode praktis untuk menetapkan tabel data tanpa perlu memanggil build().

Parameter

NamaJenisDeskripsi
tableBuilderDataTableBuilderBuilder tabel data. Tabel data baru akan langsung dibuat sebagai bagian dari panggilan ini, sehingga pembaruan lebih lanjut pada builder tidak akan tercermin dalam diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setDataTable(table)

Menetapkan tabel data yang berisi garis untuk diagram, serta label sumbu X. Kolom pertama harus berupa string, dan berisi label sumbu horizontal. Jumlah kolom yang dapat mengikuti, semuanya harus berupa angka. Setiap kolom ditampilkan sebagai baris terpisah.

Parameter

NamaJenisDeskripsi
tableDataTableSourceTabel data yang akan digunakan untuk diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setDataViewDefinition(dataViewDefinition)

Menetapkan definisi tampilan data yang akan digunakan untuk diagram.

Parameter

NamaJenisDeskripsi
dataViewDefinitionDataViewDefinitionObjek definisi tampilan data yang menentukan tampilan yang harus berasal dari sumber data tertentu untuk gambar diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setDimensions(width, height)

Menetapkan dimensi untuk diagram.

Parameter

NamaJenisDeskripsi
widthIntegerLebar diagram, dalam piksel.
heightIntegerTinggi diagram, dalam piksel.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setLegendPosition(position)

Menetapkan posisi legenda sehubungan dengan diagram. Secara default, tidak ada legenda.

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

Parameter

NamaJenisDeskripsi
positionPositionPosisi legenda.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setLegendTextStyle(textStyle)

Menetapkan gaya teks legenda diagram.

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

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk legenda diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setOption(option, value)

Menetapkan opsi lanjutan untuk diagram ini. Lihat opsi yang tersedia untuk diagram ini. Metode ini tidak berpengaruh jika opsi yang diberikan tidak valid.

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

Parameter

NamaJenisDeskripsi
optionStringOpsi yang akan ditetapkan.
valueObjectNilai yang akan ditetapkan.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setPointStyle(style)

Menetapkan gaya untuk titik dalam garis. Secara default, titik tidak memiliki gaya tertentu, dan hanya garis yang terlihat.

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

Parameter

NamaJenisDeskripsi
stylePointStyleGaya yang akan digunakan untuk titik dalam garis.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.

Lihat juga


setRange(start, end)

Menetapkan rentang untuk diagram.

Jika ada titik data yang berada di luar rentang, rentang akan diperluas untuk menyertakan titik data tersebut.

Parameter

NamaJenisDeskripsi
startNumberNilai untuk garis petak terendah pada sumbu rentang.
endNumberNilai untuk garis petak tertinggi pada sumbu rentang.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setTitle(chartTitle)

Menetapkan judul diagram. Judul ditampilkan di tengah di atas diagram.

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

Parameter

NamaJenisDeskripsi
chartTitleStringjudul diagram.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setTitleTextStyle(textStyle)

Menetapkan gaya teks judul diagram.

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

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk judul diagram. Anda dapat membuat objek TextStyleBuilder dengan memanggil Charts.newTextStyle().

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setXAxisTextStyle(textStyle)

Menetapkan gaya teks sumbu horizontal.

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

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek TextStyleBuilder dengan memanggil Charts.newTextStyle().

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setXAxisTitle(title)

Menambahkan judul ke sumbu horizontal. Judul dipusatkan dan muncul di bawah label nilai sumbu.

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

Parameter

NamaJenisDeskripsi
titleStringJudul untuk sumbu X.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setXAxisTitleTextStyle(textStyle)

Menetapkan gaya teks judul sumbu horizontal.

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

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek TextStyleBuilder dengan memanggil Charts.newTextStyle().

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setYAxisTextStyle(textStyle)

Menetapkan gaya teks sumbu vertikal.

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

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek TextStyleBuilder dengan memanggil Charts.newTextStyle().

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setYAxisTitle(title)

Menambahkan judul ke sumbu vertikal. Judul dipusatkan dan muncul di sebelah kiri label nilai.

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

Parameter

NamaJenisDeskripsi
titleStringJudul untuk sumbu Y.

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


setYAxisTitleTextStyle(textStyle)

Menetapkan gaya teks judul sumbu vertikal.

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

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek TextStyleBuilder dengan memanggil Charts.newTextStyle().

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.


useLogScale()

Membuat sumbu rentang menjadi skala logaritmik (memerlukan semua nilai positif). Sumbu rentang adalah sumbu vertikal untuk diagram vertikal (seperti garis, area, atau kolom) dan sumbu horizontal untuk diagram horizontal (seperti batang).

Pulang pergi

LineChartBuilder — Builder ini berguna untuk membuat rantai.