Diagram Venn

   

Dokumen ini menjelaskan cara membuat diagram Venn menggunakan Chart API.

Daftar Isi

Fitur Khusus Diagram Pengantar Jenis Diagram (cht) Warna Seri (chco)

Fitur Standar Judul Diagram (chtt, chts) Teks dan Gaya Legenda Diagram (chdl, chdlp, chdls) Margin Diagram (chma) Isi Latar Belakang (chf) Solid Fills (chf) Isi Gradien (chf) Isi Bergaris (chf)

Pengantar

Diagram Venn adalah diagram dengan lingkaran yang tumpang tindih yang menunjukkan seberapa banyak kesamaan kelompok yang berbeda. Diagram mendukung diagram Venn dengan dua atau tiga lingkaran. Anda menentukan ukuran relatif lingkaran dan tingkat tumpang tindih di antara lingkaran tersebut.

Jenis Diagram (cht)

Tentukan diagram Venn dengan sintaksis berikut:

Sintaksis

cht=v

String data adalah kumpulan hingga tujuh elemen, yang dipisahkan oleh pembatas yang sesuai untuk format data Anda, seperti yang dijelaskan di sini:

• Tiga nilai pertama menentukan ukuran tiga lingkaran: A, B, dan C. Untuk diagram yang hanya terdiri dari dua lingkaran, tentukan nol untuk nilai ketiga.
• Nilai keempat menentukan ukuran irisan A dan B.
• Nilai kelima menentukan ukuran perpotongan A dan C. Untuk diagram yang hanya terdiri dari dua lingkaran, jangan tentukan nilai di sini.
• Nilai keenam menentukan ukuran perpotongan dari B dan C. Untuk diagram yang hanya terdiri dari dua lingkaran, jangan tentukan nilai di sini.
• Nilai ketujuh menentukan ukuran persimpangan umum A, B, dan C. Untuk diagram yang hanya terdiri dari dua lingkaran, jangan tentukan nilai di sini.

Perhatikan bahwa pada diagram Venn, semua nilai proporsional, tidak mutlak. Artinya, diagram dengan nilai 10,20,30 akan terlihat sama seperti diagram dengan nilai 100.200.300 (jika jenis encoding Anda menerima nilai tersebut).

Deskripsi	Contoh
Diagram Venn tiga lingkaran.	cht=v chd=t:100,80,60,30,30,30,10
Untuk menentukan diagram dua lingkaran, tentukan nol untuk lingkaran C, dan jangan tentukan nilai tumpang-tindih yang menyertakan C.	cht=v chd=t:100,100,0,50

Warna Seri chco

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

Sintaksis

chco=<color_1>,...,<color_n>

<color>

Warna seri, dalam format heksadesimal RRGGBB. Tentukan warna yang berbeda untuk rangkaian yang berbeda dengan menambahkan nilai warna yang dipisahkan oleh koma. Jika warna Anda lebih sedikit daripada seri, warna terakhir akan diulang, tetapi dalam diagram Venn, warna yang identik dapat membuat diagram sulit dibaca.

Deskripsi	Contoh
Warna yang berbeda untuk setiap lingkaran.	chco=FF6342,ADDE63,63C6DE
Jika warna yang tersedia lebih sedikit dari lingkaran, warna terakhir yang ditentukan akan diulang. Namun, hal ini membuat diagram sulit dibaca.	chco=00FF00,0000FF

Fitur Standar

Fitur lainnya di halaman ini adalah fitur diagram standar.

Format Warna

Tentukan warna menggunakan string 6 karakter nilai heksadesimal, serta dua nilai transparansi opsional, dalam format RRGGBB[AA]. Contoh:

• FF0000 = Merah
• 00FF00 = Hijau
• 0000FF = Biru
• 000000 = Hitam
• FFFFFF = Putih

AA adalah nilai transparansi opsional, dengan 00 sepenuhnya transparan dan FF benar-benar buram. Contoh:

• 0000FFFF = Biru tidak berkedip
• 0000FF66 = Biru transparan

Kembali ke atas

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.	chtt=Site+visitors+by+month| January+to+July
Diagram dengan judul 20 poin berwarna biru, rata kanan.	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.	chdl=NASDAQ|FTSE100|DOW chco=FF0000,00FF00,0000FF 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).	chdl=First|Second|Third chco=ff0000,00ff00,0000ff chdlp=t chdl=First|Second|Third chco=ff0000,00ff00,0000ff chdlp=bv
Contoh ini menunjukkan perubahan ukuran font.	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 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.	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.	chma=20,20,20,30|80,20

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).	chf=bg,s,EFEFEF
Contoh ini mengisi latar belakang diagram dengan abu-abu pucat (EFEFEF) dan mengisi area diagram dengan warna hitam (000000).	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.	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).	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).	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).	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.	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.	chf=   c,ls,90,   999999,0.25,   CCCCCC,0.25,   FFFFFF,0.25

Kembali ke atas