Template:Graph:Lines/core

Template documentation[view] [edit] [history] [purge]

This graph's main version resides at Template:Graph:Lines. Please make or suggest all the changes there, and copy it everywhere else (until the copying is automated)

This graph draws one or more independent numeric data series as lines. The data must be stored on Commons' Data namespace or come from Wikidata Query Service.

Gender pay gap

{{Graph:Lines | table=bls.gov/US Women's weekly earnings as a percent of men's by age, annual averages.tab | type=year | xField=year | series="age_16_24", "age_25_34", "age_35_44", "age_45_54" | title=Gender pay gap in the United States | yZero=false | xAxis=Year | yAxis=Percentage | yMax=100 | yGrid=y | width=500 | legend=Age group | vAnnotationsValues={"text": "Fictitious event", "x": 1990} }}

Gender pay gap in the United States. .

Paintings per decades

{{Graph:Lines | tabletype=query | table=SELECT ?decade (COUNT(?decade) AS ?count) WHERE { ?item wdt:P31 wd:Q3305213 . ?item wdt:P571 ?inception . BIND( year(?inception) as ?year ). BIND( ROUND(?year/10)*10 as ?decade ) . FILTER( ?year > 1400) FILTER( ?year <= year(now())) } GROUP BY ?decade ORDER BY ?decade | series="count" | type=year | xField=decade |yAxisFormat=s | yZero=false | width=550 | title=Paintings by decade | hAnnotationsValues={"text": "Fictitious value", "y": 20000} }}

Paintings by decade. .

Population in countries bordering Germany

Wikidata query produces three columns - year, population size, and country name. This graph shows one line per country. {{Graph:Lines | tabletype=query | table= #Population of countries sharing a border with Germany SELECT ?year ?population ?countryLabel WHERE { { SELECT ?country ?year (AVG(?populations) AS ?population) WHERE { { SELECT ?country (YEAR(?date) AS ?year) ?populations WHERE { ?country wdt:P47 wd:Q183. ?country p:P1082 ?populationStatement. ?populationStatement ps:P1082 ?populations. ?populationStatement pq:P585 ?date. } } FILTER( ?year >= 1900) } GROUP BY ?country ?year } SERVICE wikibase:label { bd:serviceParam wikibase:language "en". } } | type=year | xField=year | group=countryLabel | value=population | colorscheme=category20 | yScale=log | legend=- | xGrid=y | yGrid=y | yTicks=7| width=600 | colorscheme=category20 |yAxisFormat=.1s }}

Population of countries bordering Germany. .

The above documentation is transcluded from Template:Graph:Lines/core/doc. (edit | history)
Editors can experiment in this template's sandbox (create | mirror) and testcases (create) pages.
Add categories to the /doc subpage. Subpages of this template.

<graph mode="interactive" title="">

{
  //
  // ATTENTION: This code is maintained at https://www.mediawiki.org/wiki/Template:Graph:Lines
  //            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_talk:Graph:Lines
  //
  // Template translation is in https://commons.wikimedia.org/wiki/Data:Original/Template:Graphs.tab
  //

  "version": 5,
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "width": 400,
  "height": 300,
"padding": "strict",
  "signals": [{"name": "rightwidth", "update": "width + padding.right", "value":"400" }],
  "data": [{
    "name": "chart",
    "url": "https://commons.wikimedia.org/w/api.php?action=jsondata&formatversion=2&title=%7B%7B%7Btable%7D%7D%7D&format=json&origin=*",
    "format": {"type": "json"
      , "property": "data"
      
    },
    "transform": [


      // Convert xField parameter into a field "_xfield"
      {"type": "formula", "as": "_xfield", "expr":
"datetime(datum.year, 0, 1)"
      },
      {"type": "collect", "sort": {"field": ["_xfield"]} }

, {"type": "formula", "as": "_yfield", "expr": "datum.value" }

    ]
  },




  ],
  "scales": [
    {
      "name": "x",
      "type": "time",
      "domain": {"data": "chart", "field": "_xfield"},
      "range": "width",
      

      
    },
    {
      "name": "y",
      "type": "linear",
      "range": "height",
      "domain": {"data": "chart", "field": "_yfield"},
      
      
      
      
    },
    {
      "name": "color",
      "type": "ordinal",
      "range": {"scheme": "category10"}, 
      "domain": {"data": "chart", "field": "key"}
    },

  ],

  "axes": [
    {
      "scale": "x", "orient": "bottom", "tickSize": 0,
      "tickCount": 7,
      
      
      
      "encode": { 
        "update": { "labels": { 
          
          
        } } 
       }
    },
    {
      "scale": "y", "orient": "left", "tickSize": 0,
      
      
      
      
      "encode": { 
        "labels": { 
          
          
        } 
       }
    }
  ],

  "marks": [
    // Group data by the group parameter or "key", and draw lines, one line per group
    {
      "type": "group",
      "from": {
        "facet": {
          "name": ["key"],
          "data": "chart",
          "groupby": ["key"]
        }
      },
      "marks": [
        {
          "type": "line",
          "from": {"data": ["key"]},
          "encode": {
            "hover": {
              "stroke": {"value": "red"}
            },
            "update": {
              "stroke": {"scale": "color", "field": "key"}
            },
            "enter": {
              "y": {"scale": "y", "field": "_yfield"},
              "x": {"scale": "x", "field": "_xfield"},
              "stroke": {"scale": "color", "field": "key"},
              "interpolate": {"value": "linear"},
              "strokeWidth": {"value": 2.5}
            }
          }
        }
        
      ],
    },





  ]
}

</graph>