Extension:Graph

This extension takes over the name of an older graph extension that appears to be bit-rotting since 2006 and not in use.

The Graph extension allows a &lt;graph> tag or entire page to describe data visualization in a JSON format that renders a Vega-based graph.

Demo

 * Various other samples

{ "width": 500, "height": 200, "padding": {"top": 10, "left": 30, "bottom": 30, "right": 10}, "data": [ {     "name": "table", "values": [ {"x": 0, "y": 28, "c":0}, {"x": 0, "y": 55, "c":1}, {"x": 1, "y": 43, "c":0}, {"x": 1, "y": 91, "c":1}, {"x": 2, "y": 81, "c":0}, {"x": 2, "y": 53, "c":1}, {"x": 3, "y": 19, "c":0}, {"x": 3, "y": 87, "c":1}, {"x": 4, "y": 52, "c":0}, {"x": 4, "y": 48, "c":1}, {"x": 5, "y": 24, "c":0}, {"x": 5, "y": 49, "c":1}, {"x": 6, "y": 87, "c":0}, {"x": 6, "y": 66, "c":1}, {"x": 7, "y": 17, "c":0}, {"x": 7, "y": 27, "c":1}, {"x": 8, "y": 68, "c":0}, {"x": 8, "y": 16, "c":1}, {"x": 9, "y": 49, "c":0}, {"x": 9, "y": 15, "c":1} ]   },    {      "name": "stats", "source": "table", "transform": [ {"type": "facet", "keys": ["data.x"]}, {"type": "stats", "value": "data.y"} ]   }  ],  "scales": [ {     "name": "x", "type": "linear", "range": "width", "zero": false, "domain": {"data": "table", "field": "data.x"} },   {      "name": "y", "type": "linear", "range": "height", "nice": true, "domain": {"data": "stats", "field": "sum"} },   {      "name": "color", "type": "ordinal", "range": "category10" } ],  "axes": [ {"type": "x", "scale": "x"}, {"type": "y", "scale": "y"} ], "marks": [ {     "type": "group", "from": { "data": "table", "transform": [ {"type": "facet", "keys": ["data.c"]}, {"type": "stack", "point": "data.x", "height": "data.y"} ]     },      "marks": [ {         "type": "area", "properties": { "enter": { "interpolate": {"value": "monotone"}, "x": {"scale": "x", "field": "data.x"}, "y": {"scale": "y", "field": "y"}, "y2": {"scale": "y", "field": "y2"}, "fill": {"scale": "color", "field": "data.c"} },           "update": { "fillOpacity": {"value": 1} },           "hover": { "fillOpacity": {"value": 0.5} }         }        }      ]    }      ] }
 * Embedded graph using &lt;graph> tag (taken from here -- stacked_area)

Limitations
Due to the security restrictions, &lt;graph> does not allow test or similar free-form JavaScript expressions, nor does it allow referencing data outside of WMF cluster (all of Wikimedia wikis are ok).

LocalSettings.php
To allow  in wiki markup:

To store graph definitions as standalone pages in their own namespace, enable it via JsonConfig configuration.