Halaman ini diterjemahkan oleh Cloud Translation API.

Visualisasi: Sparkline (Gambar)

Penting: Bagian Diagram Gambar dari Alat Google Chart secara resmi tidak digunakan lagi sejak 20 April 2012. Fitur ini akan terus berfungsi sesuai dengan kebijakan penghentian penggunaan kami.

Ringkasan
Contoh
Memuat
Format Data
Opsi Konfigurasi
Metode
Peristiwa
Kebijakan Data

Ringkasan

Satu atau beberapa sparkline yang dirender dengan gambar menggunakan Google Chart API. Gambar tersebut akan dimuat di tabel HTML.

Contoh

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load("current", {packages:["imagesparkline"]});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

        var data = google.visualization.arrayToDataTable([
         ['Revenue', 'Licenses'],
         [435, 132],
         [438, 131],
         [512, 137],
         [460, 142],
         [491, 140],
         [487, 139],
         [552, 147],
         [511, 146],
         [505, 151],
         [509, 149]
        ]);

        var chart = new google.visualization.ImageSparkLine(document.getElementById('chart_div'));

        chart.draw(data, {width: 120, height: 40, showAxisLines: false,  showValueLabels: false, labelPosition: 'left'});
      }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 120px; height: 40px;"></div>
  </body>
</html>

Memuat

Nama paket google.charts.load adalah "imagesparkline".

  google.charts.load("current", {packages: ["imagesparkline"]});

Nama class visualisasi adalah google.visualization.ImageSparkLine.

  var visualization = new google.visualization.ImageSparkLine(container);

Format Data

Berapa pun jumlah kolomnya. Semua kolom harus berupa angka. Setiap kolom ditampilkan sebagai satu garis percik.

Opsi Konfigurasi

Name	Jenis	Default	Deskripsi
warna	string		Menentukan warna yang akan digunakan untuk semua diagram. String dalam format #rrggbb. Misalnya: '#00cc00'. Digunakan hanya jika opsi `colors` tidak ditentukan.
warna	Array string	Warna default	Warna yang akan digunakan untuk kolom data. Array string dengan setiap elemen berupa string dalam format #rrggbb. Misalnya: '#00cc00'. Warna i digunakan untuk kolom data i. Jika jumlah warna lebih kecil dari jumlah kolom, pemilihan warna akan digabungkan.
fill	boolean	false	Jika true (benar), akan mengisi area di bawah garis dengan warna.
tinggi	number	Tinggi container	Tinggi gambar, dalam piksel.
labelPosition	string	tidak ada	Posisi label. Nilai yang didukung adalah 'none', 'left', 'right'.
max	Array angka	Nilai data maksimum setiap garis percik	Nilai tertinggi untuk rentang nilai data setiap garis percik. Indeks dalam array harus cocok dengan indeks kolom dalam DataTable. Jika semua nilai null, ini akan menjadi nilai maksimum dalam deret.
mnt	Array angka	Nilai data minimum setiap garis percik	Nilai terendah untuk rentang nilai data setiap garis percik. Indeks dalam array harus cocok dengan indeks kolom dalam DataTable. Jika semua nilai null, ini akan menjadi nilai minimum dalam deret.
showAxisLines	boolean	true	Jika true (benar), garis sumbu akan ditampilkan. Jika salah, tidak, dan default untuk showValueLabels adalah false.
showValueLabels	boolean	true, kecuali jika showAxisLines bernilai false.	Jika true (benar), label sumbu nilai akan ditampilkan.
title	Array string	Tidak ada judul yang ditampilkan	Judul yang akan digunakan untuk setiap garis percik.
lebar	number	Lebar container	Lebar diagram, dalam piksel.
tata letak	string	{i>'v<i}'	Tata letak vertikal atau horizontal: 'v' untuk vertikal, 'h' untuk horizontal.

Metode

Metode	Jenis Nilai yang Ditampilkan	Deskripsi
`draw(data, options)`	tidak ada	Menggambar diagram.
`getSelection()`	Array elemen pemilihan	Menampilkan indeks diagram yang dipilih sebagai array objek. Setiap objek memiliki properti kolom yang berisi nomor kolom garis percik yang dipilih. Dapat menampilkan lebih dari satu kolom yang dipilih.
`setSelection(selection)`	tidak ada	Memilih garis percik yang ditentukan, dan membatalkan pilihan garis percik yang tidak ditentukan. pilihan adalah array objek, masing-masing dengan properti `column` numerik, yang merupakan indeks garis percik yang dipilih. Lihat `setSelection()` untuk mengetahui informasi selengkapnya.

Acara

Name	Deskripsi	Properti
pilih	Peristiwa pilihan standar.	Tidak ada

Kebijakan Data

Lihat kebijakan logging Chart API.