Class BarChartBuilder

BarChartBuilder

Builder untuk diagram batang. Untuk mengetahui detail selengkapnya, lihat dokumentasi Google Chart.

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

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

 var chartBuilder = Charts.newBarChart()
     .setTitle('Top Grossing Films in US and Canada')
     .setXAxisTitle('USD')
     .setYAxisTitle('Film')
     .setDimensions(600, 500)
     .setLegendPosition(Charts.Position.BOTTOM)
     .setDataSourceUrl(dataSourceUrl);

 var chart = chartBuilder.build();

Metode

MetodeJenis hasil yang ditampilkanDeskripsi singkat
build()ChartMembuat diagram.
reverseCategories()BarChartBuilderMembalikkan gambar deret di sumbu domain.
reverseDirection()BarChartBuilderMembalik arah pertumbuhan batang di sepanjang sumbu horizontal.
setBackgroundColor(cssValue)BarChartBuilderMenetapkan warna latar belakang untuk diagram.
setColors(cssValues)BarChartBuilderMenetapkan warna untuk garis dalam diagram.
setDataSourceUrl(url)BarChartBuilderMenetapkan URL sumber data yang digunakan untuk mengambil data dari sumber eksternal, seperti Google Spreadsheet.
setDataTable(tableBuilder)BarChartBuilderMenetapkan tabel data yang akan digunakan untuk diagram menggunakan DataTableBuilder.
setDataTable(table)BarChartBuilderMenetapkan tabel data yang berisi garis untuk diagram, serta label sumbu X.
setDataViewDefinition(dataViewDefinition)BarChartBuilderMenetapkan definisi tampilan data yang akan digunakan untuk diagram.
setDimensions(width, height)BarChartBuilderMenetapkan dimensi untuk diagram.
setLegendPosition(position)BarChartBuilderMenetapkan posisi legenda sehubungan dengan diagram.
setLegendTextStyle(textStyle)BarChartBuilderMenetapkan gaya teks legenda diagram.
setOption(option, value)BarChartBuilderMenetapkan opsi lanjutan untuk diagram ini.
setRange(start, end)BarChartBuilderMenetapkan rentang untuk diagram.
setStacked()BarChartBuilderMenggunakan garis bertumpuk, artinya nilai baris dan batang ditumpuk (akumulasi).
setTitle(chartTitle)BarChartBuilderMenetapkan judul diagram.
setTitleTextStyle(textStyle)BarChartBuilderMenetapkan gaya teks judul diagram.
setXAxisTextStyle(textStyle)BarChartBuilderMenetapkan gaya teks sumbu horizontal.
setXAxisTitle(title)BarChartBuilderMenambahkan judul ke sumbu horizontal.
setXAxisTitleTextStyle(textStyle)BarChartBuilderMenetapkan gaya teks judul sumbu horizontal.
setYAxisTextStyle(textStyle)BarChartBuilderMenetapkan gaya teks sumbu vertikal.
setYAxisTitle(title)BarChartBuilderMenambahkan judul ke sumbu vertikal.
setYAxisTitleTextStyle(textStyle)BarChartBuilderMenetapkan gaya teks judul sumbu vertikal.
useLogScale()BarChartBuilderMembuat sumbu rentang menjadi skala logaritmik (mengharuskan semua nilai positif).

Dokumentasi mendetail

build()

Membuat diagram.

Return

Chart — Objek Chart, 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), artinya sumbu horizontal digambar dari kanan ke kiri. Untuk diagram rentang horizontal (seperti diagram batang), artinya 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.
var builder = Charts.newPieChart();
builder.reverseCategories();

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


reverseDirection()

Membalik arah pertumbuhan batang di sepanjang sumbu horizontal. Secara {i>default<i}, nilai bertambah dari kiri ke kanan. Memanggil metode ini menyebabkannya memanjang dari kanan ke kiri.

Return

BarChartBuilder — 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
var builder = Charts.newLineChart();
builder.setBackgroundColor("gray");

Parameter

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

Return

BarChartBuilder — 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.
var builder = Charts.newLineChart();
builder.setColors(["green", "red"]);

Parameter

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

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setDataSourceUrl(url)

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

Untuk informasi lebih lanjut tentang melakukan kueri sumber data, lihat dokumentasi Google Chart.

Parameter

NamaJenisDeskripsi
urlStringURL sumber data, termasuk parameter kueri apa pun.

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setDataTable(tableBuilder)

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

Parameter

NamaJenisDeskripsi
tableBuilderDataTableBuilderPembuat tabel data. Tabel data baru dibuat secara instan sebagai bagian dari panggilan ini, sehingga update lebih lanjut pada builder tidak akan tercermin dalam diagram.

Return

BarChartBuilder — 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. Berapa pun jumlah kolom bisa mengikuti, semuanya harus numerik. Setiap kolom ditampilkan sebagai garis terpisah.

Parameter

NamaJenisDeskripsi
tableDataTableSourceTabel data yang akan digunakan untuk diagram.

Return

BarChartBuilder — 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.

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setDimensions(width, height)

Menetapkan dimensi untuk diagram.

Parameter

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

Return

BarChartBuilder — 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.
var builder = Charts.newLineChart();
builder.setLegendPosition(Charts.Position.RIGHT);

Parameter

NamaJenisDeskripsi
positionPositionPosisi legenda.

Return

BarChartBuilder — 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.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var builder = Charts.newLineChart();
builder.setLegendTextStyle(style);

Parameter

NamaJenisDeskripsi
textStyleTextStyleGaya teks yang akan digunakan untuk legenda diagram.

Return

BarChartBuilder — 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 bar chart with a 1-second animation duration.
var builder = Charts.newBarChart();
builder.setOption('animation.duration', 1000);
var chart = builder.build();

Parameter

NamaJenisDeskripsi
optionStringOpsi yang akan ditetapkan.
valueObjectNilai yang akan ditetapkan.

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


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 sumbu rentang.
endNumberNilai untuk garis petak tertinggi sumbu rentang.

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setStacked()

Menggunakan garis bertumpuk, artinya nilai baris dan batang ditumpuk (akumulasi). Secara default, tidak ada penumpukan.

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setTitle(chartTitle)

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

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

Parameter

NamaJenisDeskripsi
chartTitleStringjudul bagan.

Return

BarChartBuilder — 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.
var textStyleBuilder = Charts.newTextStyle().setColor('#0000FF').setFontSize(26);
var style = textStyleBuilder.build();
var 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().

Return

BarChartBuilder — 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.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var 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().

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setXAxisTitle(title)

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

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

Parameter

NamaJenisDeskripsi
titleStringJudul untuk sumbu X.

Return

BarChartBuilder — 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.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var 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().

Return

BarChartBuilder — 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.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var 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().

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


setYAxisTitle(title)

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

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

Parameter

NamaJenisDeskripsi
titleStringJudul untuk sumbu Y.

Return

BarChartBuilder — 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.
var textStyle = Charts.newTextStyle().setColor('blue').setFontSize(18).build();
var 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().

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.


useLogScale()

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

Return

BarChartBuilder — Builder ini berguna untuk membuat rantai.