[go: up one dir, main page]
More Web Proxy on the site http://driver.im/Przejdź do zawartości

Szablon:Piechart

Z Wikipedii, wolnej encyklopedii
 Dokumentacja szablonu [zobacz] [edytuj] [historia] [odśwież]

Użycie

[edytuj kod]

Smooth piechart – wykresy kołowe z gładkimi liniami. Obsługuje w zasadzie dowolną liczbę wartości.

1
JSON z danymi wykresu (patrz przykłady).
meta
Dodatkowe metadane (opcje). Również w formacie JSON (patrz przykłady).

Przykład

[edytuj kod]

Minimalistyczne

[edytuj kod]

Zwróć uwagę, że drugiej wartości nie trzeba podawać, bo jest wyliczana (zakładamy że sumują się do 100).

<templatestyles src="Piechart/style.css"/>
{{#invoke:Piechart|pie| [ {"value":33.3},  {} ] }}

ALBO

{{Piechart| [ {"value":33.3},  {} ] }}

Wersja z etykietami

[edytuj kod]

Dodane etykiety (label) oraz legenda (w meta).

{{Piechart| [
 {"label": "kobiet: $v", "value": 33.3}, 
 {"label": "mężczyzn: $v"}
]
| meta = {"legend":true}
}}
  1. kobiet: 33,3%
  2. mężczyzn: 66,7%

Automatyczne skalowanie

[edytuj kod]

W wypadku gdzie nie masz obliczonych procentów możesz użyć automatycznego skalowania. Musisz jedynie podać obie wartości w tym wypadku.

{{Piechart| [
 {"label": "kobiet: $v", "value": 750}, 
 {"label": "mężczyzn: $v", "value": 250}
]
| meta = {"legend":true}
}}
  1. kobiet: 750 (75,0%)
  2. mężczyzn: 250 (25,0%)

Wiele wartości

[edytuj kod]

Moduł umożliwia wyświetlenie wielu wartości, nie tylko 2.

{{Piechart| [
 {"label": "ciastka: $v", "value": 2, "color":"goldenrod"},
 {"label": "napoje: $v", "value": 1, "color":"#ccf"},
 {"label": "słodycze: $v", "value": 5, "color":"darkred"},
 {"label": "kanapki: $v", "value": 3, "color":"wheat"}
]
|meta={"autoscale":true, "legend":true}
}}
  1. ciastka: 2 (18,2%)
  2. napoje: 1 (9,1%)
  3. słodycze: 5 (45,5%)
  4. kanapki: 3 (27,3%)

Zwróć uwagę, że w tym wypadku konieczne było podanie dodatkowej opcji "autoscale":true. Jest to konieczne gdy suma liczba jest mniejsza niż 100.

Legenda i jej położenie

[edytuj kod]

Legendę dodajemy za pomocą meta-właściwości legend jak widać. Można jednak również zmienić kolejność za pomocą direction (z ang. „kierunek”). Możliwe wartości to:

  • row (domyślne) – kolejność to lista, wykres;
  • row-reverse – kolejność odwrotna, czyli: wykres, lista;
  • column – ułożenie kolumnowe (w pionie).
  • column-reverse – ułożenie kolumnowe, odwrócone (wykres na górze).
{{Piechart| [
 {"label": "ciastka: $v", "value": 2, "color":"goldenrod"},
 {"label": "napoje: $v", "value": 1, "color":"#ccf"},
 {"label": "słodycze: $v", "value": 5, "color":"darkred"},
 {"label": "kanapki: $v", "value": 3, "color":"wheat"}
]
|meta={"autoscale":true, "legend":true, "direction":"row-reverse"}
}}

row (domyślny direction)

  1. ciastka: 2 (18,2%)
  2. napoje: 1 (9,1%)
  3. słodycze: 5 (45,5%)
  4. kanapki: 3 (27,3%)

row-reverse

  1. ciastka: 2 (18,2%)
  2. napoje: 1 (9,1%)
  3. słodycze: 5 (45,5%)
  4. kanapki: 3 (27,3%)

column

  1. ciastka: 2 (18,2%)
  2. napoje: 1 (9,1%)
  3. słodycze: 5 (45,5%)
  4. kanapki: 3 (27,3%)

column-reverse

  1. ciastka: 2 (18,2%)
  2. napoje: 1 (9,1%)
  3. słodycze: 5 (45,5%)
  4. kanapki: 3 (27,3%)

Zielonkawe ramki dodane dla czytelności przykładów. Normalnie nie są dodawane.

Błędy

[edytuj kod]

Błędy należy zgłaszać na stronie Wikipedia:Kawiarenka/Kwestie techniczne.

Zobacz też

[edytuj kod]

Testowe:

Inne implementacje:


Powyższy opis jest dołączany ze strony [[ Moduł:Piechart/opis

]]. (edytuj | historia)
Edytorzy mogą eksperymentować na stronach testowych (edytuj) tego szablonu.

Zobacz podstrony tego szablonu.