Peringatan: API ini tidak digunakan lagi pada 2012 dan dinonaktifkan pada 18 Maret 2019. Sebagai gantinya, gunakan Google Chart API yang dikelola secara aktif.

Halaman ini diterjemahkan oleh Cloud Translation API.

Galeri Keren Tangga Lagu

Halaman ini bertujuan untuk menunjukkan fitur-fitur yang dapat dilakukan dengan Charts API.

18,10,10,10,10,10,10,10,10,10,10,10,40,10,10,10,10,10,10,10,10,10,10,10,10,10,18,10,10,10,10,10,10,10,10,10,18,10,10,10,10,10,10,10,10,10,10,10,40,10,10,18,10,10,10,18,10,10,10,40,10,40,10,10,181,40,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10,10.101,40,181,401,401,401

Manusia Biru

Diagram garis yang digambar dengan tangan mendetail (lxy).

Oleh: Roberto Mensa

Saya Stephen Roche!

Tour de France, Tangga Lagu

Oleh: Thomas Guest

1987, Pedro Delgado

Reproduksi grafis panggung pegunungan dramatis Stephen Roche dalam Tur tahun 1987. Pedro Delgado, mengenakan baju kuning, menunjukkan keunggulan penting dari saingnya dalam mendaki La Plagne. Namun, entah bagaimana, Roche kembali ke persaingan, dan muncul di garis finish hanya 5 detik di Delgado. Dia mengejutkan semua orang. Dia pingsan, kelelahan, dan harus diberi oksigen, tetapi dia sudah cukup melakukannya; Roche memenangkan Tur. Keren!

2009, Mark Cavendish

Manxman Mercurial, Mark Cavendish, memenangkan 6 tahap yang luar biasa dari Tur 2009. Di sinilah dia, menjadi orang Inggris pertama yang memenangkan pertandingan terakhir di Champs-Élysées, dan memenangkannya dengan selisih yang sangat besar.

Pac-Man

Diagram lingkaran yang menyerupai Pac-Man legendaris.

Oleh: Paolo Massa

Mondrian

Reproduksi diagram garis dari lukisan terkenal karya Piet Mondrian: "Composition with Yellow, Blue, and Red" (1937-42) dibuat dengan linechart.

Oleh: Dmitry Scriptin

Peta Bintang di Diagram Sebar

Menampilkan diagram bintang untuk lokasi tertentu di bumi, memperlihatkan khatulistiwa (x), ekliptik (o), kutub (N), zenit (z), dan beberapa planet (h—Saturnus, d—Mars, D—bulan ).

Oleh: Mike Duffy

Rubah

Rekaman aktivitas diagram garis (lxy) dari gambar yang digambar tangan.

Oleh: James dari EPH Phone Answering Services

Diagram Kartu Punch (Diagram pencar)

Contoh yang bagus tentang penggunaan ukuran dan penempatan titik di diagram pencar untuk menyampaikan informasi. Beberapa hal yang perlu diperhatikan dalam URL diagram ini:

cht=s - Ini adalah scatterchart.
chd=0,1,2,3,...|0,0,0,0,...|0,1,3,0 - Data dalam diagram ini ditata dengan sangat rapi dalam bentuk petak. Diagram pencar ini menggunakan tiga deret; deret terakhir digunakan untuk menentukan ukuran titik.
chds=-1,24,-1,7,0,17 - Parameter chds menetapkan skala -1—24 kolom dan -1—7 baris. Dengan begitu, Anda dapat menentukan titik menggunakan petak sederhana yang sesuai dengan jam dan hari, dengan nol adalah entri pertama. Skalanya dimulai dengan -1 sehingga titik-titik tidak digambar tepat pada garis sumbu (menambahkan baris/kolom kosong di sekitar diagram).
chm=o,333333,1,-1,25 - Menentukan jenis penanda default yang digunakan untuk semua titik. Tindakan ini menetapkan lingkaran hampir hitam sebesar 25 titik sebagai ukuran default. 25 adalah ukuran nilai data maksimum; nilai yang lebih kecil dari ini dalam deret data ketiga akan menyebabkan titik yang lebih kecil.
chxl=0:||12am|1|2|3|4|5|6|7|8|9|10|11|12pm|1|2|3|4|5|6|7|8|9|10|11||1:||Sun|Mon|Tue|Wed|Thr|Fri|Sat| - Label untuk sumbu x dan y. Nilai pertama kosong (ditetapkan sebagai '||') untuk kedua sumbu, untuk menyisakan ruang kosong di persimpangan sumbu.

Oleh: github.com

Diagram garis traffic web (Diagram garis)

Diagram garis yang dibuat dengan baik menunjukkan gaya garis, penanda yang tumpang tindih, garis petak, isian, dan penanda rentang. Berikut adalah parameter yang diminati:

cht=lc - Diagram garis, yang memberi titik secara merata di sepanjang sumbu x.
chg=25,25,3,2 - Menentukan ukuran dan pola petak. Di sini ada 25 garis unit di sepanjang sumbu x dan y, dengan tanda hubung tiga piksel dan ruang dua piksel, yang memberikan garis putus-putus.
chf=bg,s,1F1D1D|c,lg,0,363433,1.0,2E2B2A,0.0 - Dua pengisi: satu untuk latar belakang diagram, dan satu pengisi lebih ringan untuk area plot diagram.
chm= - Penanda berlian berwarna putih pada garis sebenarnya merupakan kombinasi dari dua penanda: penanda warna garis terlebih dahulu, lalu penanda putih yang sedikit lebih kecil dengan ukuran dan bentuk yang sama pada titik yang sama, sehingga memberikan tampilan penanda berlian isi putih. Karena warna isian ditentukan terlebih dahulu, warna akan berada di bawah penanda putih secara otomatis, sehingga Anda tidak perlu menentukan nilai urutan z agar penanda dapat menangani pelapisan.
- r,FF00004C,0,0.40,0.60 - Pita merah horizontal di latar belakang diagram. Perhatikan bagaimana nilai awal dan akhir berasal dari rentang 0,0-1,0, bukan 0-100. Kode ini juga menentukan transparansi agar garis petak dan latar belakang dapat muncul.
- R,0080004C,0,0.70,0,90 - Pita hijau vertikal di latar belakang diagram. Perhatikan bagaimana nilai awal dan akhir berasal dari rentang 0,0-1,0, bukan 0-100. Ikon ini juga menentukan transparansi agar garis petak dan latar belakang dapat muncul.
- d,CA3D05,0,-1,12,0|d,FFFFFF,0,-1,8,0 - Penanda berlian merah di semua titik pada garis biru. Penanda pertama adalah berlian merah, yang kedua sedikit lebih kecil dan putih.
- d,87CEEB,1,-1,12,0|d,FFFFFF,1,-1,8,0 - Penanda berlian biru pada semua titik pada garis biru. Penanda pertama adalah berlian biru, yang kedua sedikit lebih kecil dan putih.
chxt=y,y,x,x,x dan chxl=0:||25|50|75|100|1:|Hits|2:|Nov|Dec|Jan|Feb|Mar|3:|2007|2007|2008|2008|2008|4:|Month - Label axis. Diagram ini menunjukkan lima kumpulan label sumbu: dua sumbu y, dan tiga sumbu x. Sumbu y terdalam (indeks 0) menyertakan label kosong, bukan penanda "0", yang akan sedikit memenuhi sudut kiri bawah diagram.
chxp=1,50.0| 4,50.0 - Menentukan penempatan label "Klik" dan "Bulan" masing-masing pada sumbu y dan x.
chma=55,120,0,0 - Margin kiri dan kanan ditingkatkan untuk menambahkan sedikit ruang antara sisi diagram dan label "Klik" dan teks legenda.

Oleh: charts4j.com

Diagram Radar

Diagram radar yang bagus dengan penanda yang menunjukkan nilai yang agak buruk di berbagai bidang studi.

cht=r - Diagram radar.
chxt=y,x - Menampilkan skala numerik sebagai lingkaran konsentris (sumbu x), ditambah penanda derajat (sumbu y).
chls=4 - Gaya garis untuk garis pelacakan radar (garis selebar empat piksel).
chd=t:80,49,48,78,59,80 - Data mencakup satu poin redundan: titik pertama dan terakhir memiliki nilai yang sama, agar plot dapat digabungkan dengan baik.
chxp=0,0,20,40,60,80,100 - Menentukan garis petak yang akan ditampilkan di sumbu x. Tanpa parameter ini, garis petak akan ditampilkan setiap 10 unit, yang akan membuat diagram yang sangat sibuk.
chxl=1:|Maths|Arts|French|German|Music - Hanya lima label yang ditentukan untuk enam titik data. Diagram dibagi menjadi beberapa bagian yang lebih besar: label atau (titik data - 1). Dalam diagram ini, keduanya memiliki nilai yang sama.
chm=s,CC3366,0,-1,12,0|s,FFFFFF,0,-1,8,0 - Membuat penanda gaya kotak terisi, dibuat dengan terlebih dahulu menentukan kotak merah, lalu kotak putih yang sedikit lebih kecil. Kotak putih ditentukan kedua, sehingga digambar kedua, dan tidak perlu khawatir menentukan urutan z setiap penanda untuk menentukan cara ditumpuk.

Oleh: charts4j.com

Diagram Radar yang Fantastis

Bagan radar yang fantastis. Rangkaian ini terdiri dari dua rangkaian data: satu untuk kelopak, dan satu untuk mata biru di tengah. Lingkaran merah muda kecil adalah penanda lingkaran. Mata dan kelopak diwarnai menggunakan isian garis. Beberapa hal yang perlu diperhatikan dalam URL:

cht=rs - Diagram radar dari jenis rs, bukan r, untuk memberikan spline membulat.
chd=s: ... - Dua deret data yang ditentukan, masing-masing dengan 202 titik data. Seri pertama adalah untuk kelopak, yang kedua adalah untuk mata yang berada di tengah. Setiap titik berjarak sekitar 360/202 = 1,8 derajat terpisah.
chf=bg,s,504227 - Isi latar belakang berwarna cokelat
chm=
- B,8FA3D6,0,0,0 - Isi periwinkle untuk kelopak.
- o,FFC0CB,1,0,20,0 - Sepuluh penanda lingkaran merah muda (tidak semuanya ditampilkan di sini) dengan jarak 20 titik data (terpisah sekitar 36 derajat).
- o,FFC0CB,1,20,20,0
- o,FFC0CB,1,40,20,0
- ...
- o,FFC0CB,1,200,20,0
- B,3D5593,1,0,0 - Isi biru tua untuk mata pusat

Oleh: charts4j.com

Kurva Lissajous, oleh http://code.google.com/p/charts4j

Kurva Lissajous (Diagram garis)

Kebanyakan orang pernah melihat kurva Lissajous pada osiloskop.

Ini adalah diagram garis lxy yang menggunakan pendekatan brute-force untuk memetakan setiap titik dalam kurva, titik demi titik. Contoh ini menjelaskan koordinat x dan y dari 800 titik individual menggunakan format encoding diperluas.

Oleh: charts4j.com

Diagram Batang Vertikal

Diagram ini mengetahui dampak hari istirahat terhadap statistik berbasis kepemilikan di NBA. Tabel ini menunjukkan perbedaan rata-rata liga NBA jika tim bermain dengan hari istirahat tertentu.

Oleh: NBAStuffer.com