Wikipedia

Wikipedia:Graphs and charts

(Redirected from Wikipedia:Graphs)
For record charts, see Wikipedia:Record charts.
For instructions on how to make a graph in Wikitext, see Help:Graph.

A graph or chart is a diagrammatical illustration of a set of data. If the graph is uploaded as an image file, it can be placed within articles just like any other image. This how-to guide describes how to create graphs using Wikipedia templates and extensions. For information on graph design and external software, see Wikipedia:How to create graphs for Wikipedia articles.

Graphs must be accurate and convey information efficiently. They should be viewable at different computer screen resolutions. Ideally, graphs will also be aesthetically pleasing.

Accuracy

edit
Main page: Wikipedia:Don't draw misleading graphs

Graphs that show a trend of data should illustrate the trend accurately in its context, rather than illustrating the trend in an exaggerated or sensationalized way. In short, don't draw misleading graphs.

Choose a type of graph that is appropriate for the data you are illustrating.

  • Cartesian coordinates
  • Pie chart — good for showing how a whole is divided up (e.g., how much money is spent on each thing in a budget)
  • Bar graph — good for showing how things compare to each other (e.g., whether foo or bar is bigger) or how it has changed (e.g., sales of foo each year)

Creating graphs for Wikipedia

edit

Using simple Wikipedia templates

edit

Timeline

edit
Main page: Wikipedia:Timeline

A variety of templates and styles are available to create timelines.

Single statistic

edit
70 / 100

{{Composition bar}} can be used to provide a single statistic. This example shows 70% (70 out of 100), but the template is flexible and can show any positive integer out of any (equal or larger) integer. The template is 100 pixels wide, so the results are rounded to 1%.

To use this, copy the above and replace the values ("70" and "100" in the middle line) with your data. The color can also be changed. If you want to present multiple statistics, you can stack multiple copies of the template inside the first cell of the table.

Pie chart

edit
  1. One (40.0%)
  2. Two (32.0%)
  3. Three (12.0%)
  4. Four (9.00%)
  5. Other (7.00%)

{{Pie chart}} is an graph-drawing template that produces a pie chart in the article. When making a pie chart, ensure that the segments are ordered by size (largest to smallest). Setting the other parameter to yes will pad the chart so that the values total to 100.

This example was created by typing the following code: 

{{Pie chart
|other = yes
|value1 = 40
|label1 = One
|value2 = 32
|label2 = Two
|value3 = 12
|label3 = Three
|value4 = 9
|label4 = Four}}

Horizontal bar graph

edit
Bar chart
edit

{{Bar chart}} is a template that displays the data as a horizontal bar chart. The width of the graph can be changed.

Women's life expectancy at birth
Country Predicted median age at death
China
71
India
60
USA
79
Indonesia
71
Brazil
67
Bar box
edit

{{Bar box}} is a template that displays the data as a horizontal bar chart. The width of the chart can be changed, but care must be taken to make sure the bars stay within the box on many browsers.

kinds of stuff pcs.
Foobar
 
 33,213
Barfoo
 
 123,123
Bazbar
 
 210,121
Barfoobaz
 
 12,854
Some stuff displayed by quantity.
Stacked bar
edit

{{Stacked bar}} is a template that displays data as a single bar of a stacked bar chart. The template supports up to 12 segments in their proportional lengths compared to a total, along with captions for each section. Care must be taken that the captions do not overlap excessively in smaller resolutions, and in many cases you may not be able to include captions if the segment(s) is too small.

Number of video game articles in the 1970s and earlier by year
<1970s
71
72
73
74
1975
1976
1977
1978
1979



Vertical bar graph

edit

Module:Chart is a Lua module that may be used to create several different types of vertical bar graphs.

A standard vertical bar graph

10
20
30
40
50
60
Before
During
After
Post mortem
  •   Apple
  •   Banana
  •   Orange


A stacked vertical bar graph

25
50
75
100
125
150
Before
During
After
Post mortem
  •   Apple
  •   Banana
  •   Orange

Brick chart

edit
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Causes of death

  Cardiovascular diseases - 29 %
  Infectious and parasitic diseases - 23 %
  Cancer - 13 %
  Respiratory disease - 7 %
  Unintentional injuries - 6 %
  Uncertain - 0.2 %
  Other - 21.8 %

{{Brick chart}} is a simple block-oriented chart template. It's also called a waffle chart and is used as an alternative to the pie chart when you want users to be able to precisely compare the size of different categories.

It assumes that everything must add up to total=100 (or specify), and fills in any missing amounts with "other". You can label (and optionally choose colors for) each item, and the labels can be wikilinks to relevant articles. Decimal amounts are supported (tiny amounts will appear as slivers).

Using the Wikimedia Chart extension (advanced)

edit

Before 2023, Wikipedia used a graph-making tool called Vega. You could use it to make charts and maps. This was disabled due to security issues, and replaced by mw:Extension:Chart.

Line charts

edit

The old {{Graph:Chart}} implementation has been disabled. You can now make line graphs with the new Chart extension. This alternative works by storing the data on Commons in a json file, and storing the plot in another Commons page with json code. An example of such a data page is Commons:Data:Autobahn network length.tab, whereas Commons:Data:Autobahn network length.Line.chart contains the information about the plot. There is a preference on Commons that enables the TabularImportExport gadget to input simple csv and Excel files. It automatically converts it into the data json files. You can add the graph on Wikipedia with the following code: 

{{Chart
| chart = Autobahn network length.Line.chart
}}
Länge in KilometernJahr03K6K9K12K15K1932195019851999200620132020ReichsautobahnBundesautobahn (West Germany)Bundesautobahn (Germany)Entwicklung der Netzlänge von Reichs- und B...
See or edit chart definition.

Area charts

edit

The procedure is the same as above, but now the data is shown as an area chart: 

{{Chart
| chart = Example.Area.chart
| caption = Some words to place under the graph
}}
%supportDate0204060801009/9/19939/26/199310/19/1993ElvesEntsOrcsHobbitsTrollsExample Area ChartExample subtitle
Some words to place under the graph See or edit chart definition.

Colors

edit

The default colors are created by Module:ChartColors. The basic 20 are:

                                                                               

If a chart plots 10 colors or fewer, then by default it uses every other one:

                                       

The colors can be manually set in a graph by adding them to the 'colors' parameter. For example, for two pie charts, the first of which is default and the second of which omits some colors in the first, you would manually enter your selections from the default 20:

colors=#1f77b4,#aec7e8,#ff7f0e,#ffbb78,#2ca02c,#98df8a,#d62728,#ff9896,#9467bd,#c5b0d5,#8c564b,#c49c94,#e377c2,#f7b6d2,#7f7f7f,#c7c7c7,#bcbd22,#dbdb8d,#17becf,#9edae5

Similarly if one chart plotted fewer than 10 colors and you wanted it to use the same colors as another that had more than 10.

See also Template:ChartColors.

Methods outside Wikipedia

edit
Main page: Wikipedia:How to create graphs for Wikipedia articles
Scalable Vector Graphics (SVG) is the recommended format.

See also

edit
Retrieved from "https://en.wikipedia.org/w/index.php?title=Wikipedia:Graphs_and_charts&oldid=1307124463"