Template talk:Graph:Chart/Archive 1

Archive 1

Archive 2

Archive 3

Archive 4

MediaWiki

Would anyone be interested in moving all these graphs to MediaWiki, somewhere at mw:Extension:Graph/Guide ? We could set up some bots to keep those templates autosynced from there. --Yurik (talk) 18:08, 12 June 2015 (UTC)

Category labels for x values

I've been experimenting with using this template to draw the graph at Government spending in the United Kingdom. The main problem is the x-axis labels. The data is split into financial years 2013-14, 2014-15 etc. It would be nice to use these as the labels along the x-axis. I suspect this feature would be very useful for the bar-chart where the categories are non numerical. --Salix alba (talk): 10:51, 14 December 2015 (UTC)

Hi, the new version of this template now supports non-numerical (ordinal) x values. --Mps (talk) 13:40, 10 January 2016 (UTC)

showValue

Is it possible that someone adds numerical value above (like here)? Jacobo Vásquez  talk  17:19, 25 October 2015 (UTC)

There is the showValues for bar and pie charts (e.g.: |showValues=fontcolor:Black,offset:-12) but it unfortunately does only work in preview mode ; values are not printed on the generated image file. Maybe a bug or a missing functionality...--ContributorQ (talk) 11:47, 28 March 2016 (UTC)

x axis limits with dates

@JohnBlackburne: Since your advice was excellent previously, do you have any advice on getting the X-axis limits to work on these templates would be much appreciated!

• Template:Wikipedia_editor_graph
• Template:Wikipedia_article_graph

Thanks in advance! T.Shafee(Evo&Evo)^talk 04:52, 22 October 2016 (UTC)

Support wiki-markup and HTML in strings

I'm trying to make a line graph where the label for one of the axes needs italics and subscripts. But:

|yAxisTitle=''k''<sub>1</sub>/''k''<sub>2</sub>

displays that literal string as the label instead of formatted as "k₁/k₂". Looks like the same applies to all fields of text strings (xAxisTitle, Legend, ynTitle). I'm just getting started using this template, so I don't know where to begin to diagnose or improve it. DMacks (talk) 03:33, 27 February 2017 (UTC)

DMacks, I would suggest asking at WP:VPT or at mediawiki.org. I believe the actual images are generated by the graph extension. Frietjes (talk) 15:42, 27 March 2017 (UTC)

Do the yAxisMin and yAxisMax features work on bar charts?

I would like to show a bar chart where the y axis values start at 1,700 and go to 2,100. I tried this:

{{Graph:Chart |width=300 |height=200 |xAxisTitle=Date |yAxisTitle=Total articles |type=rect |x=0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31 |y=2019,2031,2001,1998,1983,1970,1975,1978,1981,1973,1960,1957,1944,1945,1949,1950,1936,1921,1920 |yAxisMin=1700 |yAxisMax=2100 }}

It renders like this:

At this writing, the y axis minimum value is 0 and the maximum value is 2,200. – Jonesey95 (talk) 01:02, 20 January 2016 (UTC)

Absolutely agree, yAxisMin and yAxisMax should be supported for bar charts. Sygmoral (talk) 18:51, 27 April 2017 (UTC)

Text angle rotation

Is there a way to rotate x-axis text on a -45 degree angle? Otherwise text frequently overlaps when using dates.

{{Graph:Chart
 |width=300|height=250
 |type = line
 |xAxisTitle = Year
 |x  = 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015
 |y1 = 5, 11, 22, 53, 85, 132, 205, 299, 412, 652, 866, 836, 839, 910, 1094, 1109, 1058, 1027, 1057, 1001, 939, 940, 934, 768, 616, 468
}}

produces:

Any help/update appreciated. T.Shafee(Evo&Evo)^talk 02:15, 5 October 2016 (UTC)

@Evolution and evolvability: how about this, with two-digit years:

--JohnBlackburne^words_deeds 08:01, 5 October 2016 (UTC)

@JohnBlackburne: Thanks, it's a good option. Sadly, it causes the usual ambiguity when discussion different centuries. Text rotation would be the ideal solution, especially or bar/rect graphs with words as the x-axis categories. T.Shafee(Evo&Evo)^talk 12:10, 5 October 2016 (UTC)

You could use the graph label, an adjoining caption or the text of the article to clarify any ambiguity. I imagine this will be done anyway; you should never have a graph without some commentary on it which explains what it represents.--JohnBlackburne^words_deeds 12:18, 5 October 2016 (UTC)

@JohnBlackburne:Thanks, to clarify, this is the graph I'm thinking of. Below are the png image from excel, and as close as I can recapitulate in the markup.

File:Transcriptomics technique publications over time.png

Published papers referring to RNA-seq (black), RNA microarray (red), expressed sequence tag (blue) and serial/cap analysis of gene expression (yellow) over the last 25 years.

Published papers referring to RNA-seq (black), RNA microarray (red), expressed sequence tag (blue) and serial/cap analysis of gene expression (yellow) over the last 25 years.

{{Image frame|width=320|
|caption = Published papers referring to RNA-seq (black), RNA microarray (red), expressed sequence tag (blue) and serial/cap analysis of gene expression (yellow) over the last 25 years.<ref>{{Cite web|url=http://dan.corlan.net/medline-trend.html|title=Medline trend: automated yearly statistics of PubMed results for any query|website=dan.corlan.net|access-date=2016-10-05}}</ref>
|content = 
 {{Graph:Chart
 |width=220|height=150
 |type = line
 |xType = date
 |xAxisFormat = %y
 |xAxisTitle = Year
 |yAxisTitle = Publications
 |y1Title = RNA-Seq
 |y2Title = Microarray
 |y3Title = Expressed sequence tag
 |y4Title = Serial/cap analysis of gene expression
 |x  = 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015
 |y1 = 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 6, 33, 156, 358, 629, 1123, 1721, 2595
 |y2 = 0, 0, 0, 0, 0, 1, 2, 1, 5, 19, 90, 287, 507, 759, 1086, 1405, 1539, 1585, 1769, 1868, 1977, 2121, 2105, 2158, 2210, 1926
 |y3 = 5, 11, 22, 53, 85, 132, 205, 299, 412, 652, 866, 836, 839, 910, 1094, 1109, 1058, 1027, 1057, 1001, 939, 940, 934, 768, 616, 468
 |y4 = 0, 0, 0, 0, 0, 1, 1, 2, 7, 26, 50, 78, 103, 110, 115, 124, 124, 130, 131, 79, 63, 35, 32, 38, 34, 39
 |colors = #000000, #c00000, #0070c0, #ffc000
 }}
}}

I would say it’s clear to me and to anyone seeing it that the years are the most recent, i.e. from the last two and a half decades. It’s the default assumption anyway, and the caption nails it by mentioning RNA only discovered in the last 100 years. And that’s without seeing it in an article which presumably adds much more context.

Rotated text is not possible as far as I can see. I can understand why as it does not help readability, and implementation is far from straightforward: I played with this for my signature of all things and came up with the example at the top of the page User:JohnBlackburne/test, which is horrible and only works in one browser as far as I can tell.--JohnBlackburne^words_deeds 05:21, 7 October 2016 (UTC)

@JohnBlackburne: Thank you for your thorough investigation, great explanations. I appreciate that working within the confines of wikimarkup and lua adds an extra layer of challenge to any request! I shall go with the current solution, as you say it's probably hard to misconstrue that dates in this case... Thanks again! T.Shafee(Evo&Evo)^talk 23:12, 9 October 2016 (UTC)

References

Any update on the issue? I cant figure out how to omit months and leave only years on x axis: w:ru:Флибуста#Статистика Флибусты. Soshial (talk) 14:25, 11 August 2017 (UTC)

scatter plot

So this is basically edraw. How do you set type = scatter plot? Just granpa (talk) 21:23, 3 September 2017 (UTC)

It wouldn't be a true scatter plot, but perhaps utilizing the blank space method above would produce something useful?—D'Ranged 1 | VT^alk :  09:55, 9 September 2017 (UTC)

skip a space in a line graph

Is there any way to skip a space in a line graph? Just granpa (talk) 16:09, 7 August 2017 (UTC)

Here is the reason I ask:

Just granpa (talk) 09:27, 8 August 2017 (UTC)

It is unclear what you mean, "skip a space". Can you be more precise with what you are trying to achieve?--JohnBlackburne^words_deeds 09:13, 8 August 2017 (UTC)

I mean there is no y value for some values of x. Sometimes it's unknown and sometimes it's just meaningless. In the graphic above all the blue lines extend the full length of the chart. I buried some of them under the black lines but that's only a partial solution.

Just granpa (talk) 09:18, 8 August 2017 (UTC)

Just granpa I made a few changes as below.

• extended the x-axis values to 35, since the labels default to multiples of 5
• moved the scale lines to the top of the list so they would be behind the data lines
• changed the color of the scale lines to a lighter shade so the data lines are more distinct
• used the {{repeat}} template to draw the scale lines
• extended the scale lines to the length of the x-axis line (it has to be 36 to go far enough)
• eliminated the scale line at the zero value so as to preserve the thin x-axis line
• used color names instead of hex keys
• used the {{repeat}} template to set the colors of the lines
• repeated actual spaces instead of numbers where you didn't want the line

{{Graph:Chart 

|width=500 

|height=300 

|yAxisTitle=Log₂(Radius) 

|type=line 

|x=0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35 

|y1={{repeat|36|6,}} 

|y2={{repeat|36|5,}} 

|y3={{repeat|36|4,}} 

|y4={{repeat|36|3,}} 

|y5={{repeat|36|2,}} 

|y6={{repeat|36|1,}} 

|y7=5.76, 5.49, 5.44, 5.13, 5.10, 5.08, 5.09, 5.53, 5.49, 5.47, 5.48, 5.75, 

|y8=5.04, 4.84, 4.83, 4.86, 4.87, 4.88, 4.73, 5.07, 4.95, 4.96, 4.97, 4.99, 5.00, 5.01, 5.19, 5.05, 4.93, 4.81, 4.77, 4.79, 4.78, 4.81, 4.87, 4.93, 5.02, 5.22, 5.27, 5.17, 5.24, 5.60, 5.72, 6.00, 5.76, 

|y9={{repeat|14| ,}} 4.45, 4.23, 4.10, 3.98, 3.94, 3.97, 3.98, 4.02, 4.08, 4.19, 4.33, 4.26, 4.31, 4.39, 4.48, 4.66, 4.99, 5.30, 5.04, 

|y10={{repeat|14| ,}} 3.40, 3.21, 3.11, 3.01, 3.01, 3.07, 3.11, 3.18, 3.23, 3.31, 3.48, 3.51, 3.40, 3.60, 3.76, 4.06, 4.28, 4.61, 4.45, 

|y11={{repeat|24| ,}} 2.37, 2.32, 2.14, 2.64, 2.71, 2.99, 3.19, 3.56, 3.40, 

|y12={{repeat|24| ,}} 0.27, 0.36, 0.32, 1.58, 1.67, 1.79, 2.08, 2.45, 2.37, 

|y13={{repeat|31| ,}} 0.29, 0.27, 

|colors={{repeat|6|gainsboro,}}{{repeat|7|blue,}} 

}}

Take what you like and ignore what you don't—hope this helped!—D'Ranged 1 | VT^alk :  23:37, 8 September 2017 (UTC)

Thats perfect! I tried all sorts of things, how did I overlook a simple space?

Just granpa (talk) 02:30, 9 September 2017 (UTC)

Probably a case of "can't see the forest for the trees"—fresh eyes are often a great help. Glad to be of assistance!—D'Ranged 1 | VT^alk :  09:55, 9 September 2017 (UTC)

I was second-guessing the computer which was second-guessing me.

Just granpa (talk) 03:41, 10 September 2017 (UTC)

Font family

I suppose the resultant is that the text is formatted differently from editing. It is monotype and slightly larger, so now all the xAxisFormat become one single word. I can't know how Python works, nor do I want to. Kangaroo caught (talk) 10:24, 31 January 2018 (UTC)

Align right

How do I get a graph to align to the right when using this template? — Diannaa 🍁 (talk) 00:15, 20 January 2016 (UTC)

Diannaa, you could wrap it in {{stack}}. Frietjes (talk) 01:23, 3 February 2016 (UTC)

Diannaa I like to wrap graphs in a {{Side box}}, that way I can add a title above and source links below. See here:

{{Side box |metadata=No | above = A graph of something. | text = {{Graph:Chart |height=150 |width=200 |xAxisTitle=year |yAxisTitle=Units of something |yAxisMin=0 |type=rect |showSymbols=yes |x=2011, 2012, 2013, 2014, 2015, 2016 |y1=1326, 145, 203, 377, 639, 306 |y2= , , , 226, 208, 276 |color=blue,grey}} | imageright = | below = Source links here}}

if anyone has a better idea, let me know. AadaamS (talk) 04:53, 23 April 2018 (UTC)

Needs support for a title parameter

It's strange that there's no way to provide a title for the chart. Someone should add support for a new title parameter that adds a header above the chart. I imagine this would be a <th> with the chart itself being inside a <td>. Kaldari (talk) 01:23, 18 December 2016 (UTC)

@Kaldari: Does it fit your use case to wrap it in an {{Image frame}} and use the caption field for the title? grendel|khan 22:55, 14 June 2018 (UTC)

Dots on line graph to show actual data points?

Hello! I just learned of this fantastic graphing feature that ya'll created. Thanks so much for such a great tool that can be used to help people better understand data that editors may present to the reader!!!

I feel that it would be a valuable feature to (have the option to) show a dot where each data point is; reason being that, for example, in these graphs: California_housing_shortage#Ratio_of_residents_and_jobs_to_housing_units the first data exist at 10 year intervals, but is yearly after 2010. (x=1940,1950,1960,1970,1980,1990,2000,2010,2011,2012,2013,2014,2015,2016,2017) Dots would help the reader understand that change in granularity.

Thanks again for such a great tool!!!! ---- Avatar317 (talk) 22:03, 20 June 2018 (UTC)Avatar317

You can do that by adding the parameter "showSymbols=true". Toohool (talk) 23:12, 20 June 2018 (UTC)

Thanks!!! Sorry! Clearly I should have read the Template page more thoroughly before asking. Thanks for answering!! ---- Avatar317 (talk) 21:05, 21 June 2018 (UTC)Avatar317

Mouse over to see values?

Would it be possible to add functionality to display the actual values in, say, a line chart as the user mouses over the data points? It wouldn't add visual clutter, but I think it would be particularly useful to have. (I'm using this template on California housing crisis at the moment.) grendel|khan 22:56, 14 June 2018 (UTC)

I believe mouseover effects would require the graph extension's interactive mode to be enabled, which has not been done on any WMF wikis yet. Toohool (talk) 01:26, 15 June 2018 (UTC)

@Toohool: The individual lines on the line graph are highlighted in red when I mouse over them; is that separate from the 'interactive mode'? (I don't know much about d3.) grendel|khan 08:25, 17 June 2018 (UTC)

@Grendelkhan: You're probably looking at that in preview mode? Interactive mode is enabled when previewing an article, but not when reading an article. Toohool (talk) 17:44, 18 June 2018 (UTC)

@Toohool: Yep--that's exactly what's happening. I suppose there's a good reason for disabling interactive mode? grendel|khan 00:28, 22 June 2018 (UTC)

@Grendelkhan: There is an open Phabricator task to enable it, so I imagine it's just a matter of WMF not devoting any developer resources to this (or to any work on the Graph extension, for that matter). Toohool (talk) 00:53, 22 June 2018 (UTC)

Changing the order of the stacked data series

How can I change the order in which the data is stacked? I would like the change the following chart. I find it too difficult to read. The legend and the data series are in different order.

Exports, 2004–2015 (in bn EUR)

I would like to achieve this kind of a result but without the letters in front of the countries in the legend.

Exports, 2004–2015 (in bn EUR)

Nefjool (talk) 17:29, 29 October 2017 (UTC)

+1. This would also be very useful for stackedarea. It seems like the current order is just alphabetical based on the labels, which is quite unfortunate. (I've been working around it by just forcing the alphabetical order by adding "-" and a bunch of spaces before the labels to get a specific order. Doesn't work when you have so many labels, and doesn't look nice even when there's only a few.) --Yair rand (talk) 17:55, 22 August 2018 (UTC)

@Nefjool and Yair rand: I would recommend using Module:Chart for easy and flexible stacked bars. See examples at List of Falcon 9 and Falcon Heavy launches#Launch statistics or 2017 in spaceflight#By rocket. — JFG ^talk 20:13, 23 August 2018 (UTC)

• So, one way to fix this would be to change the line sortby = { "series" } in Module:Graph to sortby = { "-_id" }, which would make it always ordered top-to-bottom based on the order inputted, I think. Would this mess up any existing uses? Are there any cases where one would prefer to have it alphabetized? --Yair rand (talk) 02:02, 24 August 2018 (UTC)

  @Nefjool: I've implemented the change. Seems to be fixed. --Yair rand (talk) 20:27, 26 August 2018 (UTC)

Dead link

"(The default color palette is category10)." link is dead. — Omegatron (talk) 17:32, 23 September 2018 (UTC)

Tabular Data from Commons

What needs to be done to allow this template to use tabular data from Commons, as {{Graph:Lines}} does? --Ahecht (TALK
PAGE) 14:33, 31 October 2018 (UTC)

Why interactive in preview, not when published?

Why is the template graph interactive in preview mode, but not when published? And can that be changed? — the Man in Question (in question) 02:12, 10 December 2018 (UTC)

Convert all Pie chart to Bar chart

Pie chart are misleading and hard to read. They should never be used. Yet they are all over the place on Wikipedia.

I propose to remove all pie chart by removing the option in the template and fall back on bar chart. If really some peoples want to keep pie chart, that should only be allowed to compare a maximum of two things. Their is absolutely no argument for pie chart with more than two things.

See for example:

• https://blog.funnel.io/why-we-dont-use-pie-charts-and-some-tips-on-better-data-visualizations
• https://medium.com/@KristinHenry/in-defense-of-pie-charts-and-why-you-shouldnt-use-them-df2e8ccb5f76 (Show a minor case where pie chart are acceptable)

Gagarine (talk) 16:49, 28 December 2018 (UTC)

That's only your opinion. Let other people use pie charts where they see fit. — JFG ^talk 10:59, 15 February 2019 (UTC)

Problem on mobile

The graph at Polygamy in North America#Public opinion is blank on mobile. I don't understand why, because all the examples on the template's doc page work fine. Hairy Dude (talk) 02:24, 15 February 2019 (UTC)

See phab:T216431 /JohanahoJ (talk) 12:52, 20 February 2019 (UTC)

Why the ugly charts

Is there a reason why we need to have ugly and inefficient canvas-based images for charts instead of nice, efficient and interactive SVG charts? We are in 2019 and compatibility should not be an issue. Basic SVG is now supported by virtually all users. We could still fall back to png images in case of unsupported SVG. The absence of nice looking charts on Wikipedia is a huge issue, and could be solved by an insignificant fraction of the time that people spend creating inconsistent external charts that are difficult to update. --Ita140188 (talk) 16:32, 23 February 2019 (UTC)

Could someone help me with this table

I did everything correctly (I think), but it shows me two 2, two 3s, two 4s and two 5s on xAxis.

Metacritic and Rotten Tomatoes scores per season

--Mazewaxie 16:53, 15 April 2019 (UTC)

See "y axis numbers go wrong for low integers" above. Same problem. I don't have an answer for you, but I have seen this problem elsewhere when just a few values are used on the x or y axis. – Jonesey95 (talk) 17:09, 15 April 2019 (UTC)

Apparently I just found the solution. You need to add the parameter xType or yType and set it on "string".--Mazewaxie 17:16, 15 April 2019 (UTC)

I tried it in the graph to the right, and it works! – Jonesey95 (talk) 17:45, 15 April 2019 (UTC)

y axis numbers go wrong for low integers

The y axis shows many zeroes, ones and twos when the y values are only 1 and 2. A bug, or is there some sort of workaround?

{{Graph:Chart|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|type=rect|x=1,2,3,4,5,6,7,8|y=1,1,1,1,2,2,1,1}}

It seems I forgot to sign this comment. AadaamS (talk) 09:03, 1 May 2018 (UTC)

|yType= is supposed to do this. It works a little: {{Graph:Chart|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|yType=number|type=rect|x=1,2,3,4,5,6,7,8|y=1,1,1,1,2,2,1,1}}

{{Graph:Chart|width=400|height=100|xAxisTitle=X|yAxisTitle=Y|yType=string|type=rect|x=1,2,3,4,5,6,7,8|y=1,1,1,1,2,2,1,1}}

I can't explain the "string" output. – Jonesey95 (talk) 17:56, 15 April 2019 (UTC)

Problem with <nowiki> and this template

Hello. There is a compatibility problem between colour templates that begin with a nowiki tag (such as #F8F9FA) and {{Graph:Chart}}. If a chart attempts to use one of these colour templates, the element that should display the party colour will instead be black. There are workarounds involving the removal of the tag; using a space before the hash activates preformatted text mode, and simply removing the tag works fine when transcluded into a chart - albeit with the hash displaying as the number 1 on the template page. Nevertheless, these solutions are not ideal as they involve editing large numbers of templates and don't solve the inconsistent behaviour with the handling of the nowiki tag (when compared to the template's transclusion in other contexts). Is the module able to be updated to fix this issue or is it a bug with the Graph extension itself? 202.159.169.45 (talk) 22:48, 15 September 2019 (UTC)

showSymbols doesn't respect opacity values

The showSymbols parameter doesn't respect opacity values. I was attempting to solve a problem identified at Template talk:Television Rotten Tomatoes scores#Errors. In this case, we have have a total number of values but we don't yet know what all those values are. I wanted to create some "fake" scores using the y2 parameter and set y2 to be fully transparent. Alas, while the line is fully transparent, the symbols are fully opaque.

example removed as changes to the sandbox means it no longer shows the problem 202.159.169.45 (talk) 23:36, 19 September 2019 (UTC)

Here's a clearer/simpler example. The lines conform to the opacity of #40FF0000 (#FF0000 at 25% opacity); the symbols do not (they display as #FF0000 at 100% opacity).

-- /Alex/₂₁ 07:57, 22 September 2019 (UTC)

Dots chart

Would it be possible to get the option to simply draw dots? Like what does the line type but without lines connecting the points? Signimu (talk) 10:39, 29 October 2019 (UTC)

Signimu, realistically, you could use the issue above to your advantage, where the line becomes transparent but the markers do not. See:

-- /Alex/₂₁ 12:24, 29 October 2019 (UTC)

Great, thanks a lot! It works great! I'm not sure this is a future-proof solution but at worst the lines will reappear. I noticed that the line transparency is in fact linked to the first 2 digits of the HTML color code, as shown below. --Signimu (talk) 20:08, 29 October 2019 (UTC)

Indeed it is; the first two are the transparency factor, the next six is the regular hex colour code. Per the documentation, The color values must be given either as #rgb/#rrggbb/#aarrggbb or by a CSS color name. For #aarrggbb the aa component denotes the alpha channel, i.e. FF=100% opacity, 80=50% opacity/transparency, etc. -- /Alex/₂₁ 21:47, 29 October 2019 (UTC)

Ahhhh thank you for the clarification! But that's totally counterintuitive, as the common standard is RGBA, here it's ARGB, I didn't even know it was a thing, thanks for pointing out! --Signimu (talk) 22:12, 29 October 2019 (UTC)

Signimu, an easier and more future-proof solution is to just use |linewidth=0:

Kind regards. 202.159.171.246 (talk) 01:26, 31 October 2019 (UTC)

Great idea! I suggest we add it to the documentation, might be of use for others too! --Signimu (talk) 02:28, 31 October 2019 (UTC)

Done, I hope noone will mind my edits I also added xGrid and yGrid along the way as they were not documented. Thank you for the tip! --Signimu (talk) 02:43, 31 October 2019 (UTC)

Even better, especially for when we get the above issue fixed... -- /Alex/₂₁ 04:41, 31 October 2019 (UTC)

X axis labeling bug with fewer than 8 items?

I noticed when creating a chart with fewer than 8 items, the X-axis labeling is weird, with repeating digits, as though to fill space. I could not find an option to turn this behavior off and have exactly one label per point.

6 items:

8 items (expected behavior)

This is a problem on the formerly featured article, Lost (TV series). —ZebeFirst (talk) 03:52, 31 October 2019 (UTC)

@ZebeFirst: Add |xType=string:

-- /Alex/₂₁ 04:40, 31 October 2019 (UTC)

Huh. I don't know whether that was documented before and I missed it or what, but that's the solution. I feel like that should be the default behavior for fewer than 8 items, though. Thanks! —ZebeFirst (talk) 06:17, 31 October 2019 (UTC)

Template should generate 2x versions of the chart

Whenever I see charts generated with this template on my retina display, it looks blurry. It should generate 2x srcset versions of the <img>. Akeosnhaoe (talk) 03:45, 28 November 2019 (UTC)

@Akeosnhaoe: See phab:T204573. Also, phab:T96309. --Yair rand (talk) 07:32, 28 November 2019 (UTC)

Dealing with two occurrences of the same year

Hi,

I'm trying to make a graph for the article summarizing the Plaid Cymru election results in Great Britain. The problem I'm facing is that there was a year, namely 1974, where there were two elections, one in February, the other in October. Of course, the software isn't prepared to deal with it.

• When both x labels are named 1974, February's result is erased by October's.
• When the months are added to the year label (-F, -O, .2, .10), the labels are moved after 2019.
• When I'm using "date" as the xType, it seems to show a large integer which I suspect are the UNIX seconds of that date at midnight.

What should I do? Thanks. Kahlores (talk) 22:48, 21 December 2019 (UTC)

One thing which would work - but it is a terrible hack - is to put two graphs side by side. The first graph ends in February 1974 and the second one starts with October 1974... KarlFrei (talk) 12:25, 5 February 2020 (UTC)

How about adding the month to all election dates? Example below. --Birger Fricke (talk) 00:24, 13 March 2020 (UTC)

Interesting idea, but that is not an acceptable date format on en.WP. Maybe more like this?

That looks like it works. – Jonesey95 (talk) 00:43, 13 March 2020 (UTC)

Good! It looks like the module treats numbers on the x-axis as numbers and sorts them into bins, everything else is treated as a string and leads to separate bins that are not sorted. The numbered bins are shown first (on the left) and the string bins are shown to their right. The solution is probably to make the module think that all parameters are strings, as we have done (or change the module). --Birger Fricke (talk) 07:27, 13 March 2020 (UTC)

Labels on the bottom?

Is there a way to move series labels from the right side to underneath the graph? Horizontal space is often at a premium, and doing so would help with page layout on certain articles. pauli133 (talk) 14:31, 11 March 2020 (UTC)

The template documentation explains and shows how to do this. Long legend entries can look clumsy. It may be better to omit the legend parameter and use {{Legend}} (or a similar template) instead: ... – Jonesey95 (talk) 00:46, 13 March 2020 (UTC)

I was hoping for something integrated into the image, but I guess that works for now. Thanks. pauli133 (talk) 12:35, 13 March 2020 (UTC)

How to force purge

If the graph is pulling data from Commons, such as Talk:2020 coronavirus pandemic in Washington (state)/sandbox, how do I force a purge/redraw of the chart when the data changes? ☆ Bri (talk) 19:56, 19 March 2020 (UTC)

I find that clicking Edit and then Publish Changes a couple of times, i.e. doing two null edits, is sometimes necessary. – Jonesey95 (talk) 21:24, 19 March 2020 (UTC)

Can't make the CV chart update no matter what I do. Copying it into a new table every day is possible but tedious, grr ☆ Bri (talk) 23:32, 19 March 2020 (UTC)

Line chart with logarithmic vertical scale

It would be nice to be able to plot data with a logarithmic scale in the vertical (and/or horizontal) axis.

Would it be possible to expand the capabilities to cover this possibility?

Masher oz (talk) 07:50, 21 March 2020 (UTC)

We Need This

Without semi-log and log-log plot capability here, one must go to gnuplot or other external utility and a PNG file to provide a semil-log plot. These cannot be edited by someone who comes in to fix or update something without generating a new PNG file. -- motorfingers : Talk 23:28, 24 March 2020 (UTC)

@Masher oz and Motorfingers:  Done

But finding en.Wikipedia geeky people willing and able to work on this is essential. I only did this because my wishlist request went unanswered for a month and for the COVID-19 pandemic, semilogy graphs are critically important, since locally self-sustaining infection at an exponential rate is clear on this sort of figure. Boud (talk) 14:40, 26 March 2020 (UTC)

Done it Twice, Reverted and Deleted During Frantic Editing

I put the semi-log plot in on the first of the three plots at the bottom of 2020 coronavirus pandemic in the United States. The first time it was instantly reverted by someone who thought that the average person would not understand a semi-log plot and would be misled. I tried again, this time with a one-line explanation for the logarithm-challenged and it held -- until someone updated the charts with more data and broke two of the three charts. Someone else fixed the charts and in that process deleted the log axis.

I tried making the second chart, which is a bar chart and not a line chart, a log chart and find that it's not simple because the formatting changes, and formatting that works for simple linear plot charts will break log plots, so I gave it up for the evening.

The article is updated many times a day. Since semi-log plots get broken by people who update them, I'll leave it for a few days, then try again. In the meantime I'll try to figure out something constructive for the second two charts. I'm not sure that semi-log bar charts are a good idea, and changing the last two plots to line plots while making them log plots may or may not be the best solution for making these summary plots easier to absorb. -- motorfingers : Talk 07:00, 27 March 2020 (UTC)

SVG versus PNG

The charts produced by this template look very nice. However, I have read elsewhere that SVG graphics are preferred over PNG on Wikipedia. Would it be possible to output SVG charts as well? Or is it not so relevant which file type is used? KarlFrei (talk) 10:17, 5 February 2020 (UTC)

User:Ita140188 pointed out to me that previews of pages with charts look much better than the actual pages. Indeed, if you go and look at a preview of this article page, the graphs look crisp and clear and just as they should... until you hit publish. Both the images on the preview page as well as the images in the published page are PNG files, but the published images look significantly more blurry. I would like to understand the reasoning behind the approach used in this template. Can anyone explain why it was programmed in this way? KarlFrei (talk) 17:34, 8 February 2020 (UTC)

The Graph extension has an "interactive mode" that renders the charts in SVG instead of PNG. This mode is enabled when you are previewing an article, but not when reading an article. It was turned off for performance and security reasons IIRC. There is an open task to turn it back on, but it seems that any development work on graphing/charting has been deprioritized by WMF. Toohool (talk) 18:53, 8 February 2020 (UTC)

Thank you. I am still confused though, when I right-click on the image and save it, it automatically is saved as PNG, so I assumed it was a PNG file. However, now that I think about it, I suppose PNG files are not interactive. Anyway, I will go and look into this further. I am surprised about the security reasons; I would expect that a graph could not do much harm if it is hacked (and I wonder how you would hack it in the first place). I also wonder how much of an issue performance is in this day and age... KarlFrei (talk) 20:46, 8 February 2020 (UTC)

Bit late to this, but I also hope the WMF see some value in allowing SVG rendering. They look fantastic before you hit publish and it's such a shame the average user doesn't see that. —Formulaonewiki 08:28, 31 March 2020 (UTC)

X-Axis label format bug? (xAxisFormat =)

When trying to format the x-axis labels that are of date format for a bar chart the formatting is not applied. Simply switching to a line chart the issue disappears.

Chart with type= rect:

Chart with type= line:

— Preceding unsigned comment added by Jimz514 (talk • contribs)

I have the same problem, and it does not depend on the presence of xAxisFormat, but on the xType = date, and I confirm, it happens only for the type = rect, not for line.

On a similar note, I have a problem with setting the xAxisMin and xAxisMax, again in the date type. It looks like if I put them the graph breaks. For example, using the same graph as Jimz514 above:

--Ritchie92 (talk) 09:35, 2 April 2020 (UTC)

This is not a WP:RFC matter. If you need technical help with a chart, you can ask at WP:VPT. When doing so, it's best to simply direct people here, rather than start another discussion there. --Redrose64 🌹 (talk) 15:18, 23 April 2020 (UTC)

@Redrose64: thanks for the help, I will do as you suggested. --Ritchie92 (talk) 08:48, 24 April 2020 (UTC)

The underlying module is designed to not apply xType date to bar charts (in lines 335-344) and it should remain that way, as bar charts are special in Vega (the software used for this template). The issue could be circumvented by adding an fixed display field, e.g. datum.c, which gets displayed instead of the x-axis timestamp. Only a suggestion here, I am not offering to do that myself.

The xAxisMin issue is really an separate issue. xAxisMin does support using the timestamp, not an formated date. It has been discussed multiple times among Lua coders that modules should not try to re-throw errors each time something unexpected happens, so I recommend on that one, only updating the /doc, but leaving the code alone.--Snaevar (talk) 14:32, 24 April 2020 (UTC)

Automating cumulative series

Grabbing Jimz514's example here, this graph, and dozens like it in the mainspace, have a line which is simply a cumulative sum of the other line:

The template behind it says:

| y1=0,1,0,0,0,0,0,0,0,0,0,0,0,0,11,17,11,12,17,15,15,13,15
| y2=0,1,1,1,1,1,1,1,1,1,1,1,1,1,12,29,40,52,69,84,99,112,127
...
| y1Title=New Cases
| y2Title=Total Confirmed Cases

There is no logical need to input y2 by hand, and it's slow, tedious, and error-prone for long data series. Could we give the template a way to make a simple cumulative line graph, ideally with the cumulation running in either direction (>than or <than)? I'm looking for something where the template says something like this (pseudocode):

| y1=0,1,0,0,0,0,0,0,0,0,0,0,0,0,11,17,11,12,17,15,15,13,15
| y2=cumulative_sum(y1, direction=increasing_x)

I am not sure if this is something fairly simple which can be done quickly, as Boud did for the log-lin plots above, or rather more difficult. I assume that it would require adding to de:Modul:Graph. I had a go at it, but I know nothing about Lua (there must surely be some library that sums arrays elegantly), or about how to test graph templates... and the obvious way to do it is not very efficient. Any more expert suggestions? HLHJ (talk) 03:17, 23 April 2020 (UTC)

OK, so I've done it in Vega-lite, but while it works in the Vega-lite online editor it does not work in the Mediawiki sandbox; it says "TypeError: (intermediate value).forEach is not a function":. I also cannot use the same method to get differences, important as some jurisdictions give stats of "active cases". I've made up some additions to the dataset to make it clearer what it is doing:

Extended content

<graph> "data": { "name": "cases", "values": [ {"date": "2020/03/01","new cases": 0}, {"date": "2020/03/02","new cases": 1}, {"date": "2020/03/03","new cases": 0}, {"date": "2020/03/04","new cases": 0}, {"date": "2020/03/05","new cases": 0}, {"date": "2020/03/06","new cases": 0}, {"date": "2020/03/07","new cases": 0}, {"date": "2020/03/08","new cases": 0}, {"date": "2020/03/09","new cases": 0}, {"date": "2020/03/10","new cases": 0}, {"date": "2020/03/11","new cases": 0}, {"date": "2020/03/12","new cases": 0}, {"date": "2020/03/13","new cases": 0}, {"date": "2020/03/14","new cases": 0}, {"date": "2020/03/15","new cases": 11}, {"date": "2020/03/16","new cases": 17}, {"date": "2020/03/17","new cases": 11}, {"date": "2020/03/18","new cases": 12}, {"date": "2020/03/19","new cases": 17}, {"date": "2020/03/20","new cases": 15}, {"date": "2020/03/21","new cases": 15, "recoveries": 1, "deaths":1}, {"date": "2020/03/22","new cases": 13, "recoveries": 3}, {"date": "2020/03/23","new cases": 15, "recoveries": 4}, {"date": "2020/03/24","new cases": 0, "recoveries": 5, "deaths":1} ] }, "transform": [{ "window": [{"op": "sum", "field": "new cases", "as": "cumulative cases"}], "frame": [null, 0] }], "repeat": { "layer": ["cumulative cases", "new cases", "recoveries"] }, "spec": { "mark": {"type": "line", "point": true}, "encoding": { "x": { "field": "date", "timeUnit": "date", "title": "Date", "type": "ordinal" }, "y": { "field": {"repeat": "layer"}, "title": "", "type": "quantitative" }, "color": { "datum": {"repeat": "layer"}, "type": "nominal" } } } </graph>

Somewhat astonishingly, parallel syntax will give cumulative deaths, but only one cumulative-sum variable can be plotted at once. Suggestions welcome. HLHJ (talk) 01:30, 24 April 2020 (UTC)

"TypeError: (intermediate value).forEach is not a function" seems to be caused by wrong syntax in "data" section. Graph (and Vega) need to have syntax like:

{ "data": [{"name": "...", "values": [{"x": "...","y": "..."},{"x": "...","y": "..."}]}]}

Vega-lite allow data definition without "[ ... ]". This is what cause error. It seems that Graph extension is not compatible at all with Vega-lite syntax, and mostly with current Vega syntax. Examples from Vega website don't work. And valid working Graphs from wiki don't work on Vega editor (errors like "[Error] TypeError: o is undefined"). I think that graph extension need a lot of update because vega current version is 5 and wiki developers are working to switch from "vega 1" to "vega 2". Unfortunatelly debugging with graph sandbox is very hard. Error messages are not helpful and if there's problem with syntax it doesn't show anything. -- Pietrasagh (talk) 11:00, 26 April 2020 (UTC)

Indeed, adding the square brackets gets me an "invalidtext:[object Object]" error instead :

Extended content

<graph> { "data": [ { "name": "cases", "values": [ {"date": "2020/03/01","new cases": 0}, {"date": "2020/03/02","new cases": 1}, {"date": "2020/03/03","new cases": 0}, {"date": "2020/03/04","new cases": 0}, {"date": "2020/03/05","new cases": 0}, {"date": "2020/03/06","new cases": 0}, {"date": "2020/03/07","new cases": 0}, {"date": "2020/03/08","new cases": 0}, {"date": "2020/03/09","new cases": 0}, {"date": "2020/03/10","new cases": 0}, {"date": "2020/03/11","new cases": 0}, {"date": "2020/03/12","new cases": 0}, {"date": "2020/03/13","new cases": 0}, {"date": "2020/03/14","new cases": 0}, {"date": "2020/03/15","new cases": 11}, {"date": "2020/03/16","new cases": 17}, {"date": "2020/03/17","new cases": 11}, {"date": "2020/03/18","new cases": 12}, {"date": "2020/03/19","new cases": 17}, {"date": "2020/03/20","new cases": 15}, {"date": "2020/03/21","new cases": 15, "recoveries": 1, "deaths":1}, {"date": "2020/03/22","new cases": 13, "recoveries": 3}, {"date": "2020/03/23","new cases": 15, "recoveries": 4}, {"date": "2020/03/24","new cases": 0, "recoveries": 5, "deaths":1} ] } ] }, "transform": [{ "window": [{"op": "sum", "field": "new cases", "as": "cumulative cases"}], "frame": [null, 0] }], "repeat": { "layer": ["cumulative cases", "new cases", "recoveries"] }, "spec": { "mark": {"type": "line", "point": true}, "encoding": { "x": { "field": "date", "timeUnit": "date", "title": "Date", "type": "ordinal" }, "y": { "field": {"repeat": "layer"}, "title": "", "type": "quantitative" }, "color": { "datum": {"repeat": "layer"}, "type": "nominal" } } } </graph>

If the documentation I was reading is several steps behind the software, that would explain why I was struggling. Thank you, Pietrasagh. I was hoping to add this to the template, and maybe add violin plots, too, but possibly I'd best steer clear for now. I imagine the Wikidata connectivity is a higher priority; it would be very good to have all this COVID-19 info live from Wikidata. HLHJ (talk) 04:51, 6 May 2020 (UTC)

Formatting questions

Hi, I'm working on a graph at User:Eddie891/GAGraph, and there are several things I wan't to do, but don't have the technological know-how to do. Anyone who can advise on what to do/or tell me it's impossible on-wiki, would be greatly appreciated. 1) I want to gray out the background for sections when backlog drives are in progress, like how this graph is done. 2) I want to highlight specific points on the graph (i.e. all time lowest numbers, highest, etc.). Again, any suggestions would appreciated! Eddie891 ^Talk _Work 23:13, 27 April 2020 (UTC)

The template doesn't currently support either of those things. I think it would be worthwhile to add both as features, though. For the former, maybe something like |timespan1=2008-01-01/2009-01-01,2010-01-01/2011-01-01|timespan1color=#999999. Seems like it should be fairly simple to add to the module, but it would be best to make sure the syntax works well for a variety of cases before setting it up. --Yair rand (talk) 00:41, 28 April 2020 (UTC)

now it's only possible to do with <graph></graph> extension. But, as described 2 sections above, JSON syntax is tricky. Good example of similar graph is | "falkensee" graph on MediaWiki. I will try to work on it in next upgrades to Graph module. --Pietrasagh (talk) 18:41, 3 May 2020 (UTC)

Thanks again, Pietrasagh! As a comment, Yair rand, since not all x-axes are time, I'd suggest something more like |vertical1=2008-01-01/2009-01-01,2010-01-01/2011-01-01|vertical1color=#999999|vertical1label="strange years". if only one x-value is given, it should make a visible vertical line. HLHJ (talk) 04:56, 6 May 2020 (UTC)

@HLHJ: Good points. Perhaps it would also be worthwhile to have similar options for horizontal areas/lines. Regarding the naming, it might be better to use the "xAxis[Foo][#]/yAxis[Foo][#]" naming convention for consistency with certain other properties. Not sure what to end it with; maybe "region", "highlight", "markers"? --Yair rand (talk) 20:58, 7 May 2020 (UTC)

Space as thousand separator on the French wikipedia

The option showValues=format allows to configure the way the number is displayed.

It provides a "," thousand separator for the English language wikipedia.

But how do you mark the " " (space) thousand separator for the French language wikipdia?

This template is using mw:Extension:Graph and developers are working on this problem since 2015. It's going quite slow. For details see [1] --Pietrasagh (talk) 15:36, 21 June 2020 (UTC)

Ability to hover over portions of graph to get values?

Maybe as a feature that is able to be toggled on and off in the template settings so that graphs which don't need as much detail can do without.- || RuleTheWiki || (talk) 11:01, 7 March 2021 (UTC)