Halaman ini menjelaskan cara membuat peta berwarna menggunakan Charts API. Diagram ini
merupakan versi baru dan lebih baik yang mendukung peta yang lebih besar dan lebih banyak fitur daripada diagram
peta yang lebih lama (cht=t
).
Daftar Isi
Fitur Khusus Diagram |
Fitur Standar
|
Ringkasan
Anda dapat membuat peta dengan berbagai negara atau negara bagian yang ditandai dengan warna kustom. Anda dapat mengizinkan peta diperbesar ke tingkat yang tepat untuk menampilkan negara yang dipilih dengan benar, atau memperbesar atau memperkecil ke tingkat kustom menggunakan nilai garis lintang dan garis bujur.
Parameter yang Didukung
Diagram peta mendukung parameter berikut:
Parameter | Wajib atau Opsional | Deskripsi |
---|---|---|
cht=map<opt_zoom_and_center> |
Wajib | Menentukan diagram peta. opt_zoom_and_center - String opsional yang memungkinkan Anda memperbesar atau memusatkan diagram di wilayah tertentu. Lihat detailnya. |
chs |
Wajib | Ukuran peta. Dimensi maksimum untuk peta adalah lebar 600 piksel, tinggi 600 piksel, atau total 300.000 piksel. |
chd= |
Opsional | Jika digunakan, nilai data akan menunjukkan warna negara yang sesuai, di sepanjang gradien warna yang ditentukan oleh chco . |
chld= |
Wajib | Daftar negara atau negara bagian yang dipisahkan tanda pipa dan akan ditandai
dalam warna yang ditentukan oleh |
|
Opsional | Warna diagram. Format string ini bergantung pada apakah Anda menggunakan
|
chtt, chts |
Opsional | Judul dan gaya diagram |
chm |
Opsional | Penanda diagram |
chma |
Opsional | Margin diagram |
chf=bg... |
Opsional | Pengisian solid (khusus latar belakang) |
chdl |
Opsional | Legenda diagram |
Contoh
Deskripsi | Contoh | |||
---|---|---|---|---|
Dalam contoh ini:
|
|
|||
Peta yang menampilkan Prancis, dengan dua wilayah yang ditandai:
|
chld=FR-D|FR-B|FR |
|||
Peta ini menunjukkan menggunakan gradien warna.
|
chd=t:0,50,100 |
|||
Perhatikan bahwa peta dapat dipangkas di dalam ukuran diagram yang ditentukan. Hal ini karena kami tidak akan mendistorsi peta agar pas dengan ukuran diagram yang ditentukan, tetapi kami membatasi peta ke wilayah yang Anda tetapkan dalam chld. Oleh karena itu, untuk menghindari pemangkasan wilayah di dalam batas diagram, Anda mungkin harus menyesuaikan ukuran peta secara manual. |
|
Zoom dan Pemusatan
Secara default, diagram akan di-zoom dan dipusatkan untuk memusatkan wilayah yang Anda pilih, dan membuatnya sesuai dengan area yang dirender sedekat mungkin, dalam ukuran peta yang ditentukan. Namun, Anda dapat menyesuaikan tingkat pemusatan dan zoom diagram dengan dua cara yang berbeda:
Menurut piksel
Untuk menyesuaikan batas dengan ukuran piksel, gunakan format ini:
cht=map:auto=<left_border>,<right_border>,<top_border>,<bottom_border>
Dengan setiap ukuran batas adalah batas tambahan untuk ditampilkan, dalam piksel, di luar tingkat zoom yang dihitung secara otomatis.
Anda hanya dapat memperkecil (nilai positif); Anda tidak dapat memperbesar (nilai negatif) lebih dekat daripada tingkat zoom default menggunakan zoom piksel.
Contoh:
Semua contoh ini menunjukkan kota London (Lat
Tidak Ada Zoom (default) | Diperkecil 30 piksel per sisi | Diperkecil dan ke bawah ke kanan |
---|---|---|
|
cht=map:auto=30,30,30,30 |
cht=map:auto=50,0,80,0 |
Menurut Lintang dan Bujur
Anda dapat menentukan batas atas, bawah, kiri, dan kanan yang tepat dari peta yang dirender menurut lintang dan bujur menggunakan sintaksis yang ditampilkan di sini:
cht=map:fixed=<bottom_border_lat>,<left_border_long>,<top_border_lat>,<right_border_long>
Dengan <bottom_border_lat> dan <top_border_lat> menentukan lintang batas bawah dan atas, serta <left_border_long> dan <right_border_long> menentukan bujur batas kiri dan kanan.
Catatan: Karena distorsi proyeksi Mercator (pada dasarnya, memproyeksikan peta melengkung ke gambar datar), berfokus pada jalur tinggi dan sempit dapat menyebabkan beberapa perbedaan ukuran yang tidak terduga di peta Anda.
Contoh:
Contoh berikut menampilkan London (disorot dengan warna biru) yang merupakan garis bujur 0,1° dan lintang 51,5°. Perhatikan adanya pemangkasan peta karena peta hanya mencoba menampilkan Britania Raya (seperti yang ditentukan) dan mengisi diagram yang ditentukan tanpa distorsi.
Fokus | Lintang bergeser +10* | Diperbesar dengan mengurangi semua nilai |
---|---|---|
cht=map:fixed=40,-10,60,10 |
|
cht=map:fixed=48,-3,54,3 |
Perhatikan bahwa ukuran gambar tengah sedikit lebih kecil daripada gambar pertama, meskipun kita telah memindahkan jumlah derajat yang sama ke atas. Hal ini karena kita memproyeksikan bola 3D ke gambar 2D. Anda harus menambah lebar diagram kedua agar ukurannya sama dengan diagram pertama.
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 (
|
chtt=Site+visitors+by+month| |
Diagram dengan judul 20 poin berwarna biru, rata kanan. |
chtt=Site+visitors |
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 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 |
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. |
|
Untuk menambahkan margin di sekitar legenda, tetapkan nilai untuk parameter Dalam contoh ini, lebar legenda adalah sekitar 60 piksel. Jika Anda menetapkan |
|
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 belakangc
- 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 menentukanchco
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 ( |
|
Contoh ini mengisi latar belakang diagram dengan abu-abu pucat ( |
|
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. |
|
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 kechdl
.r
- Menampilkan label dalam urutan terbalik seperti yang diberikan kepadachdl
. 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 darichdl
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
chdl=First|Second|Third |
Diagram pertama menunjukkan entri legenda horizontal ( |
|
Contoh ini menunjukkan perubahan ukuran font. |
|
Penanda Bentuk chm
[Batang, Garis, Radar, Sebar]
Anda dapat menentukan penanda grafis untuk semua titik data atau titik data individual pada diagram. Jika dua atau beberapa penanda menempati titik yang sama, penanda akan digambar sesuai urutan kemunculannya dalam parameter chm
.
Anda juga dapat membuat penanda teks pada titik data, yang dibahas dalam Penanda Titik Data.
Anda dapat menggabungkan penanda bentuk dengan parameter chm
lainnya menggunakan karakter pipa ( |
) untuk memisahkan parameter chm
.
Sintaksis
Tentukan satu set parameter berikut untuk setiap rangkaian yang harus ditandai. Untuk menandai beberapa deret, buat kumpulan parameter tambahan, yang dipisahkan dengan karakter pipa. Anda tidak perlu me-markup semua seri. Jika Anda tidak menetapkan penanda ke deret data, penanda tidak akan mendapatkan penanda apa pun.
Penanda bentuk berperilaku sedikit berbeda dalam diagram sebar. Lihat dokumentasi tersebut untuk informasi selengkapnya.
chm= [@]<marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_offset> |...| [@]<marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_offset>
- @
- [Opsional] Jika Anda mengawali jenis penanda dengan karakter @ opsional, maka <opt_which_points> harus menggunakan format x:y.
- <marker_type>
- Jenis penanda yang akan digunakan. Tentukan salah satu jenis
berikut:
a
- Panahc
- SilangC
- Persegi panjang. Jika penanda persegi panjang, Anda harus memiliki minimal dua deret data, dengan seri 0 menentukan tepi bawah dan seri 1 menentukan tepi atas. <size> menentukan lebar persegi panjang, dalam piksel.d
- BerlianE
- Penanda kolom error ( ) Penanda ini memerlukan dua deret data untuk dibuat, satu nilai untuk bagian bawah, dan titik yang sesuai di deret kedua untuk bagian atas. Kode ini juga mengekspos sintaksis <size> yang diperluas: line_thickness[:top_and_bottom_width] dengan top_and_bottom_width adalah opsional. Lihat contohnya di bawah ini.h
- Garis horizontal di seluruh diagram pada ketinggian yang ditentukan. (Satu-satunya format yang valid untuk parameter <opt_which_points> adalah n.d.)H
- Garis horizontal melalui penanda data yang ditentukan. Ini mendukung sintaksis <size> tambahan yang memungkinkan Anda menentukan panjang baris yang tepat: line_thickness[:length] dengan :length bersifat opsional, dan ditetapkan secara default ke lebar area diagram penuh.o
- Lingkarans
- Persegiv
- Garis vertikal dari sumbu x ke titik dataV
- Garis vertikal dengan panjang yang dapat disesuaikan. Ini mendukung sintaksis nilai <size> tambahan yang memungkinkan Anda menentukan panjang baris yang tepat: line_thickness[:length] dengan :length bersifat opsional, dan ditetapkan secara default ke tinggi keseluruhan area diagram. Penanda berada di tengah titik data.x
- Tanda X
- <color>
- Warna penanda untuk deret ini, dalam format heksadesimal RRGGBB.
- <series_index>
- Indeks berbasis nol dari deret data untuk menggambar penanda. Diabaikan
untuk penanda
h
dan penanda yang menentukan lokasi berdasarkan posisi x/y (dimulai dengan karakter @). Anda dapat menggunakan deret data tersembunyi sebagai sumber penanda; lihat Diagram Gabungan untuk informasi selengkapnya. Diagram batang vertikal yang dikelompokkan mendukung sintaksis khusus yang diperluas untuk menyelaraskan penanda dengan batang tertentu. - <opt_which_points>
- [Opsional] Titik untuk menggambar penanda. Defaultnya adalah
semua penanda. Gunakan salah satu nilai berikut:
n.d
- Tempat menggambar penanda. Artinya bergantung pada jenis penanda:- Semua jenis kecuali h - Titik data untuk menggambar penanda, dengan n.d adalah indeks berbasis nol dalam deret. Jika Anda menentukan nilai non-bilangan bulat, maka fraksi tersebut menunjukkan titik menengah yang dihitung. Misalnya, 3,5 berarti setengah jalan antara titik 3 dan titik 4.
h
- Angka dari 0,0 hingga 1,0, dengan 0,0 di bagian bawah diagram, dan 1,0 adalah bagian atas diagram.
-1
- Menggambar penanda di semua titik data. Anda juga dapat mengosongkan parameter ini untuk menggambar pada semua titik data.-n
- Menggambar penanda di setiap titik data ke-n. Nilai floating point; jika n kurang dari 1, diagram akan menghitung poin perantara tambahan untuk Anda. Misalnya, -0,5 akan menempatkan penanda dua kali lebih banyak daripada titik data.start:end:n
- Gambar penanda di setiap titik data ke-n dalam rentang, mulai dari nilai indeks start hingga end, inklusif. Semua parameter bersifat opsional (mungkin tidak ada), sehingga 3::1 akan berada dari elemen keempat ke elemen terakhir, langkah 1, dan menghilangkan parameter ini sepenuhnya akan ditetapkan secara default ke first:last:1. Semua nilai dapat berupa angka floating point. start dan end bisa negatif, untuk menghitung mundur dari nilai terakhir. Jika start dan end negatif, pastikan keduanya dicantumkan dalam nilai yang meningkat (misalnya, -6:-1:1). Jika nilai langkah n kurang dari 1, nilai ini akan menghitung titik data tambahan dengan menginterpolasi nilai data yang diberikan. Nilai defaultnya adalah first:last:1x:y
- Menggambar penanda di titik x/y tertentu pada diagram. Titik ini tidak harus berada di garis. Tambahkan karakter @ sebelum jenis penanda untuk menggunakan opsi ini. Tentukan koordinat sebagai nilai floating point, dengan0:0
sebagai sudut kiri bawah diagram dan1:1
sebagai sudut kanan atas diagram. Misalnya, untuk menambahkan berlian merah 15 piksel ke tengah diagram, gunakan@d,FF0000,0,0.5:0.5,15
.
- <size>
- Ukuran penanda, dalam piksel. Sebagian besar pengambilan nilai angka tunggal untuk parameter ini; penanda V, H, dan S mendukung sintaksis <size>[:width] dengan bagian kedua opsional menentukan panjang garis atau penanda.
- <opt_z_order>
- [Opsional] Lapisan tempat penanda akan digambar, dibandingkan dengan penanda lain dan semua elemen diagram lainnya. Ini adalah angka floating point dari -1,0 hingga 1,0, inklusif, dengan -1,0 adalah bagian bawah dan 1,0 adalah bagian atas. Elemen diagram (garis dan batang) hanya lebih rendah dari nol. Jika dua penanda memiliki nilai yang sama, penanda tersebut akan digambar dalam urutan yang ditentukan oleh URL. Nilai defaultnya adalah 0.0 (tepat di atas elemen diagram).
- <opt_offset>
- [Opsional] Memungkinkan Anda menentukan offset horizontal dan vertikal dari lokasi yang ditentukan. Berikut adalah sintaksis yang menggunakan : pemisah:
reserved:<horizontal_offset>:<vertical_offset>
. Jika ditentukan, Anda dapat menyertakan nilai kosong dalam string parameterchm
untuk <opt_z_order>. Contoh:o,FF9900,0,4,12,,:10 o,FF9900,0,4,12.0,,:-10:20 o,FF9900,0,4,12,1,::20
- reserve [reservasi] - Biarkan kosong.
<horizontal_offset>
- Angka positif atau negatif yang menentukan offset horizontal, dalam piksel. Opsional; biarkan kosong jika tidak digunakan.<vertical_offset>
- Angka positif atau negatif yang menentukan offset vertikal, dalam piksel. Opsional; biarkan kosong jika tidak digunakan.
Contoh
Deskripsi | Contoh |
---|---|
Berikut ini contoh beberapa penanda bentuk dan garis.
|
chm= |
Berikut adalah contoh penggunaan berlian untuk satu deret data, dan lingkaran untuk deret data lainnya. Jika dua atau beberapa penanda menempati titik yang sama, penanda akan digambar sesuai
urutan kemunculannya dalam parameter |
chm= |
Berikut diagram garis dengan penanda di setiap titik data kedua (-2 berarti setiap titik lainnya). |
chd=t: |
Berikut adalah diagram garis dengan penanda dua kali lebih banyak dari titik data (-0,5 berarti setiap setengah titik). | chd=t: |
Contoh ini menunjukkan cara menggunakan penanda h dan v untuk membuat garis petak dengan warna dan ketebalan kustom. Nilai urutan z (nilai terakhir) ditetapkan ke -1, sehingga garis petak digambar di bawah garis data. |
chm= |
Diagram ini menambahkan garis isian vertikal ke diagram garis:
|
chm= |
Contoh ini menambahkan penanda panah dan teks ke diagram menggunakan koordinat yang tepat. Penanda D pertama adalah garis pelacakan di bawah batang. Penanda kedua adalah panah, dan penanda ketiga adalah teks panah. | chm= |
Garis horizontal yang terpaku pada titik data tertentu (H ) dapat berguna untuk menampilkan nilai relatif, atau menekankan tinggi nilai data pada diagram. |
chm=H,FF0000,0,18,1 |
Grafik ini menunjukkan penanda yang dapat menentukan ketebalan dan panjang garis dalam parameter <size>.
|
title="cht=lc&chd=s:2gounjqLaCf,jqLaCf2goun&chco=008000,00008033&chls=2.0,4.0,1.0&chs=250x150&chm=H,990066,1,2,5:50%7,1,2,5:50%7,1,2,5:50%7chm=
|
Penanda Nilai Data dan Teks chm
[Batang, Garis, Radar, Sebar]
Anda dapat melabeli titik-titik tertentu pada diagram dengan teks kustom, atau dengan versi data yang telah diformat pada saat itu.
Anda dapat menggabungkan penanda chm
menggunakan karakter pipa ( |
) untuk memisahkan kumpulan parameter chm
.
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
Tentukan satu kumpulan parameter berikut untuk setiap rangkaian yang harus ditandai. Untuk menandai beberapa deret, buat set parameter tambahan, yang dipisahkan dengan karakter pipa. Anda tidak perlu memberi markup pada semua seri. Jika Anda tidak menetapkan penanda ke deret data, penanda tidak akan mendapatkan penanda apa pun.
chm= <marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_placement> |...| <marker_type>,<color>,<series_index>,<opt_which_points>,<size>,<opt_z_order>,<opt_placement>
- <marker_type>
- Jenis penanda yang akan digunakan. Anda dapat memilih dari jenis berikut:
f<text>
- Flag yang berisi teks. Tentukan karakter 'f', diikuti dengan teks berenkode URL kustom. Untuk meng-escape koma dalam penanda teks, awali koma dengan tanda \. Contoh:fHello\,+World!
t<text>
- Penanda teks sederhana. Tentukan karakter 't' diikuti dengan teks berenkode URL kustom. Untuk meng-escape koma dalam penanda teks, awali koma dengan tanda \. Contoh:tHello\,+World!
A<text>
- Penanda anotasi. Penanda ini mirip dengan penanda bendera, tetapi penanda akan mengoordinasikan posisinya agar tidak tumpang tindih. Satu-satunya format yang valid untuk <opt_which_points> adalah n.d, untuk menunjukkan indeks titik dalam deret.N<formatting_string>
- Nilai data pada tahap ini, dengan format opsional. Jika Anda tidak menggunakan parameterchds
(penskalaan kustom), parameter tersebut akan memberikan nilai encoding yang tepat; jika Anda menggunakan parameter tersebut dengan jenis format apa pun, nilai tersebut akan diskalakan ke rentang yang Anda tentukan. Lihat contohchds
dengan penanda numerik di bawah ini. Dengan jenis penanda ini dalam diagram batang bertumpuk, jika Anda menentukan -1 untuk <series_index>, Anda akan mendapatkan penanda yang menunjukkan jumlah semua nilai dalam batang bertumpuk ini. Sintaksis string pemformatan adalah sebagai berikut:
<preceding_text>*<number_type><decimal_places>zs<x or y>*<following_text>
.
Semua elemen ini bersifat opsional. Berikut arti dari setiap elemen:<preceding_text>
- Teks 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
atauy
-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 untuk mengikuti setiap nilai.
- <color>
- Warna penanda untuk kumpulan ini, dalam format heksadesimal RRGGBB.
- <series_index>
- Indeks berbasis nol dari deret data untuk menggambar penanda. Jika diagram ini adalah diagram batang bertumpuk dan jenis penandanya adalah N (nilai titik data), Anda dapat menentukan -1 untuk membuat penanda nilai yang dijumlahkan untuk setiap tumpukan batang. Lihat contoh di bawah.
- <opt_which_points>
- [Opsional] Titik untuk menggambar penanda. Defaultnya adalah semua penanda. Gunakan
salah satu nilai berikut:
n.d
- Titik data untuk menggambar penanda, dengan n.d adalah indeks berbasis nol dalam deret. Jika Anda menentukan nilai non-bilangan bulat, maka pecahan tersebut menunjukkan titik menengah yang dihitung. Misalnya, 3,5 berarti setengah jalan antara titik 3 dan titik 4.-1
- Menggambar penanda di semua titik data. Anda juga dapat mengosongkan parameter ini untuk menggambar pada semua titik data.-n
- Menggambar penanda di setiap titik data ke-n.start:end:n
- Gambar penanda di setiap titik data n dalam suatu rentang, mulai dari nilai indeks n hingga n, inklusif. Semua parameter bersifat opsional (mungkin tidak ada), sehingga 3::1 akan berasal dari elemen keempat hingga terakhir, langkah 1, dan menghilangkan parameter ini sepenuhnya akan ditetapkan secara default ke first:last:1. Semua nilai dapat berupa angka floating point. start dan end bisa negatif, untuk menghitung mundur dari nilai terakhir. Jika start dan end negatif, pastikan keduanya dicantumkan dalam nilai yang meningkat (misalnya, -6:-1:1). Jika nilai langkah n kurang dari 1, titik data tambahan akan dihitung dengan menginterpolasi nilai data yang diberikan. Nilai defaultnya adalah first:last:1x:y
- [Tidak didukung untuk penanda jenis N] Gambar penanda pada titik x/y tertentu pada diagram. Titik ini tidak harus berada di garis. Tambahkan karakter at (@
) sebelum jenis penanda untuk menggunakan opsi ini. Tentukan koordinat sebagai nilai floating point, dengan0:0
sebagai sudut kiri bawah diagram,0.5:0.5
sebagai pusat diagram, dan1:1
adalah sudut kanan atas diagram. Misalnya, untuk menambahkan berlian merah 15 piksel ke bagian tengah diagram, gunakan@d,FF0000,0,0.5:0.5,15
.
- <size>
- Ukuran penanda dalam piksel. Jika diagram sebar dengan deret data ketiga (digunakan untuk menentukan ukuran titik), nilai ini akan diskalakan menurut rentang data. Jadi, jika rentang datanya adalah 0—100 dan <size> adalah 30, nilai data 100 adalah lebar 30 piksel, nilai data 50 adalah lebar 15 piksel, dan seterusnya.
- <opt_z_order>
- [Opsional] Lapisan tempat penanda akan digambar, dibandingkan dengan penanda lain dan semua elemen diagram lainnya. Ini adalah angka floating point dari -1,0 hingga 1,0, inklusif, dengan -1,0 adalah bagian bawah dan 1,0 adalah bagian atas. Elemen diagram (garis dan batang) hanya lebih rendah dari nol. Jika dua penanda memiliki nilai yang sama, penanda tersebut akan digambar dalam urutan yang ditentukan oleh URL. Nilai defaultnya adalah 0.0 (tepat di atas elemen diagram).
- <opt_placement>
- [Opsional] Detail penempatan tambahan yang menjelaskan tempat untuk meletakkan penanda ini, dalam kaitannya dengan titik data. Anda dapat menentukan posisi relatif horizontal dan/atau vertikal, serta offset. Sintaksis penempatan adalah string dengan pemisah seperti ditunjukkan di sini. Semua elemen bersifat opsional:
<horizontal_and_vertical_justification>:<horizontal_offset>:<vertical_offset>
. Jika ditentukan, Anda dapat menyertakan nilai kosong, dalam string parameterchm
untuk <opt_z_order>. Contoh:N,000000,0,1,10,,b
,N,000000,0,1,10,,lv
, danN,000000,0,1,10,,r::10
.- horizontal_and_vertical_justification
- Titik tambatan penanda. Hal ini berperilaku berlawanan dengan justifikasi,
jadi anchor kiri benar-benar menempatkan penanda di sebelah kanan titik
data. Anda dapat memilih justifier horizontal dan/atau vertikal dari daftar berikut:
- Penempatan horizontal: 'l', 'h', atau 'r' - Kiri, tengah, atau anchor kanan, secara horizontal. Defaultnya adalah 'l'.
- Penempatan vertikal: 'b', 'v', 't' - Bawah, tengah, atau anchor atas, secara vertikal. Defaultnya adalah 'b'.
- Penempatan relatif batang [Khusus diagram batang]: 's', 'c', 'e' - Dasar, tengah, atau atas batang. Untuk diagram bertumpuk, nilai ini relatif terhadap bagian batang untuk setiap deret, bukan seluruh batang. Jika indeks seri yang diberikan adalah -1 (total tumpukan), indeks seri tersebut dalam kaitannya dengan seluruh batang. Nilai ini dapat digabungkan dengan nilai penempatan vertikal: misalnya, 'be' atau 'vs'. Nilai defaultnya adalah 'e'.
- horizontal_offset
- Offset horizontal untuk penanda ini, dalam piksel. Defaultnya adalah 0.
- vertical_offset
- Offset vertikal untuk penanda ini, dalam piksel. Default diagram non-bat: 15; default diagram batang: 2.
Deskripsi | Contoh | |
---|---|---|
Berikut adalah contoh label nilai pada diagram batang. Diagram pertama ( Diagram kedua ( |
|
|
Anda dapat menggunakan parameter Contoh ini menampilkan diagram dengan nilai yang dienkode sederhana
yaitu 46, 39, 29, 30, 43, 41. Rentang encoding sederhana adalah 0—61
. Parameter |
chd=s:underp |
|
Berikut ini contoh diagram dengan label teks di titik minimum dan label bendera di titik maksimum. |
|
|
Contoh ini menunjukkan diagram bertumpuk dengan nilai untuk masing-masing deret, ditambah total deret. Untuk menampilkan nilai deret bertumpuk, kita harus menggunakan opsi positioning 'c'; jika tidak, nilai batang atas akan tumpang tindih dengan nilai jumlah di bagian atas setiap batang. | chm= |
|
Beberapa demonstrasi lainnya tentang cara kerja penempatan vertikal dan horizontal. Contoh ini menunjukkan berbagai kombinasi nilai anchor untuk diagram batang (yang menggunakan s, c,dan e untuk penempatan vertikal). Perhatikan bagaimana anchor kanan menggerakkan penanda ke kiri, sedangkan anchor atas menggerakkan penanda ke bawah, dan sebaliknya. Titik merah menunjukkan bagian dasar, tengah, dan atas setiap batang. Angka tersebut adalah nilai data, yang ditetapkan menggunakan nilai anchor yang berbeda untuk setiap batang. | chm= |
|
Penanda anotasi secara otomatis menyesuaikan posisi label agar tidak tumpang-tindih. Nilai chm pertama adalah untuk pengisian baris, nilai berikut
adalah semua penanda anotasi. |
chm=B,C5D4B5BB,0,0,0 |
|
Contoh penanda anotasi lain yang menunjukkan ketinggian kota di Swiss. |