Diagram Lingkaran

   

Dokumen ini menjelaskan cara membuat diagram lingkaran menggunakan Chart API.

Daftar Isi

Fitur Khusus Diagram

  1. Ringkasan
  2. Jenis Diagram (cht)
  3. Warna Seri (chco)
  4. Label Diagram Lingkaran (chl)
  5. Rotasi Diagram Lingkaran (chp)

Fitur Standar

  1. Judul Diagram (chtt, chts)
  2. Teks dan Gaya Legenda Diagram (chdl, chdlp, chdls)
  3. Margin Diagram (chma)
  4. Isi Latar Belakang (chf)
    1. Solid Fills (chf)
    2. Isi Gradien (chf)
    3. Isi Bergaris (chf)
  5. Fungsi data (chfd)

Ringkasan

{i>Pie chart<i} adalah cara yang baik untuk menunjukkan informasi bagian keseluruhan yang proporsional. Anda dapat membuat diagram lingkaran seri tunggal, yang setiap deretnya terdiri dari beberapa irisan, atau diagram konsentris multi-seri.

Setiap deret menjelaskan satu lingkaran, dan setiap nilai data menentukan satu irisan. Saat menggunakan diagram lingkaran bertingkat (dijelaskan di bawah), gunakan beberapa deret.

Untuk menampilkan teks yang terkait dengan slice, Anda harus menggunakan label diagram lingkaran atau legenda diagram. Label diagram lingkaran adalah teks di sekitar diagram dengan garis yang mengarah ke irisan. Legenda adalah teks yang terkait dengan warna.

Label Legenda Label dan Legenda

chl=January|February|March|April
chdl=January|February|March|April
chl=January|February|March|April
chdl=30&deg;|40&deg;|50&deg;|60&deg;

Nilai ditampilkan secara relatif satu sama lain: sehingga diagram dengan nilai 1,2,3 akan terlihat sama seperti diagram dengan nilai 100.200.300. Namun, saat menggunakan data format teks, nilai yang lebih besar dari 100 akan dipangkas menjadi 100, sehingga Anda harus menggunakan format teks dengan penskalaan kustom untuk menampilkan irisan yang lebih besar dari 100 dengan benar (gunakan parameter chds dengan nilai min/maks chds=0,<max-slice-size>).

Nilai negatif ditampilkan sebagai irisan kosong dengan ukuran yang sesuai.

Jenis Diagram

Ada tiga jenis umum diagram lingkaran yang dapat Anda buat: datar, konsentris, atau 3D. Tentukan diagram lingkaran dengan sintaks berikut:

Sintaksis

cht=<chart_type>

Dengan <chart_type> adalah salah satu dari jenis berikut:

Parameter Deskripsi Contoh

p

Bagan pai dua dimensi.

Sediakan satu deret data saja; deret data berikutnya diabaikan.

Secara default, warna segmen lingkaran diinterpolasi dari oranye tua ke kuning pucat. Tentukan warna lain seperti yang dijelaskan dalam Warna Seri.

Tentukan label dengan chl seperti yang dijelaskan dalam Label diagram lingkaran.

Google Chart API menghitung radius lingkaran dari lebar dan tinggi minimum yang ditentukan dalam parameter ukuran diagram (chs). Jika Anda menyertakan label, Anda mungkin perlu menentukan ukuran lebar menjadi dua kali ukuran tinggi, untuk memastikan label terlihat sepenuhnya.

Diagram lingkaran dua dimensi dengan empat segmen di mana warna segmen diinterpolasi dari gelap ke oranye pucat

cht=p
chs=200x100

p3

Bagan pai tiga dimensi.

Tentukan data dan pemformatan dengan cara yang sama seperti untuk diagram lingkaran dua dimensi, di atas.

Jika Anda menyertakan label dalam diagram lingkaran tiga dimensi, Anda mungkin perlu menentukan ukuran lebar menjadi 2,5 kali ukuran tinggi, untuk memastikan bahwa label Anda terlihat sepenuhnya.

Diagram lingkaran tiga dimensi dengan empat segmen di mana warna segmen diinterpolasi dari gelap ke oranye pucat

cht=p3
chs=250x100

pc

Diagram lingkaran konsentris.

Sediakan dua deret data atau lebih.

Dua diagram lingkaran konsentris dengan masing-masing empat segmen, di mana warna segmen diinterpolasi dari gelap ke oranye pucat

cht=pc
chd=s:Helo,Wrld
Semua jenis Angka negatif dalam data menyebabkan irisan "kosong". Dua diagram lingkaran konsentris dengan masing-masing empat segmen, di mana warna segmen diinterpolasi dari gelap ke oranye pucat
cht=pc
chd=t:
10,-10,10,-10|
5,-5,5,-5,5,-5,5,-5,5,-5

 

Warna Seri chco

Anda dapat menentukan warna semua nilai, setiap nilai, atau beberapa nilai menggunakan parameter chco.

Sintaksis

chco=<slice_1>|<slice_2>|<slice_n>,<series_color_1>,...,<series_color_n>
<color>
Mengiris warna dalam format heksadesimal RRGGBB. Menentukan warna deret tunggal dan semua irisan dalam deret tersebut akan diberi warna dalam gradasi warna tersebut dari paling gelap (anggota data pertama) ke paling terang (anggota data terakhir). Tentukan dua atau beberapa warna yang dipisahkan oleh | untuk mendeskripsikan setiap warna irisan. Jika memiliki beberapa deret (yaitu, diagram dengan cincin konsentris), Anda dapat menentukan nilai untuk deret yang berbeda dengan memisahkan nilai dengan koma. Jika warna irisan/seri yang diberikan lebih sedikit daripada irisan/seri yang ditampilkan, diagram akan berganti dari awal daftar irisan untuk deret tersebut, atau daftar deret untuk diagram. Anda tidak dapat menentukan gradien yang berbeda untuk setiap deret dalam diagram multi-seri.
Deskripsi Contoh

Tentukan satu warna agar memiliki gradasi dari paling gelap (irisan pertama) hingga paling terang (irisan terakhir).

Diagram lingkaran tiga dimensi dengan segmen interpolasi dari gelap ke biru pucat

chco=0000FF
Mendefinisikan gradien; di sini, dari kuning ke merah. Rentangnya dari kuning ke merah.
chd=t:10,20,30,40,50
chco=FFFF10,FF0000
Menentukan warna irisan individual; tentukan satu warna per irisan. Satu irisan per warna.
chd=t:10,20,30
chco=FF0000|00FF00|0000FF
Diagram ini memiliki dua deret data, tetapi menentukan warna sebagai gradien tunggal di semua irisan dari kuning ke merah (BBBB00—BB0000). Dua diagram lingkaran konsentris dengan masing-masing empat segmen, di mana warna segmen diinterpolasi dari gelap ke oranye pucat
chco=BBBB00,BB0000

Berikut adalah diagram konsentris yang menyertakan warna seri dan warna irisan individual. Diagram ini memiliki dua deret data konsentris. Dalam bentuk yang dapat dibaca manusia, warnanya adalah chco=hijau|merah,biru|kuning. Koma membagi ini menjadi dua rangkaian:

  • hijau|merah - Irisan hijau dan merah bergantian.
  • biru|kuning - Irisan biru dan kuning bergantian.
 Dua diagram lingkaran konsentris dengan masing-masing empat segmen, di mana warna segmen diinterpolasi dari gelap ke oranye pucat
chd=s:eYY,ORVM
chco=008800|880000,000088|888800

Kembali ke atas

Label Diagram Lingkaran chl

Anda dapat menentukan label untuk setiap irisan diagram lingkaran menggunakan parameter chl. Anda juga dapat menampilkan legenda dengan nilai yang sama atau berbeda, satu entri legenda per irisan.

Catatan tentang Nilai String: Hanya karakter aman untuk URL yang diizinkan dalam string label. Agar aman, Anda harus mengenkode URL apa pun string yang berisi karakter yang bukan dalam himpunan karakter 0-9a-zA-Z. Anda dapat menemukan encoder URL di sini.

Sintaksis

chl=
  <label_value>|
    ...
  <label_value>
<label_value>
Nilai string yang akan diterapkan ke irisan. Label diterapkan secara berurutan ke titik data pada chd. Jika Anda memiliki beberapa deret (misalnya, untuk diagram lingkaran konsentris), label diterapkan ke semua titik dalam semua urutan, dalam urutan yang ditentukan dalam chd. Gunakan pembatas pipa ( | ) di antara setiap label. Tentukan nilai intervensi yang tidak ada menggunakan dua karakter pipa berurutan tanpa spasi di antara keduanya: || . Anda tidak perlu memberi label pada semua irisan.

 

Contoh

Deskripsi Contoh

Label untuk diagram lingkaran tiga dimensi.

Diagram lingkaran tiga dimensi dengan label Mei, Juni, Juli, Agustus, September, dan Oktober untuk setiap segmen

chl=May|Jun|Jul|Aug|Sep|Oct
chs=220x100

Saat menentukan ukuran diagram dengan chs, pertimbangkan jumlah ruang yang diperlukan label Anda.

Umumnya, lebar diagram lingkaran dua dimensi harus sekitar dua kali lebih lebar dari tingginya, dan diagram lingkaran tiga dimensi harus sekitar dua setengah kali lebih lebar daripada tingginya, agar dapat menampilkan label dengan benar.

Dalam contoh pertama, label hanya ditampilkan sebagian, karena diagram tidak cukup lebar.

Contoh kedua menunjukkan bahwa diagram membutuhkan lebar 280 piksel untuk menampilkan label secara penuh. (Batas ditambahkan secara eksplisit ke elemen <img>.)

Diagram lingkaran tiga dimensi dengan label Mei, Juni, Juli, Agustus, September, dan Oktober untuk setiap segmen

chl=May|June|July|August|
September|October
chs=220x100

Diagram lingkaran tiga dimensi dengan label Mei, Juni, Juli, Agustus, September, dan Oktober untuk setiap segmenchl=May|June|July|August|
September|October
chs=280x100

Kembali ke atas

Rotasi Diagram Lingkaran chp

Secara default, deret pertama digambar mulai pukul 3.00, yang melanjutkan searah jarum jam di sekitar diagram, tetapi Anda dapat menentukan rotasi kustom menggunakan parameter chp.

Sintaksis

chp=<radians>
<radians>
Nilai floating point yang menjelaskan jumlah radian untuk memutar diagram searah jarum jam. Satu putaran penuh adalah 2π (2 pi—sekitar 6,28) radian.

Contoh

Deskripsi Contoh

Untuk mengubah orientasi diagram lingkaran, gunakan chp=<angle_in_radians>

Diagram lingkaran dengan dua segmen

chd=t:20,80

Diagram lingkaran dengan dua segmen, diputar sebesar 0,628

chd=t:80,20
chp=0.628
Berikut adalah contoh lain dari rotasi diagram pai. Penanda ini dapat digabungkan dengan penanda bentuk diagram untuk membuat beberapa efek menarik. Diagram lingkaran dengan dua segmen, diputar sebesar 0,628

 

Kembali ke atas

Fitur Standar

Fitur lainnya di halaman ini adalah fitur diagram standar.

Judul Diagram chtt, chts [Semua diagram]

Anda dapat menentukan teks judul, warna, dan ukuran {i>font<i} untuk bagan Anda.

Sintaksis

chtt=<chart_title>
chts=<color>,<font_size>,<opt_alignment>

 

chtt - Menentukan judul diagram.

<chart_title>
Judul yang ditampilkan untuk diagram. Anda tidak dapat menentukan tempat munculnya, tetapi Anda dapat secara opsional menentukan ukuran dan warna font. Gunakan tanda + untuk menunjukkan spasi, dan karakter pipa ( | ) untuk menunjukkan jeda baris.

 

chts [Opsional] - Warna dan ukuran font untuk parameter chtt.

<color>
Warna judul, dalam format heksadesimal RRGGBB. Warna defaultnya adalah hitam.
<font_size>
Ukuran font judul, dalam poin.
<opt_alignment>
[Opsional] Perataan judul. Pilih salah satu nilai string yang peka huruf besar/kecil berikut: "l" (kiri), "c" (tengah), "r" (kanan). Defaultnya adalah "c".

 

Contoh

Deskripsi Contoh

Bagan dengan judul, menggunakan warna dan ukuran {i>font<i} {i>default<i}.

Tentukan spasi dengan tanda plus (+).

Gunakan karakter pipa (|) untuk memaksa jeda baris.

chts tidak ditetapkan di sini.

 Diagram batang vertikal dengan judul
chtt=Site+visitors+by+month|
January+to+July

Diagram dengan judul 20 poin berwarna biru, rata kanan.

 Diagram batang vertikal dengan judul, 20 piksel, biru
chtt=Site+visitors
chts=FF0000,20,r

Kembali ke atas

Teks dan Gaya Legenda Diagram chdl, chdlp, chdls [Semua diagram]

Legenda adalah bagian sisi diagram yang memberikan deskripsi teks kecil dari setiap seri. Anda dapat menentukan teks yang terkait dengan masing-masing seri dalam legenda ini, dan menentukan letak teks tersebut pada diagram.

Lihat juga chma, untuk mempelajari cara mengatur margin di sekitar legenda.

Catatan tentang nilai string: Hanya karakter aman untuk URL yang diizinkan dalam string label. Agar aman, Anda harus mengenkode URL apa pun string yang berisi karakter yang bukan dalam himpunan karakter 0-9a-zA-Z. Anda dapat menemukan encoder URL di Dokumentasi Visualisasi Google.

Sintaksis

chdl=<data_series_1_label>|...|<data_series_n_label>
chdlp=<opt_position>|<opt_label_order>
chdls=<color>,<size>

 

chdl - Teks untuk setiap deret, yang akan ditampilkan dalam legenda.

<data_series_label>
Teks untuk entri legenda. Setiap label berlaku untuk deret yang sesuai dalam array chd. Gunakan tanda + untuk ruang. Jika Anda tidak menentukan parameter ini, diagram tidak akan mendapatkan legenda. Jeda baris tidak dapat ditentukan dalam label. Keterangan biasanya akan diperluas untuk menampung teks legenda, dan area diagram akan menyusut untuk mengakomodasi legenda.

chdlp - [Opsional] Posisi legenda, dan urutan entri legenda. Anda dapat menentukan <position> dan/atau <label_order>. Jika Anda menentukan keduanya, pisahkan dengan karakter batang. Anda dapat menambahkan 's' ke nilai mana pun jika ingin entri legenda kosong dalam chdl dilewati dalam legenda. Contoh: chdlp=bv, chdlp=r, chdlp=bv|r, chdlp=bvs|r

<opt_position>
[Opsional] Menentukan posisi legenda pada diagram. Untuk menentukan padding tambahan antara legenda dan area diagram atau batas gambar, gunakan parameter chma. Pilih salah satu nilai berikut:
  • b - Legenda di bagian bawah diagram, entri legenda di baris horizontal.
  • bv - Legenda di bagian bawah diagram, entri legenda di kolom vertikal.
  • t - Legenda di bagian atas diagram, entri legenda di baris horizontal.
  • tv - Legenda di bagian atas diagram, entri legenda di kolom vertikal.
  • r - [Default] Legenda di sebelah kanan diagram, entri legenda di kolom vertikal.
  • l - Legenda di sebelah kiri diagram, entri legenda di kolom vertikal.
<opt_label_order>
[Opsional] Urutan label yang ditampilkan dalam legenda. Pilih salah satu nilai berikut:
  • l - [Default untuk legenda vertikal] Menampilkan label dalam urutan yang diberikan ke chdl.
  • r - Menampilkan label dalam urutan terbalik seperti yang diberikan kepada chdl. Hal ini berguna dalam diagram batang bertumpuk untuk menampilkan legenda
    dalam urutan yang sama dengan batang yang muncul.
  • a - [Default untuk legenda horizontal] Pengurutan otomatis: kira-kira berarti mengurutkan berdasarkan panjang, terpendek dulu, seperti yang diukur dalam blok 10 piksel. Jika dua elemen memiliki panjang yang sama (dibagi menjadi 10 blok piksel), elemen yang tercantum pertama akan muncul terlebih dahulu.
  • 0,1,2... - Urutan label khusus. Ini adalah daftar indeks label berbasis nol dari chdl yang dipisahkan dengan koma.

chdls - [Opsional] Menentukan warna dan ukuran font teks legenda.

<color>
Warna teks legenda, dalam format heksadesimal RRGGBB.
<size>
Ukuran titik teks legenda.

 

Contoh

Deskripsi Contoh

Dua contoh legenda. Tentukan teks legenda dalam urutan yang sama seperti rangkaian data Anda.

Diagram garis merah, biru, dan hijau dengan legenda yang cocok

chdl=NASDAQ|FTSE100|DOW
chco=FF0000,00FF00,0000FF

Diagram Venn dengan dua lingkaran lebih kecil yang diapit oleh lingkaran yang lebih besar


chdl=First|Second|Third
chco=ff0000,00ff00,0000ff

Diagram pertama menunjukkan entri legenda horizontal (chdlp=t, tata letak default adalah horizontal), dan diagram kedua menunjukkan entri legenda vertikal bawah (chdlp=bv).

Diagram Venn dengan dua lingkaran lebih kecil yang diapit oleh lingkaran yang lebih besar
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=t

Diagram Venn dengan dua lingkaran lebih kecil yang diapit oleh lingkaran yang lebih besar
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=bv
Contoh ini menunjukkan perubahan ukuran font.

Diagram Venn dengan dua lingkaran lebih kecil yang diapit oleh lingkaran yang lebih besar
chdls=0000CC,14

Kembali ke atas

Margin Diagram chma [Semua diagram]

Anda dapat menentukan ukuran margin diagram, dalam piksel. Margin dihitung ke dalam dari ukuran diagram yang ditentukan (chs); menambah ukuran margin tidak akan memperbesar total ukuran diagram, tetapi akan mengurangi area diagram, jika perlu.

Margin secara {i>default<i} adalah apa pun yang tersisa setelah ukuran diagram dihitung. Nilai default ini bervariasi menurut jenis diagram. Margin yang Anda tentukan adalah nilai minimum; jika area diagram memberikan ruang untuk margin, ukuran margin akan menjadi apa pun yang tersisa; Anda tidak dapat menekan margin lebih kecil dari yang diperlukan untuk legenda dan label. Berikut adalah diagram yang menunjukkan bagian dasar diagram:

Margin diagram, area legenda, dan area diagram

Margin diagram mencakup label sumbu dan area legenda. Area legenda akan diubah ukurannya secara otomatis agar pas dengan teks, kecuali jika Anda menentukan lebar yang lebih besar menggunakan chma, dalam hal ini, ukuran margin akan diperluas secara lebih lebar, sehingga area diagram menjadi lebih kecil. Anda tidak dapat memangkas legenda dengan menentukan ukuran yang terlalu kecil, tetapi Anda dapat membuatnya memakan lebih banyak ruang daripada yang dibutuhkan.

Tips: Di diagram batang, jika batang tersebut memiliki ukuran tetap (default), lebar area diagram tidak dapat dikurangi. Anda harus menentukan ukuran batang yang lebih kecil atau dapat diubah ukurannya menggunakan chbh.

 

Sintaksis

chma=
  <left_margin>,<right_margin>,<top_margin>,<bottom_margin>|<opt_legend_width>,<opt_legend_height>
<left_margin>, <right_margin>, <top_margin>, <bottom_margin>
Ukuran margin minimum di sekitar area diagram, dalam piksel. Tingkatkan nilai ini untuk menyertakan beberapa padding agar label sumbu tidak menabrak batas diagram.
<opt_legend_width>, <opt_legend_height>
[Opsional] Lebar margin di sekitar legenda, dalam piksel. Gunakan cara ini agar legenda tidak menempel di area diagram atau tepi gambar.

 

Contoh

Deskripsi Contoh

Dalam contoh ini, diagram memiliki margin minimum 30 piksel di setiap sisi. Karena lebar legenda diagram lebih dari 30 piksel, margin di sisi kanan ditetapkan sesuai lebar legenda diagram, dan berbeda dengan margin lainnya.

Label sumbu berada di luar area plot, sehingga digambar di dalam ruang margin.

Diagram garis dengan latar belakang abu-abu dan margin di setiap sisi.
chma=30,30,30,30

Untuk menambahkan margin di sekitar legenda, tetapkan nilai untuk parameter <opt_legend_width> dan <opt_legend_height>.

Dalam contoh ini, lebar legenda adalah sekitar 60 piksel. Jika Anda menetapkan <opt_legend_width> ke 80 piksel, margin akan diperluas hingga 20 piksel di luar legenda.

Diagram garis dengan latar belakang abu-abu dan margin di setiap sisi.
chma=20,20,20,30|80,20

Kembali ke atas

Gaya dan Label Sumbu [Garis, Batang, Pengukuran Google, Radar, Sebar]

Anda dapat menentukan sumbu yang akan ditampilkan pada diagram, dan memberinya label serta posisi, rentang, dan gaya khusus.

Tidak semua diagram menampilkan garis sumbu secara default. Anda dapat menentukan dengan tepat sumbu mana yang harus ditampilkan di diagram Anda menggunakan parameter chxt. Garis sumbu default tidak menampilkan angka; Anda harus menentukan sumbu di parameter chxt untuk menampilkan angka.

Anda dapat memilih agar sumbu menampilkan angka yang mencerminkan nilai data, atau menentukan sumbu kustom. Defaultnya adalah menampilkan nilai numerik, dengan nilai yang diskalakan ke rentang 0—100. Namun, Anda dapat mengubah rentang tersebut menggunakan chxr untuk menampilkan rentang apa pun, dan dapat menata gaya nilai (misalnya, untuk menampilkan simbol mata uang atau tempat desimal) menggunakan chxs.

Jika memilih untuk menggunakan nilai kustom, misalnya: "Sen, Sel, Rab", Anda dapat menggunakan parameter chxl. Untuk menempatkan label ini di lokasi tertentu di sepanjang sumbu, gunakan parameter chxp.

Terakhir, Anda dapat menggunakan parameter chxs dan chxtc untuk menentukan warna, ukuran, perataan, dan properti lainnya dari label sumbu kustom dan numerik.

Catatan tentang nilai string: Hanya karakter aman untuk URL yang diizinkan dalam string label. Agar aman, Anda harus mengenkode URL apa pun string yang berisi karakter yang bukan dalam himpunan karakter 0-9a-zA-Z. Anda dapat menemukan encoder URL di Dokumentasi Visualisasi Google.

Bagian ini membahas topik berikut:

Sumbu yang Terlihat chxt

Diagram batang, garis, radar, dan sebar menampilkan satu atau dua garis sumbu secara default, tetapi garis ini tidak menyertakan nilai. Untuk menampilkan nilai pada garis sumbu, atau untuk mengubah sumbu yang ditampilkan, Anda harus menggunakan parameter chxt. Secara default, nilai sumbu berkisar dari 0-100, kecuali jika Anda menskalakannya secara eksplisit menggunakan properti chxr. Untuk menyembunyikan semua garis sumbu dalam diagram garis, tentukan :nda setelah nilai jenis diagram dalam parameter cht (contoh: cht=lc:nda).

Secara default, sumbu atas dan bawah tidak menampilkan tanda centang pada nilai, sedangkan sumbu kiri dan kanan menunjukkannya. Anda dapat mengubah perilaku ini menggunakan parameter chxs.

Sintaksis

chxt=
  <axis_1>
    ,...,
  <axis_n>
<axis>
Sumbu yang akan ditampilkan pada diagram. Sumbu yang tersedia adalah:
  • x - Sumbu x bawah
  • t - Sumbu x atas [Tidak didukung oleh Google-o-Meter]
  • y - Sumbu y di sebelah kiri
  • r - Sumbu y di kanan [Tidak didukung oleh Google-o-Meter]

Anda dapat menentukan beberapa sumbu dari jenis yang sama, misalnya: cht=x,x,y. Tindakan ini akan menumpuk dua kumpulan sumbu x di sepanjang bagian bawah diagram. Hal ini berguna saat menambahkan label khusus di sepanjang sumbu yang menunjukkan nilai numerik (lihat contoh di bawah). Sumbu digambar dari bagian dalam ke luar, jadi jika Anda memiliki x,x, x pertama merujuk pada salinan terdalam, x berikutnya mengacu pada salinan keluar berikutnya, dan seterusnya.

 

Contoh

Deskripsi Contoh

Contoh ini menunjukkan diagram garis dengan sumbu x, sumbu y, sumbu atas (t), dan sumbu kanan (r).

Karena tidak ada label yang ditentukan, diagram ditetapkan secara default ke rentang 0 hingga 100 untuk semua sumbu.

Perhatikan bahwa secara default, sumbu atas dan bawah tidak menampilkan tanda centang pada label.

Diagram garis dengan label: 0, 20, 40, 60, 80, dan 100 di sebelah kiri dan kanan dan label: 0, 25, 50, 75, dan 100 di atas dan di bawah
chxt=x,y,r,t
Anda dapat menyertakan beberapa kumpulan label untuk setiap sumbu dengan menyertakan nilai yang sama lebih dari sekali. Contoh ini menunjukkan dua kumpulan sumbu x dan dua kumpulan sumbu y. Hal ini tidak terlalu berguna jika hanya menggunakan label sumbu default, seperti yang ditampilkan di sini. Namun, Anda dapat menentukan label khusus untuk setiap salinan dari setiap sumbu, menggunakan parameter chxl.

<img <code="" dir="ltr" src="/static/chart/image/images/chart_41.png" title="chxt=x,x,y,y&cht=lc&chd=s:cEAELFJHHHKUju9uuXUc&chco=76A4FB&chls=2.0&chs=200x125"

<img <code="" dir="ltr" src="/static/chart/image/images/chart_42.png" title="chxt=x,x,y,y&cht=lc&chd=s:cEAELFJHHHKUju9uuXUc&chco=76A4FB&chls=2.0&chs=200x125 %200x125


Contoh ini menampilkan diagram batang horizontal dengan sumbu x, sumbu y, sumbu t atas, dan sumbu r kanan.

Label sumbu dihilangkan, sehingga Chart API menampilkan rentang 0 hingga 100 untuk sumbu x dan untuk sumbu t.

Rentang sumbu y dan sumbu r ditentukan oleh jumlah batang. Dalam hal ini, ada lima batang, sehingga Chart API menampilkan rentang 0 hingga 4. Label pertama berada di dasar batang pertama, label kedua berada di tengah-tengah batang kedua, dan seterusnya.

Diagram garis dengan label: 0, 20, 40, 60, 80, dan 100 di sebelah kiri dan kanan dan label: 0, 25, 50, 75, dan 100 di atas dan di bawah
chxt=x,y,r,t
Anda dapat menyembunyikan sumbu default dalam diagram garis dengan menentukan :nda setelah jenis diagram. Diagram garis dengan sumbu tersembunyi
cht=lc:nda

Kembali ke atas

Rentang Sumbu chxr

Anda dapat menentukan rentang nilai yang muncul di setiap sumbu secara terpisah, menggunakan parameter chxr. Perhatikan bahwa tindakan ini tidak mengubah skala elemen diagram, hanya mengubah skala label sumbu. Jika Anda ingin membuat angka sumbu mendeskripsikan nilai data sebenarnya, tetapkan <start_val> dan <end_val> ke nilai bawah dan atas dari rentang format data Anda. Lihat Penskalaan Sumbu untuk informasi selengkapnya.

Anda harus membuat sumbu terlihat menggunakan parameter chxt jika ingin menentukan rentangnya.

Untuk menentukan nilai sumbu kustom, gunakan parameter chxl.

Sintaksis

Pisahkan beberapa rentang label sumbu menggunakan karakter pipa ( | ).

chxr=
  <axis_index>,<start_val>,<end_val>,<opt_step>
    |...|
  <axis_index>,<start_val>,<end_val>,<opt_step>
<axis_index>
Sumbu mana yang akan diberi label. Ini adalah indeks berbasis nol ke array sumbu yang ditentukan oleh chxt. Misalnya, sumbu r adalah 1 di chxt=x,r,y.
<start_val>
Angka, yang menentukan nilai rendah untuk sumbu ini.
<end_val>
Angka, yang menentukan nilai tinggi untuk sumbu ini.
<opt_step>
[Opsional] Langkah penghitungan di antara titik skala pada sumbu. Tidak ada nilai langkah default; langkah ini dihitung untuk mencoba menampilkan serangkaian label yang diberi jarak dengan baik.

 

Contoh

Deskripsi Contoh

Contoh ini menunjukkan sumbu y kiri dan kanan (y dan r) serta satu sumbu x (x).

Setiap sumbu memiliki rentang yang ditentukan. Karena tidak ada label atau posisi yang ditentukan, nilai-nilai akan diambil dari rentang yang ditentukan, dan diberi jarak yang sama dalam rentang tersebut. Pada diagram garis, nilai tersebar secara merata di sepanjang sumbu x.

Arah sumbu dibalik untuk sumbu r (indeks 2), karena nilai pertama (1000) lebih besar dari nilai terakhir (0).


chxt=x,y,r
chxr=
  0,0,500|
  1,0,200|
  2,1000,0

Dalam contoh ini, nilai ditentukan untuk sumbu x.

Label sumbu berjarak merata di sepanjang sumbu. Nilai lima (5) ditentukan untuk parameter <opt_step>.

Diagram batang dengan 200, 300, dan 400 pada sumbu x chxt=x
chxr=0,10,50,5

Kembali ke atas

Label Sumbu Kustom chxl

Anda dapat menentukan label sumbu string kustom pada sumbu apa pun, menggunakan parameter chxl. Anda dapat menentukan label sebanyak yang Anda inginkan. Jika Anda menampilkan sumbu (menggunakan parameter chxt) dan tidak menentukan label khusus, label numerik standar akan diterapkan. Untuk menentukan rentang numerik khusus, gunakan parameter chxr.

Untuk menetapkan lokasi tertentu di sepanjang sumbu untuk label Anda, gunakan parameter chxp.

Sintaksis

Tentukan satu set parameter untuk setiap sumbu yang ingin Anda beri label. Pisahkan beberapa kumpulan label menggunakan karakter pipa (|).

chxl=
  <axis_index>:|<label_1>|...|<label_n>
    |...|
  <axis_index>:|<label_1>|...|<label_n>
<axis_index>
Sumbu mana yang menjadi tempat penerapan label. Ini adalah indeks ke array parameter chxt. Misalnya, jika Anda memiliki chxt=x,x,y,y, maka indeks 0 akan menjadi sumbu x pertama, 1 akan menjadi sumbu x kedua.
<label_1>| ... |<label_n>
Satu atau beberapa label untuk ditempatkan di sepanjang sumbu ini. Ini dapat berupa nilai string atau angka; string tidak perlu dalam tanda kutip. label_1 ditampilkan di posisi terendah pada sumbu, dan label_n ditampilkan di posisi tertinggi. Label tambahan ditempatkan secara merata di antara label-label tersebut. Tunjukkan spasi dengan tanda +. Jeda baris tidak dapat ditentukan dalam label. Pisahkan label dengan karakter pipa. Catatan: Jangan menempatkan pipe setelah label akhir dalam parameter chxl.

 

Contoh

Deskripsi Contoh

Diagram ini menunjukkan cara menambahkan label khusus ke dua sumbu. Perhatikan bagaimana nilai-nilai ditempatkan secara merata, dan bagaimana nilai chxl terakhir tidak diakhiri dengan pipa.

 Grafik garis dengan 0 dan 100 di sebelah kiri, A, B, dan C di sebelah kanan, Jan,Juli, Jan, Juli, dan Jan pada sumbu x dan 2005, 2006 dan 2007 di bawah ini.
chxt=x,y
chxl=
0:|Jan|Feb|March|April|May|
1:|Min|Mid|Max

Contoh ini mencakup label sumbu di sumbu y kiri dan kanan (y dan r). Contoh ini juga mencakup dua kumpulan nilai untuk sumbu x (x). Anda dapat mempertimbangkan untuk menambahkan tanda centang pada sumbu y menggunakan chxs.

Grafik garis dengan 0 dan 100 di sebelah kiri, A, B, dan C di sebelah kanan, Jan,Juli, Jan, Juli, dan Jan pada sumbu x dan 2005, 2006 dan 2007 di bawah ini.
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
1:|0|50|100|
2:|A|B|C|
3:|2005|2006|2007

Contoh ini mencakup label sumbu di sumbu y kiri dan kanan (y dan r). Contoh ini juga mencakup dua kumpulan nilai untuk sumbu x (x). Perhatikan label kosong untuk kumpulan sumbu x bawah, yang digunakan untuk memberi jarak antar nilai.

Contoh ini menggunakan nilai default untuk label sumbu di sumbu y kiri.

Diagram batang dengan 0 dan 100 di sebelah kiri, A, B, dan C di sebelah kanan, Jan, Juli,Jan, Juli, dan Jan pada sumbu x dan 2005, 2006 dan 2007 di bawah ini.
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
2:|A|B|C|
3:|2005||2006||2007

Jika Anda ingin menambahkan label umum untuk mendeskripsikan seluruh sumbu (misalnya, untuk memberi label pada satu sumbu "biaya" dan lainnya sebagai "siswa"), gunakan properti chxt untuk menambahkan sumbu tambahan di setiap sisi, lalu gunakan chxl untuk menambahkan satu label kustom ke setiap sisi, dan chxp untuk memberinya spasi di tengah sumbu.
chxt=x,x,y,y
chxl=1:|Martinis|3:|Score
chxp=1,50|3,50

Kembali ke atas

Posisi Label Sumbu chxp

Anda dapat menentukan label sumbu yang akan ditampilkan, baik menggunakan label default maupun label khusus yang ditentukan menggunakan chxl. Jika Anda tidak menetapkan posisi pasti menggunakan parameter ini, label akan diberi jarak secara merata dan pada nilai langkah default di sepanjang sumbu. Jika Anda tidak menentukan chxl, label tanda centang akan menjadi nilai default (biasanya nilai data, atau nomor batang dalam diagram batang).

Sintaksis

Pisahkan beberapa set pemosisian menggunakan karakter pipa (|).

chxp=
  <axis_1_index>,<label_1_position>,...,<label_n_position>
    |...|
  <axis_m_index>,<label_1_position>,...,<label_n_position>
<axis_index>
Sumbu yang Anda tentukan posisinya. Ini adalah indeks ke dalam array parameter chxt. Misalnya, jika Anda memiliki chxt=x,x,y,y, indeks 0 akan menjadi sumbu x pertama, 1 akan menjadi sumbu x kedua, dan seterusnya.
<label_1_position>,...,<label_n_position>
Posisi label di sepanjang sumbu. Ini adalah daftar nilai numerik yang dipisahkan koma, dengan setiap nilai menetapkan posisi label terkait dalam array chxl: entri pertama diterapkan ke label pertama, dan seterusnya. Posisi adalah nilai dalam rentang untuk sumbu tersebut. Perhatikan bahwa nilainya akan selalu 0—100 kecuali jika Anda telah menentukan rentang kustom menggunakan chxr. Anda harus memiliki posisi sebanyak yang Anda miliki label untuk sumbu tersebut.

 

Contoh

Deskripsi Contoh

Contoh ini mencakup label sumbu r pada posisi tertentu pada diagram. Teks label ditentukan menggunakan parameter chxl.

Label dengan posisi 0 yang ditentukan ditempatkan di bagian bawah sumbu y atau r, atau di sebelah kiri sumbu x atau t.

Label dengan posisi 100 yang ditentukan ditempatkan di bagian atas sumbu y atau r, atau di sebelah kanan sumbu x atau t.

Line chart with min, average, and max on the right, 20, 40, 60, 80, and 100 on the left, and 0, 25, 50, 75, and 100 along the x-axis
chxt=x,y,r
chxl=2:|min|average|max
chxp=2,10,35,75

Contoh ini menunjukkan cara menunjukkan nilai label default, tetapi hanya di lokasi yang ditentukan.

chxp=1,10,35,75 - Sumbu y hanya boleh menampilkan tiga label: 10, 35, dan 75. Karena tidak ada teks label khusus yang ditentukan, nilai sumbu ini akan ditampilkan. Perhatikan bahwa Anda tidak perlu memisahkan label secara merata saat menggunakan chxp. Jika chxp tidak ditentukan di sini, jarak nilai label default pada sumbu y adalah setiap 20 unit, seperti yang ditunjukkan pada grafik kedua.

 Line chart with 10, 35, and 75 on the left, and 0, 25, 50, 75, and 100 along the x-axis
chxt=x,y
chxp=1,10,35,75
Diagram garis dengan posisi sumbu default.
chxt=x,y
chxp tidak ditentukan

Kembali ke atas

Gaya Label Sumbu chxs

Anda dapat menentukan ukuran, warna, dan perataan font untuk label sumbu, baik label khusus maupun nilai label default. Semua label pada sumbu yang sama memiliki format yang sama. Jika Anda memiliki beberapa salinan sumbu, Anda dapat memformat masing-masing sumbu dengan cara berbeda. Anda juga dapat menentukan format string label, misalnya untuk menampilkan simbol mata uang atau angka nol di akhir.

Secara default, sumbu atas dan bawah tidak menampilkan tanda centang pada nilai, sedangkan sumbu kiri dan kanan menunjukkannya.

Sintaksis

Nilai untuk beberapa sumbu harus dipisahkan menggunakan karakter pipa (|).

chxs=
 <axis_index><opt_format_string>,<opt_label_color>,<opt_font_size>,<opt_alignment>,<opt_axis_or_tick>,<opt_tick_color>,<opt_axis_color>
   |...|
 <axis_index><opt_format_string>,<opt_label_color>,<opt_font_size>,<opt_alignment>,<opt_axis_or_tick>,<opt_tick_color>,<opt_axis_color>
<axis_index>
Sumbu yang berlaku untuk sumbu ini. Ini adalah indeks berbasis nol ke dalam parameter chxt.
<opt_format_string>
[Opsional] Ini adalah string format opsional yang, jika digunakan, mengikuti tepat setelah nomor indeks sumbu tanpa koma intervensi. Dimulai dengan huruf literal N diikuti dengan nilai berikut, semuanya bersifat opsional: Sintaksis string pemformatannya adalah sebagai berikut:
       N<preceding_text>*<number_type><decimal_places>zs<x or y>*<following_text>
Berikut adalah arti setiap elemen:
  • <preceding_text> - Teks literal yang mendahului setiap nilai.
  • *...* - Blok opsional yang digabungkan dengan tanda bintang literal, tempat Anda dapat menentukan detail pemformatan untuk angka. Nilai-nilai berikut didukung, dan bersifat opsional:
    • <number_type> - Format angka, untuk nilai numerik. Pilih salah satu opsi berikut:
      • f - [Default] Format titik mengambang. Pertimbangkan untuk menentukan presisi juga dengan nilai <decimal_places>.
      • p - Format persentase. Tanda % ditambahkan secara otomatis. Catatan: Saat menggunakan format ini, nilai data dari 0,0 — 1,0 dipetakan ke 0 — 100% (misalnya, 0,43 akan ditampilkan sebagai 43%).
      • e - Format notasi ilmiah.
      • c<CUR> - Memformat angka dalam mata uang yang ditentukan, dengan penanda mata uang yang sesuai. Ganti <CUR> dengan kode mata uang tiga huruf. Contoh: cEUR untuk Euro. Anda dapat menemukan daftar kode di situs ISO, meskipun tidak semua simbol didukung.
    • <decimal_places> - Bilangan bulat yang menentukan berapa banyak angka desimal yang akan ditampilkan. Nilai dibulatkan (tidak terpotong) hingga sepanjang ini. Defaultnya adalah 2.
    • z - Menampilkan angka nol di akhir. Defaultnya adalah tidak.
    • s - Pemisah grup tampilan. Defaultnya adalah tidak.
    • x atau y - Menampilkan data dari koordinat x atau y, seperti yang ditentukan. Arti data x bervariasi menurut jenis diagram: bereksperimenlah dengan diagram Anda untuk menentukan artinya. Defaultnya adalah 'y'.
  • <following_text> - Teks literal untuk mengikuti setiap nilai.
<opt_label_color>
Warna yang akan diterapkan ke teks sumbu (tetapi bukan garis sumbu), dalam format heksadesimal RRGGBB. Warna garis sumbu ditentukan secara terpisah menggunakan opt_axis_color. Defaultnya adalah abu-abu.
<opt_font_size>
[Opsional] menentukan ukuran font dalam piksel. Parameter ini bersifat opsional.
<opt_alignment>
[Opsional] Perataan label. Untuk sumbu atas atau bawah, penjelasan ini menjelaskan cara label diratakan dengan tanda centang di atas atau di bawahnya; untuk sumbu kiri atau kanan, deskripsi ini menjelaskan bagaimana perataan di dalam kotak pembatasnya, yang menyentuh sumbu. Tentukan salah satu angka berikut:
  • -1 - Atas atau bawah: label berada di sebelah kanan tanda petik; Kiri atau kanan: label diratakan ke kiri dalam areanya. Default untuk label sumbu r.
  • 0 - Atas atau bawah: label dipusatkan pada titik skala; Kiri atau kanan: label dipusatkan di areanya. Default untuk label sumbu x dan t.
  • 1 - Atas atau bawah: label berada di sebelah kiri tanda petik; Kiri atau kanan: label diratakan kanan dalam areanya. Default untuk label sumbu y.
<opt_axis_or_tick>
[Opsional; tidak didukung di Google-o-meter] Apakah akan menampilkan tanda centang dan/atau garis sumbu untuk sumbu ini. Tanda centang dan garis sumbu hanya tersedia untuk sumbu terdalam (misalnya, keduanya tidak didukung untuk bagian luar dua sumbu x). Gunakan salah satu nilai berikut:
  • l ('L' dengan huruf kecil) - Gambar garis sumbu saja.
  • t - Hanya gambar tanda titik skala. Tanda centang adalah garis kecil di sebelah label sumbu.
  • lt - [Default] Gambar garis sumbu dan tanda centang untuk semua label.
  • _ - (Garis bawah) Gambar tanpa garis sumbu atau tanda centang. Jika Anda ingin menyembunyikan garis sumbu, gunakan nilai ini.
<tick_color>
[Opsional; tidak didukung dalam Google-o-meter] Warna tanda centang, dalam format heksadesimal RRGGBB. Defaultnya adalah abu-abu.
<opt_axis_color>
[Opsional] Warna garis sumbu ini, dalam format heksadesimal RRGGBB. Defaultnya adalah abu-abu.

 

Contoh

Deskripsi Contoh

Ukuran dan warna font ditentukan untuk sumbu x kedua (Jan, Feb, Mar).

Diagram garis dengan min, rata-rata, dan maks di sebelah kiri, 0, 1, 2, 3, dan 4 di sebelah kanan, 0 hingga 100 di sepanjang sumbu x dan Jan, Feb, dan Mar berwarna biru di bawah

chxt=x,y,r,x
chxr=2,0,4
chxl=3:|Jan|Feb|Mar|
     1:|min|average|max
chxp=1,10,35,75
chxs=3,0000DD,13,0,t

Ukuran, warna, dan perataan font ditentukan untuk sumbu y kanan. Tanda centang, tetapi tidak ada garis sumbu, akan digambar.

Diagram garis dengan 0 hingga 100 di sepanjang sumbu x, Jan, Feb, Mar di bawah, 0 hingga 4 pada sumbu y, dan tanda centang merah dengan teks biru untuk min, rata-rata, dan maks di sebelah kanan.

chxt=x,y,r,x
chxl=3:|Jan|Feb|Mar|
     2:|min|average|max
chxp=2,10,35,95
chxs=2,0000DD,13,-1,t,FF0000

Diagram ini mencakup tiga set data, dan menunjukkan tiga set label sumbu, satu per seri. Setiap kumpulan label diformat menggunakan string pemformatan kustom, seperti yang dijelaskan di sini:

  • 0N*e,000000|
    • 0 berarti rangkaian data pertama
    • N berarti string pemformatan
    • * berarti awal penentu format
    • e berarti notasi ilmiah
    • * berarti akhir penentu format
    • 000000 berarti teks hitam.
  • 1N*cUSD*Mil,FF0000|
    • 1 berarti seri kedua
    • N berarti string pemformatan
    • * berarti awal penentu format
    • c berarti penanda mata uang
    • USD menentukan dolar AS sebagai penanda mata uang yang akan digunakan
    • * berarti akhir penentu format
    • Mil adalah string literal berikut
    • FF0000 berarti teks merah.
  • 2N*sz2*,0000FF
    • 2 berarti seri ketiga
    • N berarti string pemformatan
    • * berarti awal penentu format
    • s berarti menampilkan penentu pengelompokan (dalam lokalitas bahasa Inggris AS, yaitu koma setiap tiga angka nol)
    • z2 berarti tampilkan dua angka nol di belakangnya
    • 0000FF berarti teks biru.

Rentang label sumbu ditetapkan menggunakan parameter chxr (axis_index, start, end, step). Jika tidak disetel, nilainya adalah 0—100 secara default.
chd=s:
  984sttvuvkQIBLKNCAIi,
  DEJPgq0uov17zwopQODS,
  AFLPTXaflptx159gsDrn
chxr=
  0,0,1000000,250000|
  1,0,60|
  2,0,5000
chxs=
  0N*e,000000|
  1N*cUSD*Mil,FF0000|
  2N*sz2*,0000FF

Kembali ke atas

Gaya Tanda Centang Sumbu chxtc

Anda dapat menentukan tanda centang panjang untuk sumbu tertentu. Biasanya ini digunakan untuk memperpanjang tanda centang di sepanjang diagram. Gunakan parameter chxs untuk mengubah warna tanda centang.

Nilai untuk beberapa sumbu harus dipisahkan menggunakan karakter pipa (|). Nilai dalam sebuah deret harus dipisahkan dengan koma.

Sintaksis

chxtc=
  <axis_index_1>,<tick_length_1>,...,<tick_length_n>
    |...|
  <axis_index_m>,<tick_length_1>,...,<tick_length_n>
<axis_index>
Sumbu yang berlaku untuk sumbu ini. Ini adalah indeks berbasis nol ke dalam parameter chxt. Pisahkan nilai untuk sumbu yang berbeda menggunakan pemisah batang.
<tick_length_1>,...,<tick_length_n>
Panjang tanda centang pada sumbu tersebut, dalam piksel. Jika satu nilai diberikan, nilai tersebut akan diterapkan ke semua nilai; jika lebih dari satu nilai yang diberikan, tanda centang sumbu akan disikluskan pada daftar nilai untuk sumbu tersebut. Nilai positif digambar di luar area diagram dan dipangkas oleh batas diagram. Nilai positif maksimum adalah 25. Nilai negatif digambar di dalam area diagram dan dipangkas oleh batas area diagram.

 

Contoh

Deskripsi Contoh

Contoh penggunaan chxtc untuk membuat tanda centang berwarna merah yang panjang. Panjang tanda centang di sini melebihi lebar area diagram, tetapi dipangkas agar pas dengan diagram.

  • chxt=x,y,r,x - Menampilkan sumbu kiri, sumbu kanan, dan dua sumbu bawah.
  • chxl=2:|min|average|max|3:|Jan|Feb|Mar - Teks label yang ditetapkan ke 'r' (sisi kanan) dan sumbu x luar.
  • chxp=2,10,35,95 - Posisi label khusus di sepanjang sumbu r (index=2) untuk ketiga label.
  • chxs=2,0000dd,13,-1,t,FF0000 - Gaya label sumbu untuk sumbu r: warna teks, ukuran teks, rata kiri, dengan tanda centang merah.
  • chxtc=1,10|2,-180 - Panjang titik skala untuk sumbu y dan r. Nilai pertama menentukan titik skala sepanjang 10 piksel, di luar sumbu. Nilai kedua menentukan titik skala sepanjang 180 piksel di dalam sumbu; angka negatif berarti titik skala masuk ke dalam sumbu, dan titik skala dipangkas agar muat di dalam diagram.

Diagram garis dengan 0 hingga 100 di sepanjang sumbu x, Jan, Feb, Mar di bawah, 0 hingga 4 pada sumbu y, dan tanda centang merah panjang dengan teks biru untuk min, rata-rata, dan maks di sebelah kanan.

chxt=x,y,r,x
chxl=
  2:|min|average|max|
  3:|Jan|Feb|Mar
chxp=2,10,35,95
chxs=
  2,0000dd,13,-1,t,FF0000
chxtc=1,10|2,-180
Diagram ini menunjukkan panjang titik skala yang berselang-seling. chxtc menentukan dua nilai panjang titik skala untuk sumbu y (5 dan 15), dan titik skala yang digambar pada diagram berselang-seling di antara kedua nilai tersebut.
chxt=x,y
chxtc=
  1,5,15

Kembali ke atas

Isi Latar Belakang chf [Semua diagram]

Anda dapat menentukan warna dan gaya isian untuk area data diagram dan/atau seluruh latar belakang diagram. Jenis isian mencakup isian padat, isian bergaris, dan gradien. Anda dapat menentukan isian yang berbeda untuk area yang berbeda (misalnya, seluruh area diagram, atau hanya area data). Isi area diagram akan menimpa isian latar belakang. Semua isian ditentukan menggunakan parameter chf, dan Anda dapat menggabungkan berbagai jenis isian (solid, garis, gradien) dalam diagram yang sama dengan memisahkan nilai menggunakan karakter pipa ( | ). Isi area diagram akan menimpa isian latar belakang diagram.

Isi Solid chf [Semua Diagram]

Anda dapat menentukan isian penuh untuk latar belakang dan/atau area diagram, atau menetapkan nilai transparansi untuk seluruh diagram. Anda dapat menentukan beberapa isian menggunakan karakter pipa (|). (Maps: hanya latar belakang).

Sintaksis

chf=<fill_type>,s,<color>|...
<fill_type>
Bagian diagram yang terisi. Tentukan salah satu nilai berikut:
  • bg - Isi latar belakang
  • c - Pengisian area diagram. Tidak didukung untuk diagram peta.
  • a - Membuat seluruh diagram (termasuk latar belakang) transparan. Enam digit pertama <color> diabaikan, dan hanya dua digit terakhir (nilai transparansi) yang diterapkan ke seluruh diagram dan semua isian.
  • b<index> - Isian batang solid (khusus diagram batang). Ganti <index> dengan indeks deret batang untuk diisi dengan warna solid. Efeknya mirip dengan menentukan chco dalam diagram batang. Lihat Warna Seri Diagram Batang sebagai contoh.
d
Menunjukkan pengisian yang solid atau transparan.
<color>
Warna isian, dalam format heksadesimal RRGGBB. Untuk transparansi, enam digit pertama akan diabaikan, tetapi tetap harus disertakan.

 

Contoh

Deskripsi Contoh

Contoh ini mengisi latar belakang diagram dengan abu-abu pucat (EFEFEF).

Diagram garis merah dengan isian area hitam.

chf=bg,s,EFEFEF

Contoh ini mengisi latar belakang diagram dengan abu-abu pucat (EFEFEF) dan mengisi area diagram dengan warna hitam (000000).

Diagram garis merah dengan area diagram hitam dan latar belakang abu-abu pucat.

chf=c,s,000000|
bg,s,EFEFEF
Contoh ini menerapkan transparansi 50% ke seluruh diagram (80 dalam heksadesimal adalah 128, atau sekitar 50% transparansi). Perhatikan latar belakang sel tabel yang ditampilkan melalui diagram.

Diagram pencar dengan titik berwarna biru, dan transparansi 50%.

chf=a,s,00000080

Kembali ke atas

Isi Gradien chf [Garis, Batang, Google-o-meter, Radar, Sebar,Venn]

Anda dapat menerapkan satu atau beberapa isi gradien ke area atau latar belakang bagan. Isi gradien memudar dari satu warna ke warna lain. (Pie, Diagram meteran Google: khusus latar belakang.)

Setiap isi gradien menentukan sudut, kemudian dua atau lebih warna yang ditambatkan ke lokasi yang ditentukan. Warnanya bervariasi saat berpindah dari satu anchor ke anchor lainnya. Anda harus memiliki setidaknya dua warna dengan nilai <color_centerpoint> yang berbeda, agar satu warna dapat memudar dan memudar dengan warna lain. Setiap gradien tambahan ditentukan oleh pasangan <color>,<color_centerpoint>.

Sintaksis

chf=<fill_type>,lg,<angle>,<color_1>,<color_centerpoint_1>
    ,...,
  <color_n>,<color_centerpoint_n>
<fill_type>
Area diagram yang akan diisi. Salah satu dari kolom berikut:
  • bg - Isi latar belakang
  • c - Pengisian area diagram.
  • b<index> - Isi gradien batang (hanya diagram batang). Ganti <index> dengan indeks deret dari batang yang akan diisi dengan gradien. Lihat Warna Seri Diagram Batang sebagai contoh.
lg
Menentukan isi gradien.
<angle>
Angka yang menentukan sudut gradien dari 0 (horizontal) hingga 90 (vertikal).
<color>
Warna isi, dalam format heksadesimal RRGGBB.
<color_centerpoint>
Menentukan titik link untuk warna. Warna akan mulai memudar dari titik ini saat mendekati anchor lain. Rentang nilainya adalah dari 0.0 (tepi bawah atau kiri) hingga 1.0 (tepi atas atau kanan), dimiringkan pada sudut yang ditentukan oleh <angle>.

 

Contoh

Deskripsi Contoh

Area diagram memiliki gradien linear horizontal, yang ditentukan dengan sudut nol derajat (0).

Warnanya peach (FFE7C6), berpusat di sisi kiri (posisi 0.0) dan biru (76A4FB) yang berpusat di sisi kanan (posisi 1.0).

Latar belakang diagram digambar dengan warna abu-abu (EFEFEF).

Diagram garis abu-abu tua dengan latar belakang abu-abu pucat dan area diagram dengan gradien linier putih ke biru dari kiri ke kanan

chf=
  c,lg,0,
  FFE7C6,0,(persik)
  76A4FB,1 (biru)

Area diagram memiliki gradien linier diagonal (kiri bawah ke kanan atas), yang ditentukan dengan sudut empat puluh lima derajat (45).

Warna persik (FFE7C6) adalah warna pertama yang ditentukan. Bagian kiri bawah diagram berwarna persik murni.

Biru (6A4FB) adalah warna kedua yang ditentukan. Bagian kanan atas diagram berwarna biru murni. Perhatikan bahwa kami menetapkan offset 0, 75 untuk memberikan puncak biru yang memudar ke arah sudut kanan atas.

Latar belakang diagram digambar dengan warna abu-abu (EFEFEF).

Diagram garis abu-abu tua dengan latar belakang abu-abu pucat dan area diagram dengan gradien linier diagonal putih ke biru dari kiri bawah ke kanan atas

chf=
  c,lg,45,
  FFE7C6,0, (persik)
  76A4FB,0.75 (biru)

Area diagram memiliki gradien linear vertikal (atas ke bawah), yang ditentukan dengan sudut sembilan puluh derajat (90).

Biru (76A4FB) adalah warna pertama yang ditentukan. Bagian atas diagram berwarna biru murni.

Persik (FFE7C6) adalah warna kedua yang ditentukan. Bagian bawah diagram berwarna persik murni.

Latar belakang diagram digambar dengan warna abu-abu (EFEFEF).

Diagram garis abu-abu tua dengan latar belakang abu-abu pucat dan area diagram dengan gradien linier vertikal putih ke biru dari bawah ke atas

chf=
  c,lg,90,
  FFE7C6,0, (persik)
  76A4FB,0.5 (biru)

Kembali ke atas

 

Isi garis-garis chf [Garis, Bar, Google-o-meter, Radar, Scatter, Venn]

Anda dapat menentukan isian latar belakang bergaris untuk area diagram, atau seluruh diagram. (Pie, Diagram meteran Google: khusus latar belakang.)

Sintaksis

chf=
  <fill_type>,ls,<angle>,<color_1>,<width_1>
    ,...,
  <color_n>,<width_n>
<fill_type>
Area diagram yang akan diisi. Salah satu dari kolom berikut:
  • bg - Isi latar belakang
  • c - Pengisian area diagram
  • b<index> - Isi bergaris batang (khusus diagram batang). Ganti <index> dengan indeks deret dari batang yang akan diisi dengan garis. Lihat Warna Seri Diagram Batang sebagai contoh.
ls
Menentukan isian garis linear.
<angle>
Sudut semua garis, relatif terhadap sumbu y. Gunakan 0 untuk garis vertikal atau 90 untuk garis horizontal.
<color>
Warna untuk garis ini, dalam format heksadesimal RRGGBB. Ulangi <color> dan <width> untuk setiap garis tambahan. Anda harus memiliki minimal dua garis. Garis bergantian hingga diagram terisi.
<width>
Lebar garis ini, dari 0 sampai 1, dengan 1 adalah lebar penuh diagram. Strip diulang hingga diagram terisi. Ulangi <color> dan <width> untuk setiap garis tambahan. Anda harus memiliki minimal dua garis. Garis bergantian hingga diagram terisi.

 

Contoh

Deskripsi Contoh
  • bg,ls,0 - Isi garis latar belakang dengan garis-garis pada sudut nol terhadap sumbu y (sejajar dengan sumbu y). Garis-garis tersebut mengisi latar belakang diagram serta area plot.
  • CCCCCC,0.15 - Garis pertama berwarna abu-abu tua, dengan lebar 15% dari diagram.
  • FFFFFF,0.1 - Garis kedua berwarna putih, dengan lebar 10% lebih lebar dari diagram.
 Diagram garis biru dengan garis abu-abu dan putih yang bergantian dari kiri ke kanan
chf=
  bg,ls,0,
  CCCCCC,0.15,
  FFFFFF,0.1
  • c,ls,90 - Area diagram dengan garis horizontal pada sudut sembilan puluh derajat dari sumbu y. Garis-garis tersebut mengisi area plot, tetapi latar belakang diagram dihilangkan.
  • 999999,0.25 - Garis pertama berwarna abu-abu tua, dengan lebar 25% dari diagram.
  • CCCCCC,0.25 - Sama seperti garis pertama, tetapi abu-abu yang lebih terang.
  • FFFFFF,0.25 - Sama seperti garis pertama, tetapi putih.
 Diagram garis biru dengan garis abu-abu tua, abu-abu pucat, putih, dan abu-abu tua dari bawah ke atas
chf=
  c,ls,90,
  999999,0.25,
  CCCCCC,0.25,
  FFFFFF,0.25

Kembali ke atas

Fungsi Data chfd [Semua chd diagram]

Anda dapat menentukan fungsi kustom untuk dijalankan pada data diagram menggunakan sintaksis fungsi muParser. Data yang digunakan dalam fungsi dapat berasal dari salah satu dari dua sumber:

  • Deret data dari chd - Data diambil dari deret yang ditentukan di chd.
  • Rentang nilai yang dideklarasikan dalam parameter chfd itu sendiri - Anda mendeklarasikan nilai awal, perhentian, dan langkah untuk rentang data arbitrer.

Penting untuk diperhatikan bahwa dalam semua kasus, Anda harus menetapkan output ke rangkaian yang ada di chd; deret tersebut akan ditimpa oleh output fungsi. Diagram hanya dirender setelah semua fungsi diproses. Jadi, jika Anda menetapkan beberapa fungsi untuk menghasilkan output pada deret data yang sama, fungsi tersebut akan dijalankan sesuai urutan yang diberikan, tetapi hanya output dari fungsi akhir yang akan dipetakan pada diagram. Perhatikan bahwa Anda dapat merangkai fungsi, sehingga satu fungsi dapat mengambil serangkaian input yang dihasilkan oleh fungsi sebelumnya sebagai input.

Untuk menetapkan warna atau penanda chm ke baris fungsi, tetapkan warna atau penanda ke indeks seri fungsi. Perhatikan bahwa penanda ditempatkan sesuai dengan data setelah dimanipulasi oleh fungsi.

Sintaksis 

chfd=
  <output_series_index>,<function_data>,<function_string>
    |...|
  <output_series_index>,<function_data>,<function_string>
<output_series_index>
Indeks berbasis nol dari deret data di chd yang akan digunakan untuk menulis output fungsi. Semua data yang ada akan ditimpa sepenuhnya oleh output fungsi. Jika deret tidak digunakan sebagai input untuk suatu fungsi, praktik terbaiknya adalah menetapkan satu nilai dummy ke deret tersebut.
<function_data>
Variabel dan data yang akan diplot. Data dapat berasal dari rentang yang Anda tentukan, atau dari salah satu deret data chd. Anda dapat menentukan beberapa variabel untuk setiap fungsi, menggunakan pemisah ; (titik koma) untuk beberapa variabel. Perhatikan bahwa jika Anda menentukan beberapa variabel untuk satu fungsi, dan variabel ini memiliki jumlah titik yang berbeda, fungsi tersebut akan berhenti ketika sudah mencapai endpoint pertama. Misalnya, jika suatu fungsi menetapkan x=1—5 langkah 1 dan y=1—10 langkah 1, fungsi tersebut akan berakhir ketika mencapai titik kelima.
    <variable_name>,<input_series_index>
         ATAU
    <variable_name>,<start>,<end>,<step>
  • variable_name - Nama string arbitrer untuk variabel. Gunakan ini dalam fungsi yang ditentukan oleh function_string.
  • input_series_index - Indeks deret data chd yang digunakan sebagai data input.
  • start - Nilai awal numerik rentang.
  • end - Nilai akhir numerik rentang.
  • langkah - Nilai langkah numerik dari awal hingga akhir. Bisa positif atau negatif, tetapi tidak boleh nol.
Contoh: x,0,100,1 mendeklarasikan variabel bernama x dengan nilai 0, 1, 2, ... 100. x,0,100,1;r,0,3.1,.1 mendeklarasikan variabel x yang sama ditambah variabel bernama r dengan nilai 0, 0.1, 0.2, ..., 3.0, 3.1. x,0 mendeklarasikan variabel bernama x yang menggunakan data dari deret chd pertama. Variabel ini akan digunakan oleh function_string. Parameter ini tidak akan digambarkan pada grafik kecuali jika Anda menentukannya dalam function_string. Semakin kecil langkah, grafik Anda akan semakin halus.
<function_string>
Fungsi Anda, yang ditulis dalam sintaksis muParser. Fungsi ini diterapkan ke variabel dan data yang ditetapkan dalam variable_data. Anda hanya dapat mereferensikan variabel yang dideklarasikan dalam kumpulan fungsi lokal ini, bukan dalam kumpulan pipe parameter chfd lainnya. Fungsi muParser ringkasan tidak didukung (min, jumlah maksimum, rata-rata). PENTING: Ingatlah untuk menggunakan %2B, bukan +, di fungsi Anda.

 

Contoh

Deskripsi Contoh

Gelombang sinus sederhana. Beberapa hal yang perlu diperhatikan:

  • chd=t:-1 - Kami menggunakan variabel tiruan untuk data diagram, karena data kami dideklarasikan dalam parameter chfd.
  • chco=FF0000 - Merah ditentukan untuk seri pertama. Meskipun kita tidak menggunakan data dari chd, warna yang sesuai untuk deret tersebut akan digunakan untuk fungsi yang diplot tersebut.
  • chfd=0,x,0,11,0.1,sin(x)*50%2B50 - Kami mendeklarasikan satu variabel, yang disebut x, dengan nilai 0—11, bertambah 0,1. Ini ditetapkan ke seri pertama, yang berarti akan mendapatkan warna seri pertama (FF0000). Fungsi yang diterapkan pada x adalah sin(x) * 50 + 50. Perhatikan bagaimana kita harus mengenkode tanda + dalam fungsi tersebut.

 

 Gelombang sinus yang ditentukan oleh chfd
cht=lc
chd=t:-1
chco=FF0000
chfd=
  0,x,0,11,0.1,sin(x)*50%2B50
chxt=x,y
Baris ini menggunakan data dari parameter chd.
chd=t:5,10
chfd=0,x,0,x*4

Campuran baris fungsi dan non-fungsi.

Perhatikan bagaimana warna ditentukan oleh parameter warna seri chco.

Perhatikan penempatan penanda pada output fungsi; titik data dihitung dari start, end, dan step, sehingga jika rentang Anda adalah 0—11 langkah 0,1, titik 0 adalah 0, titik 1 adalah 0,1 dan seterusnya, sampai titik 110 yang memiliki nilai 11.

 Satu seri menggunakan chfd, satu seri menggunakan chd untuk datanya.
chd=t:
  -1
  15,45
chco=
  FF0000,000000
chfd=
  0,x,0,11,0.1,sin(x)*50%2B50
chm=
  c,00A5C6,0,110,10
  a,00A5C6,0,60,10

Untuk menentukan fungsi dalam dua dimensi, gunakan diagram lxy, tetapkan dua deret tiruan, dan tetapkan fungsi untuk masing-masing.

  • 0,x,0,10,0.1,sin(x)*50%2B50 - Seri 0 (nilai sumbu x) memiliki variabel bernama x, dengan nilai dari 0—10, langkah 0,1, dan fungsi sin(x)*50 + 50
  • 0,y,0,10,0.1,sin(y)*50%2B50 - Seri 0 (nilai sumbu y) memiliki variabel bernama y, dengan nilai dari 0—10, langkah 0,1, dan fungsi sin(x)*50 + 50
 Lingkaran
cht=lxy
chd=t:-1|-1
chfd=
  0,x,0,10,0.1,sin(x)*50%2B50|
  1,y,0,10,0.1,cos(y)*50%2B50

Parameter chfd benar-benar dapat digunakan untuk mengekspresikan kreativitas Anda.

Coba klik gambar-gambar ini untuk membuka dan bermain-main dengannya di playground tangga lagu; Anda akan terpikat.

Kembali ke atas