https://wikitest.nl/index.php?action=history&feed=atom&title=Module%3AGraph%2FdocModule:Graph/doc - Bewerkingsoverzicht2026-04-17T11:15:31ZBewerkingsoverzicht voor deze pagina op de wikiMediaWiki 1.43.6https://wikitest.nl/index.php?title=Module:Graph/doc&diff=76354&oldid=prevColani: 1 versie geïmporteerd2024-03-23T16:39:55Z<p>1 versie geïmporteerd</p>
<p><b>Nieuwe pagina</b></p><div>{{#if:{{{1|}}}||<!-- Parts not to be transcluded from the wrapper templates --><br />
<!-- Please place categories where indicated at the bottom of this page and interwikis at Wikidata (see [[Wikipedia:Wikidata]]) --><br />
Module with helper functions for the [[:en:Help:Graph|Graph]] extension to display graphs and maps. From [[:de:Modul:Graph]].<br />
<br />
== Functions for templates ==<br />
=== <code>chart</code> ===<br />
Creates a JSON object for <code><nowiki><graph></nowiki></code> to display charts. In the article namespace the template {{tl|GraphChart}} should be used instead. See its page for use cases.<br />
<br />
'''Parameters:'''<br />
}}{{#ifeq:{{{1|chart}}}|chart|<!-- Parts to be transcluded from the wrapper Template:Graph:Chart --><br />
;colors: kleurenpallet van de grafiek, een lijst van kleuren door komma's gescheiden. De kleuren kunnen zijn: <code>#rgb</code>/<code>#rrggbb</code>/<code>#aarrggbb</code> of een [[:en:Web colors#X11 colour names|Engelse CSS kleurennaam]]. Bij <code>#aarrggbb</code> geeft de <code>aa</code> het [[:en:alpha channel|alpha channel]] aan, bijvoorbeeld FF=100% doorzichtig, 80=50% doorzichtig, etc.<br />
;hAnnotatonsLabel: toon horizontale annotatielabels bij annotatielijnen, bijvoorbeeld <code>hAnnotatonsLabel = label1, label2, label3</code><br />
;hAnnotatonsLine: toon horizontale annotatielijnen bij specifieke waarden, bijvoorbeeld <code>hAnnotatonsLine=4, 5, 6</code><br />
;height: hoogte van de grafiek in pixels, bij de meeste grafieken de hoogte van de Y-as<br />
;innerRadius: Alleen geldig voor een [[Cirkeldiagram|taartdiagram]], de binnenste [[Straal_(wiskunde)|straal]] in pixels om een ''[[donut]] diagram'' te maken.<br />
;interpolate: [[Interpolatie]] methode voor lijn- en vlakdiagrammen. <code>monotone</code> is aanbevolen voor een [[:en:monotone cubic interpolation|monotone cubic interpolation]]. Op https://github.com/nyurik/vega/wiki/Marks#line staan de andere ondersteunde interpolatiemethoden.<br />
;legend: Toon [[Legenda|legenda/legende]]. Dit werkt alleen bij meerdere datareeksen.<br />
;linewidth: Voor een lijndiagram: de dikte van de lijnen, een lijndikte van 0 resulteert in een [[Sjabloon:Graph:Chart#Spreidingsdiagram|spreidingsdiagram]]. Voor een taartdiagram: de ruimte tussen de taartpunten.<br />
;linewidths: Voor verschillende lijndiktes per datareeks. Een lijndikte van 0 in combinatie met "showSymbols" laat die lijn weg, toont slechts de punten, bijvoorbeeld <code>linewidths=1, 0, 5, 0.2</code><br />
;showSymbols{{Anker|showSymbols}}: voor lijngrafieken: toon een symbool op data punten. Een getal geeft de symboolgrootte aan in pixels, bijvoorbeeld <code>showSymbols=3</code>. <code>showSymbols=</code> geeft punten met een standaardgrootte van 2.5 pixel. Verschillende groottes zijn mogelijk per datareeks: <code>showSymbols=1, 2, 3, 4</code><br />
;showValues: Voor een taartdiagram en een ongestapeld staafdiagram: Toon y waarden als tekst in de grafiek. De volgende parameters, gescheiden door komma's, definiëren hoe de tekst er uit ziet, bijvoorbeeld <code>showValues = fontcolor:silver, fontsize:10, offset:10</code>.<br />
:* '''format''': Formatteer numerieken zoals op https://github.com/d3/d3-3.x-api-reference/blob/master/Formatting.md#numbers en datum/tijd zoals op https://github.com/d3/d3-3.x-api-reference/blob/master/Time-Formatting.md .<br />
:* '''fontcolor''': de kleur van de tekst<br />
:* '''fontsize''': de grootte van de tekst<br />
:* '''offset''': verplaats de tekst. Voor een staafdiagram en een taartdiagram met <code>midangle</code> definieert dit of de tekst binnen of buiten het diagram valt.<br />
:* '''angle''' voor taartdiagrammen: de hoek in graden, gebaseerd op de mid-angle van de taartpunt. <code>midangle</code> is de standaardwaarde.<br />
;symbolsNoFill: <code>symbolsNoFill =</code> vul het symbool niet, tekent alleen de omtrek.<br />
;symbolsShape: de vorm van het symbool, mogelijke waarden: circle, x, square, cross, diamond, triangle_up, triangle_down, triangle_right, triangle_left. Elke data reeks kan een eigen symbool krijgen, gebruik door komma's gescheiden waarden, bijvoorbeeld: <code>symbolsShape= circle, cross, square</code><br />
;symbolsStroke: Voor "x" symbol en "symbolsNoFill": de dikte van de lijn in pixels, standaard waarde is 2.5.<br />
;type: het soort diagram: <br />
:*<code>area</code>, [[Vlakdiagram]]<br />
:*<code>line</code>, [[Lijndiagram]] of [[Spreidingsdiagram]]<br />
:*<code>pie</code>, [[Cirkeldiagram|taartdiagram]] <br />
:*<code>rect</code>, [[Staafdiagram]]<br />
:*<code>stackedarea</code>, [[Sjabloon:Graph:Chart#Gestapeld_Staafdiagram|Gestapeld Vlakdiagram]]<br />
:*<code>stackedrect</code>, [[Sjabloon:Graph:Chart#Gestapeld_Staafdiagram|Gestapeld Staafdiagram]]<br />
;vAnnotatonsLabel: toon verticale annotatielabels bij annotatielijnen, bijvoorbeeld <code>vAnnotatonsLabel = label1, label2, label3</code><br />
;vAnnotatonsLine: toon verticale annotatielijnen bij specifieke waardes, bijvoorbeeld <code>vAnnotatonsLine=4, 5, 6</code><br />
;width: breedte van de grafiek in pixels, bij de meeste grafieken de lengte van de x-as<br />
<br />
<br />
;x: de x-waarden, gescheiden door komma's, <code>x=a,b,c</code><br />
;xAxisAngle: draaiing van de x-as labels in graden, aanbevolen waarden: -45, +45, -90, +90<br />
;xAxisFormat{{Anker|xAxisFormat}}: Formatteer de labels op de x-as. <br />
:Voor de formattering van numerieken zie https://github.com/d3/d3-3.x-api-reference/blob/master/Formatting.md#numbers, bijvoorbeeld<br />
:*<code>xAxisFormat=%</code> voor percentages, -0.1=-10%, 0=0%, .25=25%, 1=100%, 1.5=150%. xAxisFormat=.1% geeft percentages met 1 cijfer achter de 'komma'.<br />
:*<code>xAxisFormat=03</code> alles 3 lang, met voorloopnullen<br />
:*<code>xAxisFormat=.2f</code> 2 cijfers achter de 'komma'<br />
:*<code>xAxisFormat=d</code> geheel getal<br />
:Noot: Het is nog niet mogelijk om getallen [[Decimaal_talstelsel#Getallen|'Europees']] te formatteren als 583.231.475.923,00 <br />
:Zie https://github.com/d3/d3-3.x-api-reference/blob/master/Time-Formatting.md voor datum/tijd. <br />
;xAxisMin, '''xAxisMax''': voor lijn, spreidings en vlakdiagrammen: minimum en maximum waarden van de x-as. Met deze parameters kan x-as gespiegeld worden door min en max om te draaien. Zet de Max op de laagste waarde, de min op de hoogste.<br />
;xAxisTitle: Beschrijving van de variabele op de x-as<br />
;xGrid: toon verticale rasterlijnen voor x-as waarden.<br />
;xScaleType{{Anker|xScaleType}}: het soort van schaal van de x-as.<br />
:*<code>linear</code>: lineaire schaal, de standaard<br />
:*<code>log</code> [[logaritmische schaal]]<br />
:*<code>sqrt</code> [[vierkantswortel-schaal]]<br />
;xType: datatype van x-as waarden. <br />
:*<code>date</code>: datums, bijvoorbeeld 2021/02/14<br />
:*<code>integer</code>: [[Integer_(informatica)|geheel getal]]<br />
:*<code>number</code>: [[Zwevendekommagetal|getal met cijfers achter de komma]]<br />
:*<code>string</code>: tekst. Als er maar een paar waardes zijn, gebruik dan <code>xType=string</code> om herhaling van x-as waarden te voorkomen.<br />
<br />
<br />
;y: De y waarden van een enkele datareeks, gescheiden door komma's, bijvoorbeeld <code>y=1,2,4,9</code><br />
;y1, y2, …: de y-waarden van meerdere datareeksen, bijvoorbeeld <code>y1=1,2,4,9</code>, <code>y2=1,8,32,27</code>. Bij een taartdiagram geeft <code>y2</code> de straal van de taartpunten.<br />
;yAxisFormat: formatteer de labels op de y-as, de toegestane waarden zijn hetzelfde als bij [[#xAxisFormat|xAxisFormat]].<br />
;yAxisMin, and yAxisMax: voor lijn, spreidings en vlakdiagrammen: minimum en maximum waarden van de y-as. Met deze parameters kan y-as ondersteboven gezet worden door min en max om te draaien. Zet de Max op de laagste waarde, de min op de hoogste.<br />
;yAxisTitle: beschrijving van de variabele op de y-as<br />
;yGrid: toon horizontale rasterlijnen voor y-as waarden.<br />
;yScaleType: het soort van schaal op de y-as. Zie [[#xScaleType|xScaleType]] voor mogelijke schalen.<br />
;yType: data type van y-as waarden, <br />
:*<code>date</code>: datums, bijvoorbeeld 2021/02/14<br />
:*<code>integer</code>: [[Integer_(informatica)|geheel getal]]<br />
:*<code>number</code>: [[Zwevendekommagetal|getal met cijfers achter de komma]]<br />
:*<code>string</code>: tekst, alleen mogelijk bij een lijndiagram.<br />
;y1Title, y2Title, …: beschrijving van de datareeksen in de legenda/legende.<br />
<br />
}}{{#if:{{{1|}}}||<br />
;formatjson: format JSON object for better legibility<br />
<br />
=== Template wrappers ===<br />
The functions <code>mapWrapper</code> and <code>chartWrapper</code> are wrappers to pass all parameters of the calling template to the respective <code>map</code> and <code>chart</code> functions.<br />
}}<br />
<br />
'''Opmerking:''' In de voorvertoning bij het bewerken is de grafiek een [[:en:canvas element|canvas element]], een [[Vectorafbeelding]]. Echter, na publiceren van de pagina wordt de grafiek een [[Portable_network_graphics|PNG bestand]].<br />
{{#if:{{{1|}}}||<!-- Parts not to be transcluded from the wrapper templates --><br />
<nowiki>{{</nowiki>#invoke:{{BASEPAGENAME}}{{!}}''function_wrapper_name''<nowiki>}}</nowiki><br />
}}<br />
<br />
{{#ifeq:{{PAGENAME}}|{{ROOTPAGENAME}}|{{#ifeq:{{NAMESPACE}}|Module|[[Categorie:Wikipedia:Modules]]}}}}</div>Colani