Template:Graph:Stacked/core

{

 //
 // ATTENTION: This code is maintained at https://www.mediawiki.org/wiki/Template:Graph:Stacked
 //            Please do not modify it anywhere else, as it may get copied and override your changes.
 //            Suggestions can be made at https://www.mediawiki.org/wiki/Template:Graph:Stacked
 //
 // Template translation is in https://commons.wikimedia.org/wiki/Data:Original/Template:Graphs.tab
 //

 "version": 2,
 "width": 550,
 "height": 250,
 // Parameter to controls how width/height should be interpreted.
 // See Vega 2.x "padding" https://vega.github.io/vega/docs/porting-guide/#layout
 // and Vega x.x "autosize" https://vega.github.io/vega-lite/docs/size.html#autosize
 // and CSS attribute "box-sizing" https://developer.mozilla.org/docs/Web/CSS/box-sizing
 // for references

 "data": [

   {
     "name": "chart",

"url": "tabular:///{{{table}}}",

     "format": {"type": "json"

, "property": "data"

     },
   "transform": [

     // Convert xField parameter into a field "_xfield"
     {"type": "formula", "field": "_xfield", "expr":

"datum.{{{xField}}}"

     },
     {"type": "sort", "by": ["_xfield"]},

     // For non-bar graph, ensure that all missing values still present as zeros to avoid area breaks
     // We might need to allow other, non-0 values to be imputed.

{

       "type": "impute",
       "groupby": ["key"],
       "orderby": ["_xfield"],
       "field": "value",
       "method": "value",
       "value": 0
     },
   ]
 },

   {
     "name": "stats",
     "source": "chart",
     "transform": [{
       "type": "aggregate",
       "groupby": ["_xfield"],
       "summarize": [{"field": "value", "ops": ["sum"]}]
     }]
   }
 ],
 "scales": [
   {
     "name": "x",
     "type": "{{{type}}}",
     "domain": {"data": "chart", "field": "_xfield"},

     "range": "width",

   },
   {
     "name": "y",
     "type": "linear",
     "range": "height",
     "domain": {"data": "stats", "field": "sum_value"},
     
     
     
     
   },
   {
     "name": "color",
     "type": "ordinal",
     "domain": {"data": "chart", "field": "key"},
     "range":

"category10",

},

],

 "axes": [
   {
     "scale": "x", "type": "x", "tickSizeEnd": 0,
     "ticks": 7,
     
     
     "properties": { 
       "labels": { 
         
         
       } 
     },
   },
   {
     "scale": "y", "type": "y", "tickSizeEnd": 0,
     // When drawing "type=year" (or "type=ordinal") bars with the given width, shift y axis left by half the width
     
     
     
     
     "properties": { 
       "labels": { 
         
         
       } 
     },
   }
 ],

 "marks": [
   // Group data by the "key", and draw lines, one line per key
   {

"type": "group",

     "from": {
       "data": "chart",
       "transform": [
         {"type": "stack", "groupby": ["_xfield"], "sortby": ["key"], "field": "value"},
         {"type": "facet", "groupby": ["key"]}
       ]
     },
     "marks": [
       {
         "type": "area",
         "properties": {
           "hover": {
             "fill": {"value": "red"}
           },
           "update": {
             "fill": {"scale": "color", "field": "key"}
           },
           "enter": {
             "x": {"scale": "x", "field": "_xfield"},
             "y": {"scale": "y", "field": "layout_start"},
             "y2": {"scale": "y", "field": "layout_end"},
             "fill": {"scale": "color", "field": "key"},
             "interpolate": {"value": "monotone"}
           }
         }
       }
     ],
   },

} </syntaxhighlight><syntaxhighlight lang=html></graph></syntaxhighlight>

{{Graph:Stacked \| table=Bea.gov/GDP by state.tab \| type=year \| xField=year \| barwidth=14 \| series="TX","NY","CA" \| title=Per state GDP \| chartSizing=fit }}	{{Graph:Stacked \| table=Bea.gov/GDP by state.tab \| type=year \| xField=year \| legend=States \| series="TX","NY","CA" \| title=Per state GDP \| chartSizing=fit }}
<graph> { "version": 2, "width": 550, "height": 250, "padding": "strict", "data": [ { "name": "series_fields_names", "values": [ "TX","NY","CA" ], "transform": [ {"type": "formula", "field": "orderSrc", "expr": "datum._id"}, ] }, { "name": "chart", "url": "tabular:///Bea.gov/GDP by state.tab", "format": {"type": "json" , "property": "data" }, "transform": [ {"type": "formula", "field": "_xfield", "expr": "datetime(datum.year, 0, 1)" }, {"type": "sort", "by": ["_xfield"]}, {"type": "fold", "fields": ["TX","NY","CA"]}, {"type": "lookup", "on": "series_fields_names", "onKey": "data", "keys": ["key"], "as": ["keyItem"]}, {"type": "formula", "field": "keyOrder", "expr": "datum.keyItem.orderSrc"}, ] }, { "name": "labels", "url": "tabular:///Bea.gov/GDP by state.tab", "format": {"type": "json", "property": "fields"}, "transform": [ ] }, { "name": "stats", "source": "chart", "transform": [{ "type": "aggregate", "groupby": ["_xfield"], "summarize": [{"field": "value", "ops": ["sum"]}] }] } ], "scales": [ { "name": "x", "type": "time", "domain": {"data": "chart", "field": "_xfield"}, "range": "width", }, { "name": "y", "type": "linear", "range": "height", "domain": {"data": "stats", "field": "sum_value"}, }, { "name": "color", "type": "ordinal", "domain": {"data": "chart", "field": "key"}, "range": "category10", }, { "name": "labels", "type": "ordinal", "domain": {"data": "labels", "field": "name"}, "range": {"data": "labels", "field": "title"}, } ], "axes": [ { "scale": "x", "type": "x", "tickSizeEnd": 0, "ticks": 7, "properties": { "labels": { } }, }, { "scale": "y", "type": "y", "tickSizeEnd": 0, "offset": 8, "properties": { "labels": { } }, } ], "marks": [ { "type": "rect", "from": { "data": "chart", "transform": [ {"type": "stack", "groupby": ["_xfield"], "sortby": ["-keyOrder"], "field": "value"} ] }, "properties": { "hover": { "fill": { "value": "red" } }, "update": { "fill": {"scale": "color", "field": "key"} }, "enter": { "x": {"scale": "x", "field": "_xfield" ,"offset":-7 }, "width": {"value": 14 }, "y": {"scale": "y", "field": "layout_start"}, "y2": {"scale": "y", "field": "layout_end"}, "fill": {"scale": "color", "field": "key"} } } }, { "type": "text", "properties": { "enter": { "y": {"value": -15}, "x": {"signal": "width", "mult": 0.5, "offset": 30 }, "text": {"value": "Per state GDP"}, "fontWeight": {"value": "bold"}, "align": {"value": "center"}, "baseline": {"value": "bottom"}, "fill": {"value": "#000"} } } } ] } </graph> Per state GDP. See or edit source data.	<graph> { "version": 2, "width": 550, "height": 250, "padding": "strict", "data": [ { "name": "series_fields_names", "values": [ "TX","NY","CA" ], "transform": [ {"type": "formula", "field": "orderSrc", "expr": "datum._id"}, ] }, { "name": "chart", "url": "tabular:///Bea.gov/GDP by state.tab", "format": {"type": "json" , "property": "data" }, "transform": [ {"type": "formula", "field": "_xfield", "expr": "datetime(datum.year, 0, 1)" }, {"type": "sort", "by": ["_xfield"]}, {"type": "fold", "fields": ["TX","NY","CA"]}, {"type": "lookup", "on": "series_fields_names", "onKey": "data", "keys": ["key"], "as": ["keyItem"]}, {"type": "formula", "field": "keyOrder", "expr": "datum.keyItem.orderSrc"}, { "type": "impute", "groupby": ["key"], "orderby": ["_xfield"], "field": "value", "method": "value", "value": 0 }, ] }, { "name": "labels", "url": "tabular:///Bea.gov/GDP by state.tab", "format": {"type": "json", "property": "fields"}, "transform": [ ] }, { "name": "stats", "source": "chart", "transform": [{ "type": "aggregate", "groupby": ["_xfield"], "summarize": [{"field": "value", "ops": ["sum"]}] }] } ], "scales": [ { "name": "x", "type": "time", "domain": {"data": "chart", "field": "_xfield"}, "range": "width", }, { "name": "y", "type": "linear", "range": "height", "domain": {"data": "stats", "field": "sum_value"}, }, { "name": "color", "type": "ordinal", "domain": {"data": "chart", "field": "key"}, "range": "category10", }, { "name": "labels", "type": "ordinal", "domain": {"data": "labels", "field": "name"}, "range": {"data": "labels", "field": "title"}, } ], "legends": [{ "fill": "color", "stroke": "color", "title": "States", "properties": { "labels": { "text": {"scale": "labels", "field": "data"} } } }], "axes": [ { "scale": "x", "type": "x", "tickSizeEnd": 0, "ticks": 7, "properties": { "labels": { } }, }, { "scale": "y", "type": "y", "tickSizeEnd": 0, "properties": { "labels": { } }, } ], "marks": [ { "type": "group", "from": { "data": "chart", "transform": [ {"type": "stack", "groupby": ["_xfield"], "sortby": ["-keyOrder"], "field": "value"}, {"type": "facet", "groupby": ["key"]} ] }, "marks": [ { "type": "area", "properties": { "hover": { "fill": {"value": "red"} }, "update": { "fill": {"scale": "color", "field": "key"} }, "enter": { "x": {"scale": "x", "field": "_xfield"}, "y": {"scale": "y", "field": "layout_start"}, "y2": {"scale": "y", "field": "layout_end"}, "fill": {"scale": "color", "field": "key"}, "interpolate": {"value": "monotone"} } } } ], }, { "type": "text", "properties": { "enter": { "y": {"value": -15}, "x": {"signal": "width", "mult": 0.5, "offset": 30 }, "text": {"value": "Per state GDP"}, "fontWeight": {"value": "bold"}, "align": {"value": "center"}, "baseline": {"value": "bottom"}, "fill": {"value": "#000"} } } } ] } </graph> Per state GDP. See or edit source data.
{{Graph:Stacked \| tabletype=query \| table= <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">SELECT ?decade (COUNT(?decade) AS ?count) WHERE {</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">?item wdt:P31 wd:Q3305213 .</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">?item wdt:P571 ?inception .</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">BIND( year(?inception) as ?year ) .</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">BIND( ROUND(?year/10)*10 as ?decade ) .</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">FILTER( ?year > 1400)</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">} GROUP BY ?decade ORDER BY ?decade</syntaxhighlight> \| series="count" \| type=year \| xField=decade \| title=Paintings by decade }}	{{Graph:Stacked \| tabletype=query \| table= <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">SELECT ?year (COUNT(?_genre) AS ?count ) (SAMPLE(?_genreLabel) AS ?label ) WHERE {</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">?item wdt:P31 wd:Q11424.</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">?item wdt:P577 ?_publication_date.</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">?item wdt:P136 ?_genre.</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">?_genre rdfs:label ?_genreLabel.</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">BIND(str(YEAR(?_publication_date)) AS ?year)</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">FILTER((LANG(?_genreLabel)) = "en")</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">FILTER (?_publication_date >= "2000-00-00T00:00:00Z"^^xsd:dateTime)</syntaxhighlight> } <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">GROUP BY ?_genreLabel ?year</syntaxhighlight> <syntaxhighlight lang="sparql" class="" style="background:none; border:none; color:inherit; padding: 0px 0px;" inline="1">HAVING (?count > 30)</syntaxhighlight> \| type=year \| xField=year \| group=label \| value=count \| legend=- \| title=Number of films by year and genre \| xGrid=y \| yGrid=y \| colors="category20" \| height=460 \| barwidth=16 }}
<graph> { "version": 2, "width": 550, "height": 250, "data": [ { "name": "series_fields_names", "values": [ "count" ], "transform": [ {"type": "formula", "field": "orderSrc", "expr": "datum._id"}, ] }, { "name": "chart", "url": "wikidatasparql:///?query=SELECT%20%3Fdecade%20%28COUNT%28%3Fdecade%29%20AS%20%3Fcount%29%20WHERE%20%7B%0A%20%20%3Fitem%20wdt%3AP31%20wd%3AQ3305213%20.%0A%20%20%3Fitem%20wdt%3AP571%20%3Finception%20.%0A%20%20BIND%28%20year%28%3Finception%29%20as%20%3Fyear%20%29.%20%0A%20%20BIND%28%20ROUND%28%3Fyear%2F10%29%2A10%20as%20%3Fdecade%20%29%20.%0A%20%20FILTER%28%20%3Fyear%20%3E%201400%29%0A%7D%20GROUP%20BY%20%3Fdecade%20ORDER%20BY%20%3Fdecade", "format": {"type": "json" }, "transform": [ {"type": "formula", "field": "_xfield", "expr": "datetime(datum.decade, 0, 1)" }, {"type": "sort", "by": ["_xfield"]}, {"type": "fold", "fields": ["count"]}, {"type": "lookup", "on": "series_fields_names", "onKey": "data", "keys": ["key"], "as": ["keyItem"]}, {"type": "formula", "field": "keyOrder", "expr": "datum.keyItem.orderSrc"}, { "type": "impute", "groupby": ["key"], "orderby": ["_xfield"], "field": "value", "method": "value", "value": 0 }, ] }, { "name": "stats", "source": "chart", "transform": [{ "type": "aggregate", "groupby": ["_xfield"], "summarize": [{"field": "value", "ops": ["sum"]}] }] } ], "scales": [ { "name": "x", "type": "time", "domain": {"data": "chart", "field": "_xfield"}, "range": "width", }, { "name": "y", "type": "linear", "range": "height", "domain": {"data": "stats", "field": "sum_value"}, }, { "name": "color", "type": "ordinal", "domain": {"data": "chart", "field": "key"}, "range": "category10", }, { "name": "labels", "type": "ordinal", "domain": ["count"], "range": ["count"], } ], "axes": [ { "scale": "x", "type": "x", "tickSizeEnd": 0, "ticks": 7, "properties": { "labels": { } }, }, { "scale": "y", "type": "y", "tickSizeEnd": 0, "properties": { "labels": { } }, } ], "marks": [ { "type": "group", "from": { "data": "chart", "transform": [ {"type": "stack", "groupby": ["_xfield"], "sortby": ["-keyOrder"], "field": "value"}, {"type": "facet", "groupby": ["key"]} ] }, "marks": [ { "type": "area", "properties": { "hover": { "fill": {"value": "red"} }, "update": { "fill": {"scale": "color", "field": "key"} }, "enter": { "x": {"scale": "x", "field": "_xfield"}, "y": {"scale": "y", "field": "layout_start"}, "y2": {"scale": "y", "field": "layout_end"}, "fill": {"scale": "color", "field": "key"}, "interpolate": {"value": "monotone"} } } } ], }, { "type": "text", "properties": { "enter": { "y": {"value": -15}, "x": {"signal": "width", "mult": 0.5, "offset": 30 }, "text": {"value": "Paintings by decade"}, "fontWeight": {"value": "bold"}, "align": {"value": "center"}, "baseline": {"value": "bottom"}, "fill": {"value": "#000"} } } } ] } </graph> Paintings by decade. See Wikidata query.	<graph> { "version": 2, "width": 550, "height": 460, "data": [ { "name": "chart", "url": "wikidatasparql:///?query=SELECT%20%20%20%3Fyear%20%20%28COUNT%28%3F_genre%29%20AS%20%3Fcount%20%29%20%28SAMPLE%28%3F_genreLabel%29%20AS%20%3Flabel%20%29%20WHERE%20%7B%0A%20%20%3Fitem%20wdt%3AP31%20wd%3AQ11424.%0A%20%20%3Fitem%20wdt%3AP577%20%3F_publication_date.%0A%20%20%3Fitem%20wdt%3AP136%20%3F_genre.%0A%20%20%3F_genre%20rdfs%3Alabel%20%3F_genreLabel.%0A%20%20BIND%28str%28YEAR%28%3F_publication_date%29%29%20AS%20%3Fyear%29%0A%20%20FILTER%28%28LANG%28%3F_genreLabel%29%29%20%3D%20%22en%22%29%0A%20%20%0A%20FILTER%20%28%3F_publication_date%20%3E%3D%20%222000-00-00T00%3A00%3A00Z%22%5E%5Exsd%3AdateTime%29%0A%7D%0AGROUP%20BY%20%3F_genreLabel%20%3Fyear%0AHAVING%20%28%3Fcount%20%3E%2030%29", "format": {"type": "json" }, "transform": [ {"type": "formula", "field": "_xfield", "expr": "datetime(datum.year, 0, 1)" }, {"type": "sort", "by": ["_xfield"]}, ] }, { "name": "stats", "source": "chart", "transform": [{ "type": "aggregate", "groupby": ["_xfield"], "summarize": [{"field": "count", "ops": ["sum"]}] }] } ], "scales": [ { "name": "x", "type": "time", "domain": {"data": "chart", "field": "_xfield"}, "range": "width", }, { "name": "y", "type": "linear", "range": "height", "domain": {"data": "stats", "field": "sum_count"}, }, { "name": "color", "type": "ordinal", "domain": {"data": "chart", "field": "label"}, "range": "category20", }, ], "legends": [{ "fill": "color", "stroke": "color", }], "axes": [ { "scale": "x", "type": "x", "tickSizeEnd": 0, "ticks": 7, "grid": true, "properties": { "labels": { } }, }, { "scale": "y", "type": "y", "tickSizeEnd": 0, "offset": 9, "grid": true, "properties": { "labels": { } }, } ], "marks": [ { "type": "rect", "from": { "data": "chart", "transform": [ {"type": "stack", "groupby": ["_xfield"], "sortby": ["label"], "field": "count"} ] }, "properties": { "hover": { "fill": { "value": "red" } }, "update": { "fill": {"scale": "color", "field": "label"} }, "enter": { "x": {"scale": "x", "field": "_xfield" ,"offset":-8 }, "width": {"value": 16 }, "y": {"scale": "y", "field": "layout_start"}, "y2": {"scale": "y", "field": "layout_end"}, "fill": {"scale": "color", "field": "label"} } } }, { "type": "text", "properties": { "enter": { "y": {"value": -15}, "x": {"signal": "width", "mult": 0.5, "offset": 30 }, "text": {"value": "Number of films by year and genre"}, "fontWeight": {"value": "bold"}, "align": {"value": "center"}, "baseline": {"value": "bottom"}, "fill": {"value": "#000"} } } } ] } </graph> Number of films by year and genre. See Wikidata query.