Builder untuk diagram sebar. Untuk mengetahui detail selengkapnya, lihat dokumentasi Google Charts.
Berikut adalah contoh yang menunjukkan cara membuat diagram pencar. Data diimpor dari spreadsheet Google.
// Get sample data from a spreadsheet. const dataSourceUrl = 'https://docs.google.com/spreadsheet/tq?range=C1%3AD' + '&key=0Aq4s9w_HxMs7dHpfX05JdmVSb1FpT21sbXd4NVE3UEE&gid=4&headers=-1'; const chartBuilder = Charts.newScatterChart() .setTitle('Adjusted GDP & U.S. Population') .setXAxisTitle('U.S. Population (millions)') .setYAxisTitle('Adjusted GDP ($ billions)') .setDimensions(600, 500) .setLegendPosition(Charts.Position.NONE) .setDataSourceUrl(dataSourceUrl); const chart = chartBuilder.build();
Metode
Metode | Jenis hasil yang ditampilkan | Deskripsi singkat |
---|---|---|
build() | Chart | Membuat diagram. |
set | Scatter | Menetapkan warna latar belakang untuk diagram. |
set | Scatter | Menetapkan warna untuk garis dalam diagram. |
set | Scatter | Menetapkan URL sumber data yang digunakan untuk mengambil data dari sumber eksternal, seperti Google Spreadsheet. |
set | Scatter | Menetapkan tabel data yang akan digunakan untuk diagram menggunakan DataTableBuilder. |
set | Scatter | Menetapkan tabel data yang berisi garis untuk diagram, serta label sumbu X. |
set | Scatter | Menetapkan definisi tampilan data yang akan digunakan untuk diagram. |
set | Scatter | Menetapkan dimensi untuk diagram. |
set | Scatter | Menetapkan posisi legenda sehubungan dengan diagram. |
set | Scatter | Menetapkan gaya teks legenda diagram. |
set | Scatter | Menetapkan opsi lanjutan untuk diagram ini. |
set | Scatter | Menetapkan gaya untuk titik dalam garis. |
set | Scatter | Menetapkan judul diagram. |
set | Scatter | Menetapkan gaya teks judul diagram. |
set | Scatter | Membuat sumbu horizontal menjadi skala logaritmik (memerlukan semua nilai positif). |
set | Scatter | Menetapkan rentang untuk sumbu horizontal diagram. |
set | Scatter | Menetapkan gaya teks sumbu horizontal. |
set | Scatter | Menambahkan judul ke sumbu horizontal. |
set | Scatter | Menetapkan gaya teks judul sumbu horizontal. |
set | Scatter | Membuat sumbu vertikal menjadi skala logaritmik (memerlukan semua nilai positif). |
set | Scatter | Menetapkan rentang untuk sumbu vertikal diagram. |
set | Scatter | Menetapkan gaya teks sumbu vertikal. |
set | Scatter | Menambahkan judul ke sumbu vertikal. |
set | Scatter | Menetapkan gaya teks judul sumbu vertikal. |
Dokumentasi mendetail
build()
Membuat diagram.
Pulang pergi
Chart
— Objek Diagram, yang dapat disematkan ke dalam dokumen, elemen UI, atau digunakan sebagai gambar statis.
set Background Color(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
Nama | Jenis | Deskripsi |
---|---|---|
css | String | Nilai CSS untuk warna (seperti "blue" atau "#00f" ). |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Colors(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
Nama | Jenis | Deskripsi |
---|---|---|
css | String[] | Array nilai CSS warna, seperti ["red", "#acf"] . Elemen ke-n
dalam array mewakili warna garis ke-n dalam diagram. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Data Source Url(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
Nama | Jenis | Deskripsi |
---|---|---|
url | String | URL sumber data, termasuk parameter kueri. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Data Table(tableBuilder)
Menetapkan tabel data yang akan digunakan untuk diagram menggunakan DataTableBuilder. Ini adalah metode praktis
untuk menetapkan tabel data tanpa perlu memanggil build()
.
Parameter
Nama | Jenis | Deskripsi |
---|---|---|
table | Data | Builder 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
Scatter
— Builder ini berguna untuk membuat rantai.
set Data Table(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
Nama | Jenis | Deskripsi |
---|---|---|
table | Data | Tabel data yang akan digunakan untuk diagram. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Data View Definition(dataViewDefinition)
Menetapkan definisi tampilan data yang akan digunakan untuk diagram.
Parameter
Nama | Jenis | Deskripsi |
---|---|---|
data | Data | Objek definisi tampilan data yang menentukan tampilan yang harus berasal dari sumber data tertentu untuk gambar diagram. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Dimensions(width, height)
Menetapkan dimensi untuk diagram.
Parameter
Nama | Jenis | Deskripsi |
---|---|---|
width | Integer | Lebar diagram, dalam piksel. |
height | Integer | Tinggi diagram, dalam piksel. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Legend Position(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
Nama | Jenis | Deskripsi |
---|---|---|
position | Position | Posisi legenda. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Legend Text Style(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
Nama | Jenis | Deskripsi |
---|---|---|
text | Text | Gaya teks yang akan digunakan untuk legenda diagram. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Option(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 scatter chart with a 1-second animation duration. const builder = Charts.newScatterChart(); builder.setOption('animation.duration', 1000); const chart = builder.build();
Parameter
Nama | Jenis | Deskripsi |
---|---|---|
option | String | Opsi yang akan ditetapkan. |
value | Object | Nilai yang akan ditetapkan. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Point Style(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
Nama | Jenis | Deskripsi |
---|---|---|
style | Point | Gaya yang akan digunakan untuk titik dalam garis. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
Lihat juga
set Title(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
Nama | Jenis | Deskripsi |
---|---|---|
chart | String | judul diagram. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set Title Text Style(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
Nama | Jenis | Deskripsi |
---|---|---|
text | Text | Gaya teks yang akan digunakan untuk judul diagram. Anda dapat membuat objek Text dengan memanggil Charts.newTextStyle() . |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set XAxis Log Scale()
Membuat sumbu horizontal menjadi skala logaritmik (memerlukan semua nilai positif).
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set XAxis Range(start, end)
Menetapkan rentang untuk sumbu horizontal diagram.
Jika ada titik data yang berada di luar rentang, rentang akan diperluas untuk menyertakan titik data tersebut.
// Creates a scatter chart builder and sets the X-axis range to be 0 to 100. const builder = Charts.newTableChart(); builder.setXAxisRange(0, 100);
Parameter
Nama | Jenis | Deskripsi |
---|---|---|
start | Number | Nilai untuk garis petak terendah pada sumbu horizontal. |
end | Number | Nilai untuk garis petak tertinggi pada sumbu horizontal. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set XAxis Text Style(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
Nama | Jenis | Deskripsi |
---|---|---|
text | Text | Gaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek Text dengan memanggil Charts.newTextStyle() . |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set XAxis Title(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
Nama | Jenis | Deskripsi |
---|---|---|
title | String | Judul untuk sumbu X. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set XAxis Title Text Style(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
Nama | Jenis | Deskripsi |
---|---|---|
text | Text | Gaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek Text dengan memanggil Charts.newTextStyle() . |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set YAxis Log Scale()
Membuat sumbu vertikal menjadi skala logaritmik (memerlukan semua nilai positif).
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set YAxis Range(start, end)
Menetapkan rentang untuk sumbu vertikal diagram. Jika ada titik data yang berada di luar rentang, rentang akan diperluas untuk menyertakan titik data tersebut.
// Creates a scatter chart builder and sets the Y-axis range to be 0 to 100. const builder = Charts.newTableChart(); builder.setYAxisRange(0, 100);
Parameter
Nama | Jenis | Deskripsi |
---|---|---|
start | Number | Nilai untuk garis petak terendah pada sumbu vertikal. |
end | Number | Nilai untuk garis petak tertinggi pada sumbu vertikal. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set YAxis Text Style(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
Nama | Jenis | Deskripsi |
---|---|---|
text | Text | Gaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek Text dengan memanggil Charts.newTextStyle() . |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set YAxis Title(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
Nama | Jenis | Deskripsi |
---|---|---|
title | String | Judul untuk sumbu Y. |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.
set YAxis Title Text Style(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
Nama | Jenis | Deskripsi |
---|---|---|
text | Text | Gaya teks yang akan digunakan untuk judul sumbu horizontal. Anda dapat membuat objek Text dengan memanggil Charts.newTextStyle() . |
Pulang pergi
Scatter
— Builder ini berguna untuk membuat rantai.