Wykresy kołowe

   

Z tego dokumentu dowiesz się, jak tworzyć wykresy kołowe za pomocą interfejsu Chart API.

Spis treści

Funkcje dotyczące wykresu

  1. Omówienie
  2. Typy wykresów (cht)
  3. Kolory serii (chco),
  4. Etykiety wykresów kołowych (chl),
  5. Rotacja wykresu kołowego (chp)

Funkcje standardowe

  1. Tytuł wykresu (chtt, chts)
  2. Tekst i styl legendy wykresu (chdl, chdlp, chdls)
  3. Chart Margins (Marginesy wykresu) (chma)
  4. Wypełnienie tła (chf)
    1. Wypełnienie (chf)
    2. Wypełnienia gradientowe (chf),
    3. Striped Fills (Wypełnienie w paski) (chf),
  5. Funkcje dotyczące danych (chfd)

Omówienie

Wykresy kołowe przydają się do pokazywania prostych, proporcjonalnych części do całości informacji. Możesz utworzyć pojedynczy wykres kołowy serii, w którym każda seria składa się z wielu wycinków lub wykresów koncentrycznych z wieloma seriami.

Każda seria opisuje 1 kołowy, a każda wartość danych określa jeden wycinek. Jeśli korzystasz z zagnieżdżonych wykresów kołowych (opisanych poniżej), używaj wielu serii.

Aby wyświetlić tekst powiązany z wycinkiem, musisz użyć etykiet na wykresie kołowym lub legendy do wykresu. Etykiety na wykresie kołowym to tekst otaczający wykres z liniami wskazującymi wycinek. Legendy to tekst powiązany z kolorem.

Etykiety Legenda Etykiety i legenda

chl=January|February|March|April

chdl=January|February|March|April

chl=January|February|March|April
chdl=30°|40°|50°|60°

Wartości są wyświetlane względem siebie względem siebie, więc wykres z wartościami 1,2,3 będzie wyglądać tak samo jak wykres o wartościach 100 200 300. Jednak przy korzystaniu z danych w formacie tekstowym wartości większe niż 100 są zmniejszane do wartości 100. Dlatego, aby prawidłowo wyświetlać wycinki większe niż 100, należy użyć formatu tekstowego ze skalowaniem niestandardowym (użyj parametru chds z wartościami minimalnymi/maks. chds=0,<max-slice-size>).

Wartości ujemne są wyświetlane jako puste wycinki o odpowiednim rozmiarze.

Typy wykresów

Istnieją 3 ogólne typy wykresów kołowych: płaski, koncentryczny i 3D. Określ wykres kołowy o tej składni:

Składnia

cht=<chart_type>

Gdzie <chart_type> jest jednym z tych typów:

Parametr Opis Przykład

p

Dwuwymiarowy wykres kołowy.

Podaj tylko 1 serię danych. Kolejne serie danych będą ignorowane.

Domyślnie kolory segmentów koła są interpolowane od ciemnopomarańczowego do jasnożółtego. Określ inne kolory zgodnie z opisem w sekcji Kolory serii.

Określ etykiety za pomocą parametru chl zgodnie z opisem w sekcji Etykiety wykresów kołowych.

Interfejs Google Chart API oblicza promień koła na podstawie minimalnej szerokości i wysokości określonej w parametrze rozmiaru wykresu (chs). Jeśli stosujesz etykiety, prawdopodobnie musisz określić szerokość, aby była dwa razy większa niż wysokość. Dzięki temu etykiety będą widoczne w całości.

Dwuwymiarowy wykres kołowy z 4 segmentami, w których kolory segmentów są interpolowane od ciemnego do jasnopomarańczowego

cht=p
chs=200x100

p3

Trójwymiarowy wykres kołowy.

Dane i formatowanie określ tak samo jak w przypadku dwuwymiarowych wykresów kołowych powyżej.

Jeśli umieszczasz etykiety na trójwymiarowym wykresie kołowym, prawdopodobnie musisz określić szerokość 2,5 raza większą od wysokości, aby etykiety były widoczne w całości.

Trójwymiarowy wykres kołowy z 4 segmentami, w których kolory segmentów są interpolowane od ciemnego do jasnopomarańczowego

cht=p3
chs=250x100

pc

Koncentryczny wykres kołowy.

Podaj co najmniej 2 serie danych.

Dwa koncentryczne wykresy kołowe z 4 segmentami w przypadku interpolacji kolorów segmentów z ciemnego do jasnopomarańczowego

cht=pc
chd=s:Helo,Wrld

Wszystkie typy Liczby ujemne w danych powodują „puste” wycinki. Dwa koncentryczne wykresy kołowe z 4 segmentami w przypadku interpolacji kolorów segmentów z ciemnego do jasnopomarańczowego
cht=pc
chd=t:
10,-10,10,-10|
5,-5,5,-5,5,-5,5,-5,5,-5

 

Kolory serii chco

Za pomocą parametru chco możesz określić kolory wszystkich wartości, każdej wartości lub niektórych wartości.

Składnia

chco=<slice_1>|<slice_2>|<slice_n>,<series_color_1>,...,<series_color_n>
<color>
Kolory wycinków w formacie szesnastkowym RRGGBB. Określ jeden kolor serii, a wszystkie wycinki w tej serii zostaną podzielone według tego koloru od najciemniejszego (pierwszy element danych) do najjaśniejszego (ostatniego elementu danych). Określ co najmniej 2 kolory rozdzielone znakiem |, aby opisać kolory poszczególnych wycinków. Jeśli masz wiele serii (czyli wykres z pierścieniami koncentrycznymi), możesz określać wartości różnych serii, oddzielając je przecinkiem. Jeśli podano mniej kolorów wycinków lub serii niż wyświetlanych wycinków, wykres będzie się cyklicznie cyklicznie powtarzał od początku listy wycinków serii lub listy serii na wykresie. Na wykresie z wieloma seriami nie możesz określić osobnego gradientu dla każdej serii.
Opis Przykład

Określ jeden kolor, aby podzielić go od najciemniejszego (pierwszego wycinka) do najjaśniejszego (ostatniego wycinka).

Trójwymiarowy wykres kołowy z segmentami interpolowanymi od ciemności do jasnobłękitnego

chco=0000FF

Definiowanie gradientu; tutaj od żółtego do czerwonego. Od żółtego do czerwonego.
chd=t:10,20,30,40,50
chco=FFFF10,FF0000

Definiowanie kolorów poszczególnych wycinków; określ jeden kolor dla każdego wycinka. Jeden wycinek na kolor.
chd=t:10,20,30
chco=FF0000|00FF00|0000FF
Ten wykres zawiera 2 serie danych, ale kolor jest określany jako pojedynczy gradient we wszystkich wycinkach od żółtego do czerwonego (BBBB00–BB0000). Dwa koncentryczne wykresy kołowe z 4 segmentami w przypadku interpolacji kolorów segmentów z ciemnego do jasnopomarańczowego
chco=BBBB00,BB0000

Oto wykres koncentryczny, który zawiera zarówno kolory serii, jak i kolory poszczególnych wycinków. Wykres zawiera 2 koncentryczne serie danych. W postaci zrozumiałej dla człowieka kolory to chco=zielony|czerwony,niebieski|żółty. Przecinek dzieli to na 2 serie:

  • zielony|czerwony – naprzemienny fragment zielony i czerwony.
  • niebieski|żółty – naprzemienny fragment niebieski i żółty.
Dwa koncentryczne wykresy kołowe z 4 segmentami w przypadku interpolacji kolorów segmentów z ciemnego do jasnopomarańczowego
chd=s:eYY,ORVM
chco=008800|880000,000088|888800

Powrót do góry

Etykiety wykresów kołowych chl

Etykiety poszczególnych wycinków na wykresie kołowym możesz określać za pomocą parametru chl. Można też wyświetlić legendę z tymi samymi lub różnymi wartościami, 1 wpis legendy na wycinek.

Uwaga o wartościach ciągów: w ciągach etykiet można używać tylko znaków, które są bezpieczne w adresie URL. Dla bezpieczeństwa należy zakodować adresy URL wszystkich ciągów zawierających znaki spoza zestawu znaków 0-9a-zA-Z. Koder adresów URL znajdziesz tutaj.

Składnia

chl=
  <label_value>|
    ...
  <label_value>
<label_value>
Wartość w postaci ciągu znaków do zastosowania do wycinka. Etykiety są stosowane kolejno do punktów danych w obiekcie chd. Jeśli masz wiele serii (na przykład na koncentralnym wykresie kołowym), etykiety zostaną zastosowane do wszystkich punktów we wszystkich sekwencjach w kolejności określonej we właściwości chd. Między poszczególnymi etykietami użyj separatora pionowej ( |). Podaj brakującą wartość pośrednią, używając 2 następujących po sobie znaków pionowej kreski bez spacji: || . Nie musisz oznaczać etykietami wszystkich wycinków.

 

Przykłady

Opis Przykład

Etykiety trójwymiarowego wykresu kołowego.

Trójwymiarowy wykres kołowy z etykietami maj, czerwiec, lipiec, sierpień, wrzesień i październik dla każdego segmentu

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

Określając rozmiar wykresu za pomocą funkcji chs, zastanów się, ile miejsca będą potrzebne etykiety.

Ogólnie dwuwymiarowy wykres kołowy powinien mieć szerokość około 2 razy większą od wysokości, a trójwymiarowy wykres kołowy powinien być około dwa i pół raza szerszy niż wysokość, aby etykiety były wyświetlane prawidłowo.

W pierwszym przykładzie etykiety są wyświetlane tylko częściowo, ponieważ wykres nie jest wystarczająco szeroki.

Drugi przykład pokazuje, że do wyświetlenia etykiet w całości wykres potrzebuje szerokości 280 pikseli. (Obramowania dodane bezpośrednio do elementu <img>).

Trójwymiarowy wykres kołowy z etykietami maj, czerwiec, lipiec, sierpień, wrzesień i październik dla każdego segmentu

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


Trójwymiarowy wykres kołowy z etykietami maj, czerwiec, lipiec, sierpień, wrzesień i październik dla każdego segmentuchl=May|June|July|August|
September|October
chs=280x100

Powrót do góry

Obrót wykresu kołowego chp

Domyślnie pierwsza seria jest rysowana od godziny 3:00 i zgodnie z ruchem wskazówek zegara wzdłuż wykresu. Możesz jednak określić rotację niestandardową za pomocą parametru chp.

Składnia

chp=<radians>
  
<radians>
Wartość zmiennoprzecinkowa określająca, o ile radianów ma zostać obrócony wykres w prawo. Jeden pełny obrót wynosi 2π (2 pi – około 6,28) radianów.

Przykłady

Opis Przykład

Aby zmienić orientację wykresu kołowego, użyj funkcji chp=<angle_in_radians>

Wykres kołowy z 2 segmentami

chd=t:20,80


Wykres kołowy z 2 segmentami obrócony o 0, 628

chd=t:80,20
chp=0.628

Oto kolejny przykład rotacji na wykresie kołowym. Można je łączyć ze znacznikami kształtów wykresu, aby uzyskać ciekawe efekty. Wykres kołowy z 2 segmentami obrócony o 0, 628

 

Powrót do góry

Funkcje standardowe

Pozostałe funkcje dostępne na tej stronie to standardowe funkcje wykresów.

Tytuł wykresu chtt, chts [Wszystkie wykresy]

Możesz określić tytuł wykresu, kolor i rozmiar czcionki.

Składnia

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

 

chtt – określa tytuł wykresu.

<chart_title>
Tytuł wykresu. Nie możesz określić, gdzie ma się ona wyświetlać, ale możesz opcjonalnie określić rozmiar i kolor czcionki. Użyj znaku + do oznaczenia spacji, a pionowej kreski ( |) do oznaczenia podziałów wiersza.

 

chts [opcjonalny] – kolory i rozmiar czcionki parametru chtt.

<color>
Kolor tytułu w formacie szesnastkowym RRGGBB. Kolor domyślny to czarny.
<font_size>
Rozmiar czcionki tytułu w punktach.
<opt_alignment>
[Opcjonalne] wyrównanie tytułu. Wybierz jedną z tych wartości ciągu znaków (z uwzględnieniem wielkości liter): „l” (po lewej), „c” (wyśrodkowana) „r” (po prawej). Wartość domyślna to „c”.

 

Przykłady

Opis Przykład

Wykres z tytułem, w którym jest używany domyślny kolor i rozmiar czcionki.

Określ spację ze znakiem plusa (+).

Aby wymusić podział wiersza, użyj pionowej kreski (|).

chts nie został tutaj określony.

Pionowy wykres słupkowy z tytułem
chtt=Site+visitors+by+month|
January+to+July

Wykres z 20-punktowym tytułem wyrównanym do prawej.

Pionowy wykres słupkowy z niebieskim wykresem, 20 pikseli, tytuł
chtt=Site+visitors
chts=FF0000,20,r

Powrót do góry

Tekst i styl legendy wykresu chdl, chdlp, chdls [wszystkie wykresy]

Legenda to boczna sekcja wykresu, która zawiera krótki opis każdej serii. Możesz określić tekst powiązany z każdą serią w tej legendzie i określić, w którym miejscu na wykresie ma się ona pojawiać.

Aby dowiedzieć się, jak ustawić marginesy wokół legendy, zapoznaj się z sekcją chma.

Uwaga o wartościach ciągów: w ciągach etykiet dozwolone są tylko znaki bezpieczne w adresie URL. Dla bezpieczeństwa należy zakodować adresy URL wszystkich ciągów zawierających znaki spoza zestawu znaków 0-9a-zA-Z. Koder adresów URL znajdziesz w dokumentacji Google Optimize.

Składnia

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

 

chdl – tekst każdej serii wyświetlany w legendzie.

<data_series_label>
Tekst wpisów legendy. Każda etykieta ma zastosowanie do odpowiedniej serii w tablicy chd. Użyj znaku + w odniesieniu do spacji. Jeśli nie określisz tego parametru, na wykresie nie zostanie utworzona legenda. Nie można określić podziału wiersza w etykiecie. Legenda zwykle się rozwinie, aby zmieścić tekst legendy, a obszar wykresu zmniejszy się, aby zmieścić się w legendzie.

chdlp – [opcjonalny] położenie legendy i kolejność wpisów legendy. Można podać wartość <position> i/lub <label_order>. Jeśli podasz obie wartości, rozdziel je znakiem słupka. Możesz dodać „s” do dowolnej wartości, jeśli chcesz, aby puste wpisy legendy chdl zostały pominięte w legendzie. Przykłady: chdlp=bv, chdlp=r, chdlp=bv|r, chdlp=bvs|r

<opt_position>
[Opcjonalny] – określa pozycję legendy na wykresie. Aby określić dodatkowe dopełnienie między legendą a obszarem wykresu lub ramką obrazu, użyj parametru chma. Wybierz jedną z tych wartości:
  • b – legenda u dołu wykresu; wpisy legendy w poziomym wierszu.
  • bv – legenda u dołu wykresu. Legenda w pionowej kolumnie.
  • t – legenda u góry wykresu; wpisy legendy w poziomym wierszu.
  • tv – legenda u góry wykresu. Legenda w pionowej kolumnie.
  • r – [wartość domyślna] – legenda po prawej stronie wykresu. Legenda w pionowej kolumnie.
  • l – legenda po lewej stronie wykresu. Legenda w pionowej kolumnie.
<opt_label_order>
[opcjonalny] Kolejność wyświetlania etykiet w legendzie. Wybierz jedną z tych wartości:
  • l – [domyślna dla legend pionowych] wyświetlaj etykiety w kolejności podanej w chdl.
  • r – etykiety wyświetlaj w odwrotnej kolejności, zgodnie z ustawieniem chdl. Przydaje się to na skumulowanych wykresach słupkowych, ponieważ pozwala wyświetlić legendę
    w tej samej kolejności, w jakiej pojawiają się słupki.
  • a – [ustawienie domyślne dla legend poziomych] automatyczne sortowanie: oznacza sortowanie według długości, od najkrótszego od najkrótszego, czyli 10 pikseli. Gdy 2 elementy mają tę samą długość (położone na 10-pikselowe bloki), jako pierwszy będzie wyświetlany ten wymieniony jako pierwszy.
  • 0,1,2... – zamówienie etykiety własnej. Jest to lista rozdzielonych przecinkami indeksów etykiet z chdl, liczonych od zera.

chdls – [opcjonalny] – określa kolor i rozmiar czcionki tekstu legendy.

<color>
Kolor tekstu legendy w formacie szesnastkowym RRGGBB.
<size>
Rozmiar punku tekstu legendy.

 

Przykłady

Opis Przykład

Dwa przykłady legend. Podaj tekst legendy w tej samej kolejności co w serii danych.

Czerwony, niebieski i zielony wykres liniowy z pasującymi legendami

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

Diagram Venna z 2 mniejszymi okręgami otoczonymi dużym okręgiem


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

Pierwszy wykres przedstawia wpisy legendy poziomej (chdlp=t, domyślny układ jest poziomy), a drugi – legendę u dołu (chdlp=bv).

Diagram Venna z 2 mniejszymi okręgami otoczonymi dużym okręgiem
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=t


Diagram Venna z 2 mniejszymi okręgami otoczonymi dużym okręgiem
chdl=First|Second|Third
chco=ff0000,00ff00,0000ff
chdlp=bv

Ten przykład pokazuje zmianę rozmiaru czcionki.

Diagram Venna z 2 mniejszymi okręgami otoczonymi dużym okręgiem
chdls=0000CC,14

Powrót do góry

Marginesy wykresu chma [wszystkie wykresy]

Rozmiar marginesów wykresu możesz określić w pikselach. Marginesy są obliczane do wewnątrz od określonego rozmiaru wykresu (chs). Zwiększenie marginesu nie zwiększy całkowitego rozmiaru wykresu, ale w razie potrzeby zmniejszy obszar wykresu.

Marginesy są domyślnie ustawiane tak, by pozostały po obliczeniu rozmiaru wykresu. Ta wartość domyślna zależy od typu wykresu. Określone marginesy mają wartość minimalną. Jeśli w obszarze wykresu jest dość miejsca na marginesy, rozmiar marginesów będzie taki sam jak ten, który zostanie przekroczony. Nie możesz ściśnąć marginesów mniejszych niż wymagane w legendach i etykietach. Oto diagram przedstawiający podstawowe części wykresu:

Margines wykresu, obszar legendy i obszar wykresu

marginesy wykresu obejmują etykiety osi i obszar legendy, Rozmiar obszaru legendy zmienia się automatycznie, aby dokładnie dopasować się do tekstu, chyba że określisz większą szerokość za pomocą właściwości chma. W takim przypadku margines zostanie szerszy, ściskając obszar wykresu. Nie możesz przyciąć legendy, określając zbyt mały rozmiar legendy, ale możesz zwiększyć jej rozmiar.

Wskazówka: jeśli słupki mają stały rozmiar (domyślnie), na wykresie słupkowym nie można zmniejszyć szerokości obszaru wykresu. Musisz określić mniejszy rozmiar słupka lub jego rozmiar, który można zmienić za pomocą właściwości chbh.

 

Składnia

chma=
  <left_margin>,<right_margin>,<top_margin>,<bottom_margin>|<opt_legend_width>,<opt_legend_height>
<left_margin>, <right_margin>, <top_margin>, <bottom_margin>
Minimalny rozmiar marginesu dookoła obszaru wykresu w pikselach. Zwiększ tę wartość, by uwzględnić dopełnienie, które zapobiegnie stykaniu się etykiet osi z granicami wykresu.
<opt_legend_width>, <opt_legend_height>
[Opcjonalny] Szerokość marginesu wokół legendy w pikselach. Pozwala to uniknąć sytuacji, w której legenda przesunie się na obszar wykresu lub krawędzie obrazu.

 

Przykłady

Opis Przykład

W tym przykładzie każdy bok wykresu ma minimalny margines 30 pikseli. Legenda do wykresu ma ponad 30 pikseli szerokości, dlatego margines po prawej stronie jest ustawiony na szerokość legendy wykresu i różni się od pozostałych.

Etykiety osi znajdują się poza obszarem wykresu, dlatego są rysowane w obszarze marginesów.

Wykres liniowy z szarym tłem i marginesami po każdej stronie.
chma=30,30,30,30

Aby dodać margines wokół legendy, ustaw wartość parametrów <opt_legend_width> i <opt_legend_height>.

W tym przykładzie legenda ma około 60 pikseli szerokości. Jeśli ustawisz <opt_legend_width> na 80 pikseli, margines zostanie wydłużony do 20 pikseli poza legendą.

Wykres liniowy z szarym tłem i marginesami po każdej stronie.
chma=20,20,20,30|80,20

Powrót do góry

Style osi i etykiety [linia, słupek, wskaźnik Google, radar, punktowy]

Możesz określić, które osie mają być wyświetlane na wykresie, a także nadawać im własne etykiety i pozycje, zakresy i style.

Nie wszystkie wykresy wyświetlają domyślnie linie osi. Aby dokładnie określić, które osie mają być wyświetlane, użyj parametru chxt. Domyślne linie osi nie zawierają liczb. Aby pokazać liczby, musisz określić oś w parametrze chxt.

Możesz ustawić na osiach liczby odzwierciedlające wartości danych lub określić osie niestandardowe. Domyślnie wyświetlane są wartości liczbowe z zakresem od 0 do 100. Zakres ten możesz jednak zmienić za pomocą funkcji chxr, aby wyświetlić dowolny zakres. Możesz też zmieniać styl wartości (np. aby wyświetlać symbole walut lub cyfry po przecinku) za pomocą funkcji chxs.

Jeśli chcesz użyć wartości niestandardowych, np. „Pn., Wt, Śr”, możesz użyć parametru chxl. Aby umieścić te etykiety w określonych miejscach na osi, użyj parametru chxp.

Możesz też użyć parametrów chxs i chxtc, by określić kolor, rozmiar, wyrównanie i inne właściwości etykiet osi niestandardowych i liczbowych.

Uwaga o wartościach ciągów: w ciągach etykiet dozwolone są tylko znaki bezpieczne w adresie URL. Dla bezpieczeństwa należy zakodować adresy URL wszystkich ciągów zawierających znaki spoza zestawu znaków 0-9a-zA-Z. Koder adresów URL znajdziesz w dokumentacji Google Optimize.

W tej sekcji omówiono te tematy:


Widoczne osie chxt

Wykresy słupkowe, liniowe, radarowe i punktowe domyślnie wyświetlają jedną lub dwie linie osi, ale nie zawierają wartości. Aby wyświetlić wartości na liniach osi lub zmienić wyświetlane osie, użyj parametru chxt. Domyślnie wartości osi mieszczą się w zakresie od 0 do 100, chyba że wyraźnie przeskalujesz je za pomocą właściwości chxr. Aby ukryć wszystkie linie osi na wykresie liniowym, wpisz :nda po wartości typu wykresu w parametrze cht (np. cht=lc:nda).

Domyślnie górna i dolna oś nie pokazują znaczników według wartości, ale lewa i prawa strona je pokazują. Możesz zmienić to działanie za pomocą parametru chxs.

Składnia

chxt=
  <axis_1>
    ,...,
  <axis_n>
<axis>
Oś do pokazania na wykresie. Dostępne osie to:
  • x – dolna oś X
  • t – górna oś X [nieobsługiwana przez Google-o-Meter]
  • y – lewa oś Y
  • r – Prawa oś Y [nieobsługiwana przez Google-o-Meter]

Możesz podać wiele osi tego samego typu, na przykład: cht=x,x,y. Spowoduje to ułożenie 2 zestawów osi x na dole wykresu. Jest to przydatne podczas dodawania etykiet własnych na osi zawierającej wartości liczbowe (zobacz przykład poniżej). Osie są rysowane od wewnątrz na zewnątrz, więc jeśli użyjesz właściwości x,x, pierwszy x oznacza skrajnie wewnętrzną kopię, następny x oznacza następną kopię na zewnątrz i tak dalej.

 

Przykłady

Opis Przykład

Ten przykład przedstawia wykres liniowy z osią X, Y, górną osią (T) i prawą osią (R).

Nie podano żadnych etykiet, dlatego na wykresie domyślnie obowiązuje zakres od 0 do 100 dla wszystkich osi.

Pamiętaj, że domyślnie na osi górnej i dolnej nie są widoczne znaczniki wyboru.

Wykres liniowy z etykietami 0, 20, 40, 60, 80 i 100 po lewej i prawej stronie oraz etykietami: 0, 25, 50, 75 i 100 powyżej i poniżej.
chxt=x,y,r,t

Możesz dołączyć wiele zestawów etykiet dla każdej osi, dodając tę samą wartość więcej niż raz. Ten przykład przedstawia 2 zestawy osi x i dwa zestawy osi y. Nie jest to szczególnie przydatne, gdy używasz tylko domyślnych etykiet osi, jak pokazano tutaj. Za pomocą parametru chxl możesz jednak określić etykiety własne dla każdej kopii każdej osi.

<strong>


<img <code="" dir="ltr" src="/static/chart/image/images/chart_42.png" title="chxt=x,x,y,y&cht=lc&chd=s:cEAELFJHHHHKUju9uuXUc&chco=76A4FB&chls=2.xing:x1=20


W tym przykładzie pokazano poziomy wykres słupkowy z osią X, Y, górną osią T i prawą osią R.

Etykiety osi są pomijane, dlatego interfejs Chart API wyświetla zakres od 0 do 100 dla osi X i osi T.

Zakres dla osi Y i R jest określany na podstawie liczby słupków. W tym przypadku występuje 5 słupków, więc interfejs Chart API pokazuje zakres od 0 do 4. Pierwsza etykieta jest wyśrodkowana u podstawy pierwszego słupka, druga na podstawie drugiego słupka itd.

Wykres liniowy z etykietami 0, 20, 40, 60, 80 i 100 po lewej i prawej stronie oraz etykietami: 0, 25, 50, 75 i 100 powyżej i poniżej.
chxt=x,y,r,t

Możesz pominąć osie domyślne na wykresie liniowym, podając :nda po typie wykresu. Wykres liniowy z ukrytymi osiami
cht=lc:nda

Powrót do góry

Zakres osi chxr

Za pomocą parametru chxr możesz określić zakres wartości wyświetlanych na każdej osi niezależnie. Pamiętaj, że nie to zmienia skali elementów wykresu, a tylko skali etykiet osi. Jeśli chcesz, aby liczby na osi opisują rzeczywiste wartości danych, ustaw wartości <start_val> i <end_val> odpowiednio na dolną i górną wartość zakresu formatów danych. Więcej informacji znajdziesz w artykule Skalowanie osi.

Jeśli chcesz określić jej zakres, musisz ustawić oś za pomocą parametru chxt.

Aby określić wartości osi niestandardowych, użyj parametru chxl.

Składnia

Zakresy etykiet wielu osi rozdziel pionową kreską ( |).

chxr=
  <axis_index>,<start_val>,<end_val>,<opt_step>
    |...|
  <axis_index>,<start_val>,<end_val>,<opt_step>
<axis_index>
Do której osi mają zostać zastosowane etykiety. Jest to indeks liczony od zera do tablicy osi określonej przez chxt. Na przykład oś R w polu chxt=x,r,y miałaby wartość 1.
<start_val>
Liczba określająca dolną wartość dla tej osi.
<end_val>
Liczba określająca wysoką wartość dla tej osi.
<opt_step>
[Opcjonalny] krok liczenia między znacznikami na osi. Nie ma domyślnej wartości kroku. Krok jest obliczany tak, by wyświetlić zbiór etykiet w odpowiednich odstępach czasu.

 

Przykłady

Opis Przykład

W tym przykładzie pokazano lewą i prawą osie Y (y i r) oraz 1 oś X (x).

Każda oś ma zdefiniowany zakres. Nie podano żadnych etykiet ani pozycji, dlatego wartości są pobierane z podanego zakresu i są w nim równomiernie rozmieszczone. Na wykresie liniowym wartości są równomiernie rozłożone wzdłuż osi X.

Kierunek osi jest odwrócony na osi R (indeks 2), ponieważ pierwsza wartość (1000) jest większa niż ostatnia (0).


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

W tym przykładzie wartości są podane na osi x.

Etykiety osi są równomiernie rozmieszczone wzdłuż osi. W parametrze <opt_step> określono wartość pięć (5).

Wykres słupkowy przedstawiający 200, 300 i 400 wartości na osi X. chxt=x
chxr=0,10,50,5

Powrót do góry

Etykiety osi niestandardowej chxl

Za pomocą parametru chxl możesz określić niestandardowe etykiety osi ciągu znaków na dowolnej osi. Możesz określić dowolną liczbę etykiet. Jeśli wyświetlasz oś (z użyciem parametru chxt) i nie określisz etykiet własnych, zostaną zastosowane standardowe etykiety liczbowe. Aby określić niestandardowy zakres liczbowy, użyj zamiast niego parametru chxr.

Aby ustawić określone lokalizacje na osi dla etykiet, użyj parametru chxp.

Składnia

Określ po jednym zestawie parametrów dla każdej osi, którą chcesz oznaczyć etykietą. Kolejne zestawy etykiet rozdziel pionową kreską (|).

chxl=
  <axis_index>:|<label_1>|...|<label_n>
    |...|
  <axis_index>:|<label_1>|...|<label_n>
<axis_index>
Do której osi mają zostać zastosowane etykiety. To jest indeks do tablicy parametrów chxt. Jeśli na przykład masz chxt=x,x,y,y, indeks 0 będzie pierwszą osią X, a 1 – drugą osią.
<label_1>| ... |<label_n>
Co najmniej 1 etykieta do umieszczenia wzdłuż tej osi. Może to być ciąg lub wartość liczbowa. Ciągi tekstowe nie muszą być w cudzysłowie. Etykieta label_1 jest wyświetlana na najniższej pozycji na osi, a label_n – na najwyższej. Etykiety dodatkowe są równomiernie rozmieszczone między nimi. Aby oznaczyć pokoje znakiem +, wystarczy oznaczyć je znakiem +. Nie można określić podziału wiersza w etykiecie. Etykiety rozdzielaj pionową kreską. Uwaga: nie umieszczaj kreski pionowej w parametrze chxl.

 

Przykłady

Opis Przykład

Ten wykres pokazuje, jak dodać etykiety własne do 2 osi. Zwróć uwagę na to, jak wartości są równomiernie rozmieszczone oraz jak ostatnia wartość chxl nie kończy się pionową kreską.

wykres liniowy z 0 i 100 po lewej stronie, A, B i C po prawej, styczeń, lipiec, styczeń, lipiec i styczeń na osi X oraz lata 2005, 2006 i 2007 poniżej;
chxt=x,y
chxl=
0:|Jan|Feb|March|April|May|
1:|Min|Mid|Max

Ten przykład przedstawia etykiety osi Y po lewej i prawej stronie osi Y (y i r). Obejmuje też 2 zestawy wartości na osi x (x). Możesz dodać znaczniki na osi Y, używając chxs.

wykres liniowy z 0 i 100 po lewej stronie, A, B i C po prawej, styczeń, lipiec, styczeń, lipiec i styczeń na osi X oraz lata 2005, 2006 i 2007 poniżej;
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
1:|0|50|100|
2:|A|B|C|
3:|2005|2006|2007

Ten przykład przedstawia etykiety osi Y lewej i prawej na osi Y (y i r). Obejmuje też 2 zestawy wartości na osi x (x). Zwróć uwagę na puste etykiety dla zestawu dolnej osi X, które służą do rozdzielania wartości.

W tym przykładzie użyto wartości domyślnych etykiet osi na lewej osi Y.

wykres słupkowy z 0 i 100 po lewej stronie, A, B i C po prawej, styczeń, lipiec, styczeń, lipiec i styczeń na osi X, a poniżej lata 2005, 2006 i 2007;
chxt=x,y,r,x
chxl=
0:|Jan|July|Jan|July|Jan|
2:|A|B|C|
3:|2005||2006||2007

Jeśli chcesz dodać etykietę ogólną opisującą całą oś (np. aby oznaczyć jedną oś „koszt”, a drugą „uczeń”), użyj właściwości chxt, aby dodać oś po każdej stronie, a potem użyj właściwości chxl, aby dodać 1 etykietę niestandardową z każdej strony, i użyj chxp, aby rozmieścić ją na środku osi.


chxt=x,x,y,y
chxl=1:|Martinis|3:|Score
chxp=1,50|3,50

Powrót do góry

Pozycje etykiet na osi chxp

Możesz określić, które etykiety osi mają być wyświetlane. Mogą to być etykiety domyślne lub niestandardowe określone za pomocą funkcji chxl. Jeśli nie określisz dokładnych pozycji za pomocą tego parametru, etykiety będą rozmieszczone równomiernie zgodnie z domyślną wartością kroku wzdłuż osi. Jeśli nie określisz właściwości chxl, etykiety znaczników będą wartościami domyślnymi (zwykle są to wartości danych lub liczby słupkowe na wykresach słupkowych).

Składnia

Wiele zestawów pozycjonowania rozdzielaj pionową kreską (|).

chxp=
  <axis_1_index>,<label_1_position>,...,<label_n_position>
    |...|
  <axis_m_index>,<label_1_position>,...,<label_n_position>
<axis_index>
Oś, dla której określasz pozycje. To jest indeks do tablicy parametrów chxt. Jeśli na przykład masz chxt=x,x,y,y, indeks 0 będzie pierwszą oś x, 1 to druga oś x itd.
<label_1_position>,...,<label_n_position>
Położenie etykiety wzdłuż osi. Jest to rozdzielona przecinkami lista wartości liczbowych, w której każda wartość ustawia pozycję odpowiedniej etykiety w tablicy chxl: pierwszy wpis dotyczy pierwszej etykiety i tak dalej. Pozycja to wartość w zakresie dla tej osi. Pamiętaj, że zawsze ma on wartość od 0 do 100, chyba że określisz zakres niestandardowy za pomocą funkcji chxr. Musisz mieć tyle pozycji, ile masz etykiet dla tej osi.

 

Przykłady

Opis Przykład

Ten przykład przedstawia etykiety osi R znajdujące się w określonych pozycjach na wykresie. Tekst etykiety określa się za pomocą parametru chxl.

Etykiety o określonej pozycji 0 są umieszczane na dole osi Y, R lub po lewej stronie osi x lub T.

Etykiety o określonej pozycji 100 są umieszczane u góry osi Y lub R albo po prawej stronie osi x lub 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

Ten przykład pokazuje wartości domyślnych etykiet, ale tylko w określonych lokalizacjach.

chxp=1,10,35,75 – oś Y powinna zawierać tylko 3 etykiety: 10, 35 i 75. Te wartości osi są wyświetlane, ponieważ nie określono tekstu etykiety własnej. Gdy używasz chxp, pamiętaj, że nie musisz rozdzielać etykiet równomiernie. Jeśli nie określono tu atrybutu chxp, domyślna odległość wartości etykiety na osi Y wynosiłaby co 20 jednostek, jak widać na drugim wykresie.

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

Wykres liniowy z domyślnymi pozycjami osi.
chxt=x,y
Nie określono wartości chxp

Powrót do góry

Style etykiet osi chxs

Możesz określić rozmiar, kolor i wyrównanie czcionki etykiet osi, zarówno etykiet niestandardowych, jak i wartości etykiet domyślnych. Wszystkie etykiety na tej samej osi mają ten sam format. Jeśli masz wiele kopii osi, każdą możesz sformatować w inny sposób. Możesz też określić format ciągu znaków etykiety, na przykład w celu wyświetlania symboli walut lub końcowych zer.

Domyślnie górna i dolna oś nie pokazują znaczników według wartości, a lewa i prawa osie je pokazują.

Składnia

Wartości dla wielu osi powinny być rozdzielone pionową kreską (|).

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>
Oś, do której to odnosi się. Indeks liczony od zera do parametru chxt.
<opt_format_string>
[Opcjonalny] to opcjonalny ciąg formatu, który, jeśli jest używany, występuje tuż po numerze indeksu osi bez przecinka. Zaczyna się od litery N, po której następują następujące wartości: Składnia ciągu znaków wygląda tak:
       N<preceding_text>*<number_type><decimal_places>zs<x or y>*<following_text>
Oto znaczenie każdego elementu:
  • <preceding_text> – tekst dosłowny poprzedzający każdą wartość.
  • *...* – opcjonalny blok umieszczony w dosłownych gwiazdkach, który pozwala określić szczegóły formatowania liczb. Te wartości są obsługiwane i wszystkie są opcjonalne:
    • <number_type> – format liczb dla wartości liczbowych. Wybierz jedną z tych opcji:
      • f – [domyślny] format liczby zmiennoprzecinkowej. Rozważ również określenie precyzji za pomocą wartości <decimal_places>.
      • p – format wartości procentowej. Znak % jest dodawany automatycznie. Uwaga: w tym formacie wartości danych z zakresu od 0,0 do 1,0 są mapowane na wartości 0–100% (na przykład 0,43 będzie wyświetlany jako 43%).
      • e – format zapisu naukowego.
      • c<CUR> – sformatuj liczbę na podaną walutę, dodając do niej odpowiedni znacznik waluty. Zastąp <CUR> trzyliterowym kodem waluty. Przykład: cEUR oznacza euro. Listę kodów można znaleźć na stronie ISO, jednak nie wszystkie symbole są obsługiwane.
    • <decimal_places> – liczba całkowita określająca liczbę wyświetlanych miejsc po przecinku. Wartość zostanie zaokrąglona do tej długości (nie obcięta). Wartość domyślna to 2.
    • z – wyświetlane są końcowe zera. Wartość domyślna to no (nie).
    • s – separatory grup displayowych. Wartość domyślna to no (nie).
    • x lub y – wyświetla dane ze współrzędnych x lub y. Znaczenie danych x różni się w zależności od typu wykresu – eksperymentuj z wykresem, aby ustalić, co oznaczają. Wartość domyślna to „y”.
  • <following_text> – tekst dosłowny, który pojawia się po każdej wartości.
<opt_label_color>
Kolor stosowany do tekstu osi (ale nie linii osi), w formacie szesnastkowym RRGGBB. Kolor linii osi jest określany oddzielnie za pomocą parametru opt_axis_color. Domyślny kolor to szary.
<opt_font_size>
[Opcjonalny] – określa rozmiar czcionki w pikselach. Ten parametr jest opcjonalny.
<opt_alignment>
[Opcjonalnie] wyrównanie etykiet. W przypadku górnej i dolnej osi określa to, jak wyrównanie etykiety względem znacznika wyboru powyżej lub poniżej, a dla lewej lub prawej osi – sposób wyrównania etykiety względem osi między ramką ograniczającą. Podaj jeden z tych numerów:
  • -1Góra lub dół: etykiety znajdują się po prawej stronie znaczników; Do lewej lub do prawej: etykiety są wyrównane do lewej w danym obszarze. Domyślnie dla etykiet osi R.
  • 0Góra lub dół: etykiety są wyśrodkowane na znacznikach; Do lewej lub prawej: etykiety są wyśrodkowane na obszarze. Domyślnie dla etykiet osi X i T.
  • 1Góra lub dół: etykiety znajdują się po lewej stronie znaczników; Do lewej lub do prawej: etykiety są wyrównane do prawej strony w danym obszarze. Domyślnie dla etykiet osi Y.
<opt_axis_or_tick>
[Opcjonalny; nieobsługiwany w Google-o-meter] Określa, czy na tej osi mają być wyświetlane znaczniki wyboru lub linie osi. Znaczniki i linie osi są dostępne tylko dla najbardziej wewnętrznych osi (na przykład nie są obsługiwane dla zewnętrznej 2 osi X). Użyj jednej z tych wartości:
  • l (małe litery „L”) – rysuj tylko linię osi.
  • t – rysuj tylko znaczniki. Znaczniki to małe linie obok etykiet osi.
  • lt – [wartość domyślna] – narysuj linię osi i znaczniki wyboru dla wszystkich etykiet.
  • _ – (podkreślenie) Nie rysuj linii osi ani znaczników. Użyj tej wartości, jeśli chcesz ukryć linię osi.
<tick_color>
[Opcjonalny; nieobsługiwany w Google-o-meter] Kolor znacznika wyboru w formacie szesnastkowym RRGGBB. Domyślny kolor to szary.
<opt_axis_color>.
[Opcjonalny] kolor tej linii osi w formacie szesnastkowym RRGGBB. Domyślny kolor to szary.

 

Przykłady

Opis Przykład

Rozmiar i kolor czcionki są określone dla drugiej osi x (styczeń, luty, marzec).

Wykres liniowy z wartościami min., średnią i maksymalną po lewej stronie, punktami 0, 1, 2, 3 i 4 po prawej, od 0 do 100 wzdłuż osi X, a na niebiesko na niebiesko – styczeń, luty i mar.

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

Rozmiar, kolor i wyrównanie czcionki są określane dla prawej osi Y. Zostaną narysowane znaczniki wyboru, ale nie będzie rysowana linia osi.

Wykres liniowy z wartościami od 0 do 100 wzdłuż osi X, styczeń, luty, mar poniżej, od 0 do 4 na osi Y oraz czerwone znaczniki wyboru z niebieskim tekstem, po prawej stronie, z wartościami min., średnią i maksymalną.

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

Ten wykres zawiera 3 zbiory danych i pokazuje 3 zestawy etykiet osi, po 1 na serię. Każdy zestaw etykiet jest formatowany za pomocą niestandardowego ciągu formatowania zgodnie z tym opisem:

  • 0N*e,000000|
    • 0 oznacza pierwszą serię danych
    • N oznacza ciąg formatowania
    • * oznacza początek specyfikatorów formatu.
    • e oznacza zapis naukowy
    • * oznacza koniec specyfikatorów formatu.
    • 000000 oznacza czarny tekst.
  • 1N*cUSD*Mil,FF0000|
    • 1 oznacza drugą serię
    • N oznacza ciąg formatowania
    • * oznacza początek specyfikatorów formatu.
    • c oznacza znacznik waluty
    • USD określa dolara amerykańskiego jako znacznik waluty, którego należy użyć
    • * oznacza koniec specyfikatorów formatu
    • Mil jest dosłownym ciągiem znaków
    • FF0000 oznacza czerwony tekst.
  • 2N*sz2*,0000FF
    • 2 oznacza trzecią serię
    • N oznacza ciąg znaków formatowania
    • * oznacza początek specyfikatorów formatu.
    • s oznacza specyfikatory grupowania (w języku angielskim (USA) jest to przecinek co 3 zera).
    • z2 oznacza pokazanie 2 końcowych zera
    • 0000FF oznacza niebieski tekst.

Zakresy etykiet osi ustawia się za pomocą parametru chxr (axis_index, start, end, step). Jeśli nie jest skonfigurowana, domyślna wartość to 0–100.


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

Powrót do góry

Style znaczników osi chxtc

Możesz określać długie znaczniki wyboru dla konkretnych osi. Zwykle służy do przeciągania znacznika na całej długości wykresu. Aby zmienić kolor znacznika, użyj parametru chxs.

Wartości dla wielu osi powinny być rozdzielone pionową kreską (|). Wartości w serii powinny być rozdzielone przecinkami.

Składnia

chxtc=
  <axis_index_1>,<tick_length_1>,...,<tick_length_n>
    |...|
  <axis_index_m>,<tick_length_1>,...,<tick_length_n>
<axis_index>
Oś, do której to odnosi się. Indeks liczony od zera do parametru chxt. Rozdziel wartości dla różnych osi za pomocą ogranicznika kolumny.
<tick_length_1>,...,<tick_length_n>
Długość znaczników na tej osi w pikselach. Jeśli podasz 1 wartość, zostanie ona zastosowana do wszystkich wartości. Jeśli podasz więcej niż 1 wartość, znaczniki na osi będą się przełączać na liście wartości dla tej osi. Wartości dodatnie są rysowane poza obszarem wykresu i przycinane przez obramowanie wykresu. Maksymalna wartość dodatnia to 25. Wartości ujemne są rysowane wewnątrz obszaru wykresu i przycinane przez obramowanie obszaru wykresu.

 

Przykłady

Opis Przykład

Przykład użycia funkcji chxtc do tworzenia długich czerwonych znaczników. Długość znacznika wyboru przekracza szerokość obszaru wykresu, ale zostanie przycięta, aby pasowała do wykresu.

  • chxt=x,y,r,x – pokazuje lewą oś, prawą oś i 2 dolne osie.
  • chxl=2:|min|average|max|3:|Jan|Feb|Mar – tekst etykiety przypisany do „r” (po prawej stronie) i zewnętrznych osi X.
  • chxp=2,10,35,95 – pozycje etykiet własnych wzdłuż osi R (indeks=2) dla trzech etykiet.
  • chxs=2,0000dd,13,-1,t,FF0000 – style etykiet osi dla osi R: kolor tekstu, rozmiar tekstu, wyrównanie do lewej i czerwone znaczniki wyboru.
  • chxtc=1,10|2,-180 – długości znaczników osi y i r. Pierwsza wartość określa znaczniki o długości 10 pikseli poza osią. Druga wartość określa znaczniki o długości 180 pikseli na osi. Liczba ujemna oznacza, że znacznik wbija się wewnątrz osi, a znacznik jest przycięty w taki sposób, aby zmieścił się na wykresie.

Wykres liniowy z wartościami od 0 do 100 wzdłuż osi X, styczeń, luty, mar poniżej, od 0 do 4 na osi Y oraz długimi czerwonymi znacznikami z niebieskim tekstem (minimalna, średnia i maksymalna) po prawej stronie.

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

Ten wykres przedstawia zmienne długości znaczników. chxtc określa 2 wartości znaczników na osi Y (5 i 15), a znaczniki narysowane na wykresie będą się przełączać między tymi 2 wartościami.
chxt=x,y
chxtc=
  1,5,15

Powrót do góry

Tło wypełniło chf [Wszystkie wykresy]

Możesz określić kolory i style wypełnienia obszaru danych wykresu lub całego tła wykresu. Wypełnienia mogą obejmować wypełnienie Jednolite, paskowe i gradientowe. Możesz określić różne wypełnienia różnych obszarów (np. całego obszaru wykresu lub tylko obszaru danych). Wypełnienie obszaru wykresu zastępuje wypełnienie tła. Wszystkie wypełnienia są określane za pomocą parametru chf. Możesz mieszać różne typy wypełnienia (ciągłe, paski, gradienty) na tym samym wykresie, rozdzielając wartości pionową kreską ( | ). Obszar wykresu zastępuje wypełnienie tła wykresu.

Wypełnienia jednolite chf [Wszystkie wykresy]

Możesz określić jednolite wypełnienie tła lub obszaru wykresu albo przypisać wartość przezroczystości do całego wykresu. Możesz określić wiele wypełnienia za pomocą pionowej kreski (|). (Mapy: tylko w tle).

Składnia

chf=<fill_type>,s,<color>|...
<fill_type>
Wypełniana część wykresu. Określ jedną z tych wartości:
  • bg – wypełnienie tła
  • c – wypełnienie obszaru wykresu. Nieobsługiwane w przypadku wykresów mapy.
  • a – ustaw cały wykres (w tym tło) przezroczysty. Pierwsze 6 cyfr funkcji <color> jest ignorowanych, a tylko ostatnie 2 (wartość przezroczystości) są stosowane do całego wykresu i do wszystkich wypełnienia.
  • b<index> – wypełnienie słupkowe (tylko w przypadku wykresów słupkowych), Zastąp <indeks> indeksem serii słupków, aby wypełnić jednolitym kolorem. Efekt jest podobny do określania właściwości chco na wykresie słupkowym. Przykład znajdziesz w sekcji Kolory serii wykresu słupkowego.
s
Oznacza wypełnienie przezroczyste lub jednolite.
<color>
Kolor wypełnienia w formacie szesnastkowym RRGGBB. W przypadku przezroczystości pierwsze 6 cyfr jest ignorowanych, ale mimo to należy je uwzględnić.

 

Przykłady

Opis Przykład

W tym przykładzie tło wykresu jest szare (EFEFEF).

Wykres liniowy z czerwoną linią i czarnym wypełnieniem.

chf=bg,s,EFEFEF

W tym przykładzie tło wykresu jest szare (EFEFEF) i wypełnia obszar wykresu kolorem czarnym (000000).

Wykres liniowy z czerwoną linią i czarnym obszarem wykresu z bladoszarym tłem.

chf=c,s,000000|
bg,s,EFEFEF

W tym przykładzie zastosowano do całego wykresu przezroczystość wynoszącą 50% (w przypadku 80% przezroczystość w systemie szesnastkowym to 128, czyli około 50%). Zwróć uwagę, że na wykresie widać tło komórki tabeli.

Wykres rozproszony z punktami zaznaczonymi na niebiesko i przezroczystością równą 50%.

chf=a,s,00000080

Powrót do góry

Wypełnienie gradientem chf [linia, słupek, miernik Google, radar, punktowy,zamka]

Do obszarów lub tła wykresu możesz zastosować jedno lub więcej wypełnienia gradientowego. Wypełnienia gradientowe to przejścia z jednego koloru na inny. (wykresy kołowe i miernicze Google: tylko w tle).

Każde wypełnienie gradientem określa kąt, a następnie co najmniej dwa kolory zakotwiczone do określonej lokalizacji. Kolor różni się w zależności od tego, jak zmienia się jedna kotwica. Musisz mieć co najmniej 2 kolory z różnymi wartościami <color_centerpoint>, aby jeden z nich przechodził w drugi. Każdy kolejny gradient jest określany za pomocą pary <color>,<color_centerpoint>.

Składnia

chf=<fill_type>,lg,<angle>,<color_1>,<color_centerpoint_1>
    ,...,
  <color_n>,<color_centerpoint_n>
<fill_type>
Obszar wykresu do wypełnienia. Jedna z tych wartości:
  • bg – wypełnienie tła
  • c – wypełnienie obszaru wykresu.
  • b<index> – wypełnienie gradientem słupkowym (tylko wykresy słupkowe). Zastąp <index> indeksem serii słupków, które mają wypełnić gradientem. Przykład znajdziesz w sekcji Kolory serii wykresu słupkowego.
lg
Określa wypełnienie gradientowe.
<kąt>
Liczba określająca kąt gradientu od 0 (w poziomie) do 90 (w orientacji pionowej).
<color>
Kolor wypełnienia w formacie szesnastkowym RRGGBB.
<color_centerpoint>
Określa punkt zakotwiczenia koloru. Od tego momentu kolor zacznie zanikać, gdy zbliży się do innej kotwicy. Zakres wartości wynosi od 0,0 (dolna lub lewa krawędź) do 1,0 (górna lub prawa krawędź) i przechylony pod kątem określonym przez <kąt>.

 

Przykłady

Opis Przykład

Obszar wykresu zawiera poziomy gradient liniowy określony za pomocą kąta zero stopni (0).

Kolory to brzoskwiniowy (FFE7C6) wyśrodkowane po lewej stronie (pozycja 0.0) i niebieski (76A4FB) wyśrodkowane po prawej stronie (pozycja 1.0).

Tło wykresu jest zaznaczone na szaro (EFEFEF).

Ciemnoszary wykres liniowy z jasnoszarym tłem i obszarem wykresu z gradientem liniowym od lewej do niebieskiej

chf=
  c,lg,0,
  FFE7C6,0,
(brzoskwinia)
  76A4FB,1
(niebieski)

Obszar wykresu zawiera gradient liniowy po przekątnej (od lewego dolnego do prawego górnego rogu) o kątie czterdziestu pięciu stopni (45).

Brzoskwinia (FFE7C6) to pierwszy określony kolor. W lewym dolnym rogu wykresu jest czysta brzoskwinia.

Drugim określonym kolorem jest niebieski (6A4FB). Prawy górny róg wykresu jest niebieski. Zwróć uwagę na to, jak określamy przesunięcie 0,75, aby uzyskać szczytowy odcień niebieski, który zanika w kierunku prawego górnego rogu.

Tło wykresu jest zaznaczone na szaro (EFEFEF).

Ciemnoszary wykres liniowy z jasnoszarym tłem i obszarem wykresu z gradientem liniowym od lewej do niebieskiego od prawego dolnego rogu

chf=
  c,lg,45,
  FFE7C6,0,
(brzoskwinia)
  76A4FB,0.75
(niebieski)

Obszar wykresu zawiera pionowy gradient liniowy (od góry do dołu) określony za pomocą kąta 90 stopni (90).

Pierwszym z określonych kolorów jest niebieski (76A4FB). Górna część wykresu jest oznaczona kolorem niebieskim.

Brzoskwini (FFE7C6) to drugi określony kolor. Dolna część wykresu to czysta brzoskwinia.

Tło wykresu jest zaznaczone na szaro (EFEFEF).

Ciemnoszary wykres liniowy z jasnoszarym tłem i obszarem wykresu z pionowym gradientem liniowym od białym do niebieskiego od dołu do góry

chf=
  c,lg,90,
  FFE7C6,0,
(brzoskwinia)
  76A4FB,0.5
(niebieski)

Powrót do góry

 

Paski wypełnianie chf [linia, słupek, miernik Google, radar, punktowy, Venn]

Możesz określić pasiaste wypełnienie tła dla obszaru wykresu lub dla całego wykresu. (Wykresy kołowe, mierniki Google: tylko w tle).

Składnia

chf=
  <fill_type>,ls,<angle>,<color_1>,<width_1>
    ,...,
  <color_n>,<width_n>
<fill_type>
Obszar wykresu do wypełnienia. Jedna z tych wartości:
  • bg – wypełnienie tła
  • c – wypełnienie obszaru wykresu
  • b<index> – wypełnienia słupkowe w paski (tylko wykresy słupkowe). Zastąp <index> indeksem serii słupków, aby wypełnić pasami. Przykład znajdziesz w sekcji Kolory serii na wykresie słupkowym.
ls
Określa wypełnienie w liniowy pas.
<kąt>
Kąt wszystkich pasów względem osi Y. Użyj 0, by utworzyć pasy pionowe, lub 90, aby ustawić pasy poziome.
<color>
Kolor tego paska w formacie szesnastkowym RRGGBB. Powtórz wartości <color> i <width> dla każdego dodatkowego pasa. Musisz mieć przynajmniej 2 paski. Paski pojawiają się na przemian aż do wypełnienia wykresu.
<width>
Szerokość tego paska, od 0 do 1, gdzie 1 to pełna szerokość wykresu. Paski powtarzają się, aż wykres zostanie wypełniony. Powtórz wartości <color> i <width> dla każdego dodatkowego pasa. Musisz mieć przynajmniej 2 paski. Paski pojawiają się na przemian aż do wypełnienia wykresu.

 

Przykłady

Opis Przykład
  • bg,ls,0 – wypełnienie pasami tła pasami leżącymi pod kątem 0 stopni względem osi Y (równolegle do osi Y). Paski wypełniają tło wykresu oraz obszar wykresu.
  • CCCCCC,0.15 – pierwszy pasek jest ciemnoszary o szerokości 15% szerokości wykresu.
  • FFFFFF,0.1 – drugi pasek jest biały, o szerokości 10% szerokości wykresu.
Niebieski wykres liniowy z naprzemiennymi szarymi i białymi pasami od lewej do prawej
chf=
  bg,ls,0,
  CCCCCC,0.15,
  FFFFFF,0.1
  • c,ls,90 – obszar wykresu z poziomymi pasami pod kątem 90 stopni od osi Y. Paski wypełniają obszar wykresu, ale tło wykresu jest pominięte.
  • 999999,0.25 – pierwszy pasek jest ciemnoszary o szerokości 25% niż wykres.
  • CCCCCC,0.25 – taki sam jak pierwszy pasek, ale jaśniejszy szary.
  • FFFFFF,0.25 – taki sam jak pierwszy pasek, ale biały.
Niebieska wykres liniowy z ciemnoszarymi, jasnoszarymi, białymi i ciemnoszarymi pasami od dołu do góry
chf=
  c,ls,90,
  999999,0.25,
  CCCCCC,0.25,
  FFFFFF,0.25

Powrót do góry

Funkcje danych chfd [wszystkie chd wykresy]

Możesz określić funkcję niestandardową, która będzie uruchamiać dane na wykresie za pomocą składni funkcji muParser. Dane używane w funkcji mogą pochodzić z jednego z dwóch źródeł:

  • Seria danych z chd – dane są pobierane ze określonej serii w chd.
  • Zakres wartości zadeklarowanych w samym parametrze chfd – zadeklarujesz wartość rozpoczęcia, zatrzymania i kroku dla dowolnego zakresu danych.

Pamiętaj, że we wszystkich przypadkach musisz przypisać dane wyjściowe do istniejącej serii w chd. Ta seria zostanie zastąpiona danymi wyjściowymi funkcji. Wykres jest renderowany dopiero po przetworzeniu wszystkich funkcji. Jeśli więc do tej samej serii danych przypiszesz wiele funkcji do danych wyjściowych, funkcje zostaną uruchomione w podanej kolejności, ale na wykresie będą widoczne tylko dane wyjściowe z ostatniej funkcji. Pamiętaj, że możesz łączyć funkcje w łańcuchy, dzięki czemu jedna funkcja może przyjmować jako dane wejściowe ciąg znaków uzyskany przez poprzednią funkcję.

Aby przypisać kolory lub znaczniki chm do linii funkcji, przypisz kolory lub znaczniki do indeksu serii funkcji. Pamiętaj, że znaczniki są umieszczane zgodnie z danymi po modyfikacji danych przez funkcję.

Składnia

chfd=
  <output_series_index>,<function_data>,<function_string>
    |...|
  <output_series_index>,<function_data>,<function_string>
<output_series_index>
Oparty na zera indeks serii danych w komórce chd, w którym będą zapisywane dane wyjściowe funkcji. Wszystkie istniejące dane zostaną całkowicie zastąpione przez dane wyjściowe funkcji. Jeśli ciąg nie jest używany jako dane wejściowe funkcji, sprawdzoną metodą jest przypisanie do tej serii 1 przykładowej wartości.
<function_data>
Zmienne i dane do wykreślenia. Dane mogą pochodzić z określonego przez Ciebie zakresu lub z jednej z serii danych chd. Dla każdej funkcji możesz podać wiele zmiennych, używając separatora ; (średnik) dla wielu zmiennych. Pamiętaj, że jeśli dla jednej funkcji zdefiniujesz wiele zmiennych, które mają różną liczbę punktów, funkcja zatrzyma się po dotarciu do pierwszego punktu końcowego. Jeśli na przykład funkcja definiuje zarówno x=1–5, krok 1, jak i y=1–10 krok 1, kończy się po osiągnięciu piątego punktu.
    <variable_name>,<input_series_index>
        
LUB
    <variable_name>,<start>,<end>,<step>
  • variable_name – dowolny ciąg znaków dla zmiennej. Użyj go w funkcji zdefiniowanej przez function_string.
  • input_series_index – indeks serii danych chd, która ma być używana jako dane wejściowe.
  • start – liczbowa wartość początkowa zakresu.
  • koniec – liczbowa wartość końcowa zakresu.
  • step – numeryczna wartość kroku od start do end. Może być liczbą dodatnią lub ujemną, ale nie może wynosić 0.
Przykłady: x,0,100,1 deklaruje zmienną o nazwie x z wartościami 0, 1, 2, ... 100. x,0,100,1;r,0,3.1,.1 deklaruje tę samą zmienną x oraz zmienną o nazwie r z wartościami 0, 0,1, 0,2, ..., 3.0, 3.1. x,0 deklaruje zmienną o nazwie x, która korzysta z danych z pierwszej serii chd. Zostaną one użyte przez element function_string. Nie będą one widoczne na wykresie, chyba że podasz je w elemencie function_string. Im mniejsza liczba kroków, tym bardziej płynny wykres.
<function_string>
Twoja funkcja zapisana w składni muParser. Funkcja jest stosowana do zmiennych i danych określonych w zmiennej variable_data. Możesz odwoływać się tylko do zmiennych zadeklarowanych w tym zbiorze funkcji lokalnych, a nie w innym potoku parametrów chfd. Funkcje muParser podsumowania nie są obsługiwane (minimalna, maksymalna suma, średnia). WAŻNE: pamiętaj, aby w funkcjach używać %2B zamiast +.

 

Przykłady

Opis Przykład

Prosta fala sinusoidalna. Kilka uwag:

  • chd=t:-1 – do danych wykresu używamy zmiennej zastępczej, ponieważ nasze dane są zadeklarowane w parametrze chfd.
  • chco=FF0000 – dla pierwszej serii określono kolor czerwony. Mimo że nie użyjemy danych z funkcji chd, dla tej funkcji naniesionej na wykresie zostanie użyty odpowiedni kolor serii.
  • chfd=0,x,0,11,0.1,sin(x)*50%2B50 – zadeklarujemy 1 zmienną o nazwie x z wartościami z zakresu 0–11 zwiększonymi o 0,1. Przypisano go do pierwszej serii, co oznacza, że otrzyma pierwszy kolor serii (FF0000). Funkcja zastosowana do x to sin(x) * 50 + 50. Zwróć uwagę, jak kod + musi być w tej funkcji.

 

Fala sinusoidalna określona przez chfd
cht=lc
chd=t:-1
chco=FF0000
chfd=
  0,x,0,11,0.1,sin(x)*50%2B50
chxt=x,y
Ten wiersz korzysta z danych z parametru chd.
chd=t:5,10
chfd=0,x,0,x*4

Połączenie wierszy funkcyjnych i wierszy niezwiązanych z funkcją.

Zwróć uwagę na to, jak kolory są określane przez parametr koloru serii chco.

Zwróć uwagę na umiejscowienie znaczników w danych wyjściowych funkcji.Punkty danych są obliczane od start, end i step, więc jeśli zakres to 0–11 krok 0, 1, punkt 0 to 0, punkt 1 to 0, 1 itd.aż do punktu 110, który ma wartość 11.

Jedna seria z metodą chfd, a druga z danymi chd.
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

Aby zdefiniować funkcję w 2 wymiarach, użyj wykresu lxy, przypisz 2 przykładowe serie i do każdego z nich przypisz funkcję.

  • 0,x,0,10,0.1,sin(x)*50%2B50 – seria 0 (wartości osi x) zawiera zmienną o nazwie x, wartości z zakresu 0–10, krok 0.1 i funkcję sin(x)*50 + 50
  • 0,y,0,10,0.1,sin(y)*50%2B50 – seria 0 (wartości osi Y) zawiera zmienną o nazwie y, zawierającą wartości z zakresu 0–10, krok 0.1 oraz funkcję sin(x)*50 + 50
Okrąg
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

Parametr chfd pozwala wyrazić swoją kreatywność.

Kliknij te obrazy, aby je otworzyć i pobawić się nimi na placu zabaw wykresów. Daj z siebie wszystko.



Powrót do góry