Content deleted Content added
Fix bad link |
fix docs |
||
| (48 intermediate revisions by 33 users not shown) | |||
Line 1:
{{#if:{{{1|}}}||<!-- Parts not to be transcluded from the wrapper templates -->
{{High-use}}
{{Module rating |
{{Lua sidebar}}
<!-- Please place categories where indicated at the bottom of this page and interwikis at Wikidata (see [[Wikipedia:Wikidata]]) -->
Module with helper functions for the [[Help:Graph|Graph]] extension to display graphs and maps. From [[:de:Modul:Graph]].
== Functions for templates ==
=== <
Creates a JSON object for <
Maps can be found at [[Special:Prefixindex/
'''Parameters:'''
}}{{#ifeq:{{{1|map}}}|map|<!-- Parts to be transcluded from the wrapper Template:Graph:Map -->
* '''basemap:'''
* '''scale:'''
* '''projection:'''
* '''center:''' map center (corresponds in the map data to both comma-separated values of the <code>scale</code> field)
* ids of geographic entities: The actual parameter names depend on the base map. For example, for the above mentioned world map the ids are [[ISO country codes]]. The values can be either colors or numbers in case the geographic entities should be associated with numeric data: <tt>DE=lightblue</tt> marks Germany in light blue color, and <tt>DE=80.6</tt> assigns Germany the value 80.6 (population in millions). In the latter case, the actual color depends on the following parameters.▼
* '''feature:''' which geographic objects should be displayed (corresponds in the map data to the name of the field under the <code>objects</code> field). The default is value <code>countries</code>.
** '''colorScale''': the color palette to use for the color scale. The palette must be provided as a comma-separated list of color values. The color values must be given either as <tt>#rgb</tt>/<tt>#rrggbb</tt> or by a [[Web colors#X11 colour names|CSS color name]]. Instead of a list, the built-in color palettes [https://github.com/mbostock/d3/wiki/Ordinal-Scales#categorical-colors <tt>category10</tt> and <tt>category20</tt>] can also be used.▼
▲* '''ids of geographic entities''': The actual parameter names depend on the base map and the selected feature. For example, for the above mentioned world map the ids are [[:en:ISO country codes|ISO country codes]]. The values can be either colors or numbers in case the geographic entities should be associated with numeric data: <
** '''scaleType''': supported values are <tt>linear</tt> for a linear mapping between the data values and the color scale, <tt>log</tt> for a log mapping, <tt>pow</tt> for a power mapping (the exponent can be provided as <tt>pow 0.5</tt>), <tt>sqrt</tt> for a square-root mapping, and <tt>quantize</tt> for a quantized scale, i.e. the data is grouped in as many classes as the color palette has colors.▼
▲
** '''domainMin''': lower boundary of the data values, i.e. smaller data values are mapped to the lower boundary▼
▲
** '''domainMax''': upper boundary of the data values, i.e. larger data values are mapped to the upper boundary▼
▲
** '''legend''': show color legend (does not work with <tt>quantize</tt>)▼
▲
* '''defaultValue''': default value for unused geographic entities. In case the id values are colors the default value is <tt>silver</tt>, in case of numbers it is 0.▼
▲* '''defaultValue:'''
}}{{#if:{{{1|}}}||
* '''formatjson:'''
* '''title''': The title of the graph, used by [[User:GraphBot]] when converting.
* '''name''': The name of the graph, required by [[User:GraphBot]] to convert the graph.
=== <code>chart</code> === Creates a JSON object for < '''Parameters:'''
Line 31 ⟶ 38:
* '''width''': width of the chart
* '''height''': height of the chart
* '''type''': type of the chart: <
* '''interpolate''': [[:en:interpolation|interpolation]] method for line and area charts. It is recommended to use <
* '''colors''': color palette of the chart as a comma-separated list of colors. The color values must be given either as <
* '''xAxisTitle''' and '''yAxisTitle''': captions of the x and y axes
* '''xAxisMin''', '''xAxisMax''', '''yAxisMin''', and '''yAxisMax''': minimum and maximum values of the x and y axes (not yet supported for bar charts). These parameters can be used to invert the scale of a numeric axis by setting the lowest value to the Max and highest value to the Min.
* '''xAxisFormat''' and '''yAxisFormat''': changes the formatting of the axis labels. Supported values are listed at https://github.com
* '''xAxisAngle''': rotates the x axis labels by the specified angle. Recommended values are: -45, +45, -90, +90
* '''xType''' and '''yType''': data types of the values, e.g. <code>integer</code> for integers, <code>number</code> for real numbers, <code>date</code> for dates (e.g. YYYY-MM-DD), and <code>string</code> for ordinal values (use <code>string</code> to prevent axis values from being repeated when there are only a few values). Remarks: <code>Date</code> type doesn't work for bar graphs. For <code>date</code> data input please use ISO date format (e.g. YYYY-MM-DD) acc. to [https://developer.mozilla.org/en-US/docs/Web/HTML/Date_and_time_formats date and time formats used in HTML]. Other date formats may work but not in all browsers. Date is unfortunately displayed only in en-US format for all Wikipedia languages. Workaround is to use '''xAxisFormat''' and '''yAxisFormat''' with numerical dates format.
* '''x''': the x-values as a comma-separated list▼
* '''xScaleType''' and '''yScaleType''': scale types of the x and y axes, e.g. <code>linear</code> for linear scale (default), <code>log</code> for logarithmic scale and <code>sqrt</code> for square root scale.
* '''y''' or '''y1''', '''y2''', …: the y-values for one or several data series, respectively. For pie charts <tt>y2</tt> denotes the radiuses of the corresponding sectors.▼
*:A logarithmic chart allows only positive values to be plotted. A square root scale chart cannot show negative values.
▲* '''x''': the x-values as a comma-separated list, for dates and time see remark in '''xType''' and '''yType'''
▲* '''y''' or '''y1''', '''y2''', …: the y-values for one or several data series, respectively. For pie charts <
* '''legend''': show legend (only works in case of multiple data series)
* '''y1Title''', '''y2Title''', …: defines the label of the respective data series in the legend
* '''linewidth''': line width for line charts or distance between the pie segments for pie charts. Setting to 0 with <code>type=line</code> creates a scatter plot.
* '''linewidths''': different line widths may be defined for each series of data with csv, if set to 0 with "showSymbols" results with points graph, eg.: <code>linewidths=1, 0, 5, 0.2</code>
* '''showValues''': Additionally, output the y values as text. (Currently, only (non-stacked) bar and pie charts are supported.) The output can be configured used the following parameters provided as <tt>name1:value1, name2:value2</tt>:▼
* '''showSymbols''': show symbol on data point for line graphs, if a number is provided, the symbol size (default 2.5) may be defined for each data series, eg.: <code>showSymbols=1, 2, 3, 4</code>
** '''format''': Format the output according to //github.com/mbostock/d3/wiki/Formatting#numbers for numbers and //github.com/mbostock/d3/wiki/Time-Formatting for date/time.▼
* '''symbolsShape''': custom shape for symbol: circle, x, square, cross, diamond, triangle_up, triangle_down, triangle_right, triangle_left. May be defined for each series of data with csv, eg.: <code>symbolsShape= circle, cross, square</code>
* '''symbolsNoFill''': if true symbol will be without fill (only stroke),
* '''symbolsStroke''': if "x" symbol is used or option "symbolsNoFill" symbol stroke width, default 2.5
▲* '''showValues''': Additionally, output the y values as text. (Currently, only (non-stacked) bar and pie charts are supported.) The output can be configured used the following parameters provided as <
▲** '''format''': Format the output according to https://github.com/
** '''fontcolor''': text color
** '''fontsize''': text size
** '''offset''': move text by the given offset. For bar charts and pie charts with <
** '''angle''' (pie charts only): text angle in degrees or <
* '''innerRadius''': For pie charts: defines the inner radius to create a ''doughnut chart''.
* '''xGrid''' and '''yGrid''': display grid lines on the x and y axes.
* '''Annotations'''
** '''vAnnotatonsLine''' and '''hAnnotatonsLine''': display vertical or horizontal annotation lines on specific values e.g. <code>hAnnotatonsLine=4, 5, 6</code>
** '''vAnnotatonsLabel''' and '''hAnnotatonsLabel''': display vertical or horizontal annotation labels for lines e.g. <code>hAnnotatonsLabel = label1, label2, label3</code>
}}{{#if:{{{1|}}}||
* '''formatjson''': format JSON object for better legibility
* '''title''': The title of the graph, used by [[User:GraphBot]] when converting.
* '''name''': The name of the graph, required by [[User:GraphBot]] to convert the graph.
=== Template wrappers ===
The functions <
}}
'''Note:''' In the editor preview the graph extension creates a [[canvas element]] with vector graphics. However, when saving the page a [[Portable Network Graphics|PNG]] raster graphics is generated instead.
{{#if:{{{1|}}}||<!-- Parts not to be transcluded from the wrapper templates -->
<nowiki>{{</nowiki>#invoke:{{BASEPAGENAME}}
}}
{{#ifeq:{{{nocat}}}|yes||
<includeonly>{{#ifeq:{{SUBPAGENAME}}|sandbox | |
<!-- Categories below this line, please; interwikis at Wikidata -->
[[Category:Graph Template Collection]]
}}</includeonly>
}}<noinclude>
[[Category:Module documentation pages]]
</noinclude>
| |||