Görselleştirme: Mini grafik (Resim)

Önemli: Google Grafik Araçları'nın Resim Grafikleri bölümü, 20 Nisan 2012 tarihi itibarıyla resmi olarak kullanımdan kaldırılmıştır. Hesabınız, kullanımdan kaldırma politikamız uyarınca çalışmaya devam edecektir.

Genel bakış

Google Charts API kullanılarak görüntülerle oluşturulan bir veya birden fazla mini grafik. Görseller bir HTML tablosunda yer alır.

Örnek

<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>

Yükleniyor

google.charts.load paketinin adı: "imagesparkline".

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

Görselleştirmenin sınıf adı: google.visualization.ImageSparkLine.

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

Veri Biçimi

Herhangi bir sayıda sütun. Tüm sütunlar sayı olmalıdır. Her sütun tek bir mini grafik olarak gösterilir.

Yapılandırma Seçenekleri

Ad Tür Varsayılan Açıklama
renk dize Tüm grafikler için kullanılacak rengi belirtir. #rrggbb biçiminde bir dize. Örneğin: '#00cc00'. Yalnızca colors seçeneği belirtilmemişse kullanılır.
renkler Dize dizisi Varsayılan renkler Veri sütunları için kullanılacak renkler. Her öğenin bir dize olduğu #rrggbb biçiminde bir dize dizisi. Örneğin: '#00cc00'. i rengi, i veri sütunu için kullanılır. Renk sayısı sütun sayısından azsa renk seçimi daire içine alınır.
fill boolean false True (doğru) ise çizginin altındaki alan renkli olarak doldurulur.
yükseklik sayı Kapsayıcının yüksekliği Resimlerin piksel cinsinden yüksekliği.
labelPosition dize yok Etiketlerin konumu. Desteklenen değerler: "none", "left", "right".
maks. Sayı dizisi Her bir mini grafiğin maksimum veri değeri Her bir mini grafiğin veri değeri aralığı için en yüksek değer. Dizideki dizin, DataTable'daki sütun diziniyle eşleşmelidir. Tüm değerler null ise bu, serideki maksimum değer olur.
dk Sayı dizisi Her bir mini grafiğin minimum veri değeri Her bir mini grafiğin veri değeri aralığı için en düşük değer. Dizideki dizin, DataTable'daki sütun diziniyle eşleşmelidir. Tüm değerler boşsa bu, serideki en düşük değer olur.
showAxisLines boolean true True (doğru) ise eksen çizgileri gösterilir. Yanlış değerine ayarlanırsa bunlar geçerli değildir ve showValueEtiketler için varsayılan değer false'tur.
showValueLabels boolean true değerine sahiptir (showAxisLines'ın yanlış olduğu durumlar hariç). Doğru değerine ayarlanırsa değer ekseni etiketleri gösterilir.
title Dize dizisi Başlık gösterilmiyor Her mini grafik için kullanılacak başlıklar.
genişlik sayı Kapsayıcı genişliği Grafiklerin piksel cinsinden genişliği.
düzen dize "v" Dikey veya yatay düzen: dikey için "v", yatay için "h".

Yöntemler

Yöntem Dönüş Türü Açıklama
draw(data, options) yok Grafiği çizer.
getSelection() Seçim öğeleri dizisi Seçili grafiklerin dizinlerini bir nesne dizisi olarak döndürür. Her nesne, seçilen bir mini grafiğin sütun numarasını içeren bir sütun özelliğine sahiptir. Birden fazla seçili sütun döndürebilir.
setSelection(selection) yok Belirtilen mini grafikleri ve belirtilmeyen tüm mini grafikleri seçer. seçim, her biri seçili mini grafiğin dizini olan sayısal column özelliğine sahip bir nesne dizisidir. Daha fazla bilgi için setSelection() bölümüne bakın.

Etkinlikler

Ad Açıklama Özellikler
seç Standart seçim etkinliği. Yok

Veri Politikası

Lütfen Chart API günlük kaydı politikasını inceleyin.