Builder untuk diagram sebar. Untuk mengetahui detail selengkapnya, lihat dokumentasi Google Chart.
Berikut adalah contoh yang menunjukkan cara membuat diagram sebar. 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 nilai yang ditampilkan | Deskripsi singkat |
|---|---|---|
build() | Chart | Membangun diagram. |
set | Scatter | Menetapkan warna latar belakang diagram. |
set | Scatter | Menetapkan warna untuk garis dalam diagram. |
set | Scatter | Menetapkan URL sumber data yang digunakan untuk menarik 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 | Mengubah sumbu horizontal menjadi skala logaritmik (semua nilai harus 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 | Mengubah sumbu vertikal menjadi skala logaritmik (semua nilai harus 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()
Membangun diagram.
Pulang pergi
Chart — Objek Chart, yang dapat disematkan ke dalam dokumen, elemen UI, atau digunakan sebagai gambar statis.
setBackgroundColor(cssValue)
Menetapkan warna latar belakang 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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| Nama | Jenis | Deskripsi |
|---|---|---|
css | String[] | Array nilai CSS warna, seperti ["red", "#acf"]. Elemen ke-n
dalam array merepresentasikan warna garis ke-n dalam diagram. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setDataSourceUrl(url)
Menetapkan URL sumber data yang digunakan untuk menarik data dari sumber eksternal, seperti Google Spreadsheet. Jika URL sumber data dan DataTable disediakan, URL sumber data akan diabaikan.
Untuk mengetahui informasi selengkapnya tentang membuat kueri sumber data, lihat dokumentasi Google Chart.
Parameter
| Nama | Jenis | Deskripsi |
|---|---|---|
url | String | URL sumber data, termasuk parameter kueri. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| Nama | Jenis | Deskripsi |
|---|---|---|
table | Data | Pembuat tabel data. Tabel data baru dibuat secara instan sebagai bagian dari panggilan ini, sehingga pembaruan lebih lanjut pada pembuat tidak akan tercermin dalam diagram. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setDataTable(table)
Menetapkan tabel data yang berisi garis untuk diagram, serta label sumbu X. Kolom pertama harus berupa string, dan berisi label sumbu horizontal. Dapat diikuti oleh sejumlah kolom, yang semuanya harus berupa angka. Setiap kolom ditampilkan sebagai garis terpisah.
Parameter
| Nama | Jenis | Deskripsi |
|---|---|---|
table | Data | Tabel data yang akan digunakan untuk diagram. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setDataViewDefinition(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 diperoleh dari sumber data tertentu untuk penggambaran diagram. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setDimensions(width, height)
Menetapkan dimensi untuk diagram.
Parameter
| Nama | Jenis | Deskripsi |
|---|---|---|
width | Integer | Lebar diagram, dalam piksel. |
height | Integer | Tinggi diagram, dalam piksel. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| Nama | Jenis | Deskripsi |
|---|---|---|
position | Position | Posisi legenda. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| Nama | Jenis | Deskripsi |
|---|---|---|
text | Text | Gaya teks yang akan digunakan untuk legenda diagram. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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 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 disetel. |
value | Object | Nilai yang akan ditetapkan. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| Nama | Jenis | Deskripsi |
|---|---|---|
style | Point | Gaya yang akan digunakan untuk titik dalam garis. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
Lihat juga
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
| Nama | Jenis | Deskripsi |
|---|---|---|
chart | String | judul diagram. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| Nama | Jenis | Deskripsi |
|---|---|---|
text | Text | Gaya teks yang akan digunakan untuk judul diagram. Anda dapat membuat objek Text dengan memanggil Charts.newTextStyle(). |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setXAxisLogScale()
Mengubah sumbu horizontal menjadi skala logaritmik (semua nilai harus positif).
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setXAxisRange(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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| 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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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. const builder = Charts.newLineChart(); builder.setTitle('X-axis Title');
Parameter
| Nama | Jenis | Deskripsi |
|---|---|---|
title | String | Judul untuk sumbu X. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| 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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setYAxisLogScale()
Mengubah sumbu vertikal menjadi skala logaritmik (semua nilai harus positif).
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
setYAxisRange(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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| 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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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. const builder = Charts.newLineChart(); builder.setYAxisTitle('Y-axis Title');
Parameter
| Nama | Jenis | Deskripsi |
|---|---|---|
title | String | Judul untuk sumbu Y. |
Pulang pergi
ScatterChartBuilder — Builder ini, berguna untuk merangkai.
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
| 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
ScatterChartBuilder — Builder ini, berguna untuk merangkai.