Ŝablono:Tortdiagramo/dokumentado
Ĉi tio estas ŝablono, kiu desegnas tortdiagramojn uzante ununuran bildon, multe da (enlinia) CSS-kodo generita de analizilaj funkcioj, kaj absolute neniun Ĝavaskripton. Kelkaj detaloj pri ĝia funkciado troviĝas malsupre.
Uzado
[redakti fonton]Oni povas specifi la etikedojn, valorojn kaj kolorojn de ĝis 30 tranĉaĵoj. Ĉiuj parametroj por ses tranĉaĵoj estas inkluzivitaj sube; por inkluzivi pli da tranĉaĵoj, kopiu la kodon por unu el la aliaj, ŝanĝante la ciferon ĉe la fino de ĉiu parametro-nomo.
{{Tortdiagramo
| vicigo =
| radiuso =
| apudskribo=
| piednoto =
| etikedo1 =
| value1 =
| koloro1 =
| etikedo2 =
| value2 =
| koloro2 =
| etikedo3 =
| value3 =
| koloro3 =
| etikedo4 =
| value4 =
| koloro4 =
| etikedo5 =
| value5 =
| koloro5 =
| etikedo6 =
| value6 =
| koloro6 =
| ceteraj =
| ceteraj-koloro =
}}
Parametroj
[redakti fonton]Defaŭltaj koloroj
|vicigo=specifas al kiu flanko de la paĝo la diagramo estas flosita (defaŭltedekstre, sed oni povas specifinenio,maldekstreaŭcentre), simile al bilddosieroj. Por ke la diagramo aperu sur la maldekstra flanko de la paĝo, specifu|vicigo=maldekstre.|radiuso=specifas la radiuson de la tortdiagramo en bilderoj. Ne enmetu sufikson «px». Ĝi estas 100 defaŭlte.|apudskribo=specifas ĉenon de teksto kiu aperas sur linio tuj antaŭ la klarigeto.|piednoto=specifas ĉenon de teksto kiu aperas sub la klarigeto.|ceteraj=, kiam agordita egala al iu ajn videbla ĉeno (eĉ "0" aŭ "ne"), ero nome «Ceteraj» ero aperas en la klarigeto, rilate al la lasta tranĉaĵo, kiu igas la valorojn sumiĝi al 100. (Se la totalo jam estis 100, tiam la procento «Ceteraj» estos negativa.)|ceteraj-koloro=povas esti uzata por anstataŭi la defaŭltan blankan koloron de la tranĉaĵo «Ceteraj».- Ĉiu
|etikedoN=estas ĉeno de teksto kiu aperas en la klarigeta eniro por tranĉaĵo. Se oni preterlasas ĝin, la klarigeta eniro ne estas montrota por tiu tranĉaĵo. - Ĉiu
|valoroN=estas la procento kiun la tranĉaĵo reprezentas. Bonvolu ne inkluzivi la procentan signon «%» (ekz., por okdek procentoj, uzu la valoron «80», ne uzu «80%» aŭ «.80»). Kolektive, la valoroj endas sumiĝi al 100 aŭ malpli (en ĉi-lasta kazo, lasta tranĉaĵo kompletigas la torton, ĉu|ceteraj=estas specifita aŭ ne). Rimarku ankaŭ, ke ĉiu valoro estas montrita en la legendo ekzakte kiel skribite, sen ia rondigo aŭ alia reformatiĝo. - Ĉiu
|koloroN=estas CSS-kolorkodo aŭ nomo (en la angla). Kiam ne specifitaj, la uzotaj koloroj estas la defaŭtaj. Se vi bezonas grafiki pli ol 14 valorojn (sen kalkuli la kroman tranĉaĵon «Ceteraj»), tiam vi devus specifi|koloro15=pluen en la ŝablonvoko.
Limigoj
[redakti fonton]- Google Chrome kaj Safari ne ŝajnas uzi glatigajn ilojn, do la linioj povus aperi kun kelkaj «dentoj». (Por Chrome, ĉi tiu problemo ŝajnas esti solvita, ekde versio 26.)
- Pro la realiga metodo de la grafikaĵo, ne eblas konservi kopion de la diagramo uzante la funkcion «Konservi bildon» de la retumilo (tamen oni povas preni ekrankopion).
- Se
|ceteraj=estas agordita, la fina tranĉaĵo ĉiam estas etikedita kiel «Ceteraj» en la klarigeto. Ĉi tiu eco ne estas modifabla. Se vi ne ŝatas tion, simple aldonu al la ŝablono-voko alian tranĉaĵon kun la taŭga valoro (kiu sumiĝas al 100) kaj la dezirata etikedo, kaj ne uzu|ceteraj=. - Neniuj etikedoj povas esti metitaj sur la tranĉaĵoj mem.
- La maksimuma nombro de tranĉaĵoj videblaj estas 30.
- Nuntempe la defaŭltaj koloroj uzataj por la tranĉaĵoj ekde 15 kaj pluen samas kiel la defaŭlta koloro de tranĉaĵo 14.
- Se la specifitaj valoroj sumiĝas al 100 kaj
|ceteraj=estas agordita, la kalkulita procento por tiu tranĉaĵo foje povas montriĝi tre stranga (ekz., «1.4210854715202E-14%» anstataŭ ol «0%»)
Ekzemploj
[redakti fonton]La jena kodo generas la tortan diagramon montrita dekstre. Notu, ke ĝi uzu la defaŭltan diagraman grandon kaj kolorojn; notu ankaŭ, ke la valoro «1» por la parametro |ceteraj= ne indikas grandon, sed estas uzata nur por ĝia «valoro de vero» kiel videbla ĉeno — t.e., por diri, jes!, ni volas la enskribon «Ceteraj» en la klarigeto (fakte, la diagramo ne ŝanĝiĝus, se oni uzas la valoron «0» tie).
{{Tortdiagramo
|valoro1 = 42
|etikedo1 = One
|valoro2 = 32
|etikedo2 = Two
|valoro3 = 12
|etikedo3 = Three
|valoro4 = 3
|etikedo4 = Four
|valoro5 = 2
|etikedo5 = Five
|valoro6 = 1
|etikedo6 = Six
|ceteraj = 1
}}
Jen pli verŝajna ekzemplo:
{{Tortdiagramo
| etikedo1 = [[Urdua]] lingvo
| etikedo2 = [[Paŝtuna]] lingvo
| etikedo3 = [[Panĝaba]] lingvo
| etikedo4 = [[Sinda]] lingvo
| etikedo5 = [[Saraika lingvo|Saraika]] lingvo
| etikedo6 = [[Baluĉa]] lingvo
| koloro1 = green | koloro2 = orange | koloro3 = skyblue
| koloro4 = red
| koloro5 = #08f
| koloro6 = gold
| ceteraj-koloro = pink
| valoro1 = 42.30
| valoro2 = 15.01
| valoro3 = 10.73
| valoro4 = 10.67
| valoro5 = 4.98
| valoro6 = 4.04
| ceteraj = 1
| apudskribo= Lingvoj en [[Karaĉio]]
| piednoto = Fonto: ...
}}
Kiel ĝi funkcias
[redakti fonton]Ĉi tiu ŝablono uzas teĥnikon por desegni diagonalajn liniojn en CSS uzante la fakton, ke limoj metitaj sur elementoj estas miter joined. Tiel, eblas doni al bordero maldiafanan koloron, kun la aliaj plene travideblaj, por formi diagonalan linion. La angulo de la linio povas esti kontrolita ĝustigante la larĝojn de du apudaj limoj (unu el ili maldiafana) rilate unu al la alia.
Tortaj tranĉaĵoj estas desegnitaj en dekstruma ordo en maldekstruma direkto. Ĉi tiuj tranĉaĵoj estas poziciigitaj:
- Ene de kvadrata elemento de (2 * radiuso)x(2 * radiuso) pikseloj
- kun
border-radius: radiuspxpor igi cirklan formon - kun blanka (aŭ alia specifita koloro) fono videbla en la malplena spaco kiu okazas se la tranĉaĵo «ceteraj» ĉeestas
- kaj kun
overflow: hidden;agordita.
Ĉi tio simple permesas al la parto de ĉiu tranĉaĵo kiu estas ene de la cirklo estu videbla sur la paĝo.
Plejparto de la kodo en {{Tortdiagramo/Tranĉaĵo}} estas dividita en kvin sekcioj, la unuaj kvar prirespondaj pri la kvadrantoj de la cirklo kaj la lasta simple por pritrakti la kazon en kiu unu tranĉaĵo okupas 100% de la diagramo.