User:Fbstj/test/graph

with the Article Statistics as of 2019-07-27

<graph> {

 "version": 2,
 "width": 400,
 "height": 400,
 "data": [
   {
     "name": "X",
     "values": [

{"count":230, "label":"Stubs", "color":"gray" }, {"count":836, "label":"Middling", "color":"blue" }, {"count":683, "label":"Reviewing", "color":"orange" }, {"count":1351, "label":"Complete", "color":"green" }, ],

     "transform": [{"type": "pie","field": "count"}]
   }
 ],
 "scales": [
   {
     "name": "r",
     "type": "sqrt",
     "domain": {"data": "X","field": "count"},
     "range": [20,300]
   }
 ],
 "marks": [
   {
     "type": "arc",
     "from": {"data": "X"},
     "properties": {
       "enter": {
         "x": {"field": {"group": "width"},"mult": 0.5},
         "y": {"field": {"group": "height"},"mult": 0.5},
         "startAngle": {"field": "layout_start"},
         "endAngle": {"field": "layout_end"},
         "innerRadius": {"value": 0},
         "outerRadius": {"field":"count", "scale": "r"},
         "stroke": {"value": "white"},
         "fill": {"field": "color"}
       },
     }
   },
   {
     "type": "text",
     "from": {"data": "X"},
     "properties": {
       "enter": {
         "x": {"field": {"group": "width"},"mult": 0.5},
         "y": {"field": {"group": "height"},"mult": 0.5},
         "radius": {"field": "count", "scale": "r","offset": -50},
         "theta": {"field": "layout_mid"},
         "fill": {"value": "white"},
         "align": {"value": "center"},
         "baseline": {"value": "middle"},
         "text": {"field": "label"}, "fontWeight":{"value": "bold",}
       }
     }
   }
 ]

} </graph>

<graph> {

 "version": 2,
 "data": [
   {
     "name": "X",
     "values": [

{"count":230, "label":"Stubs", "color":"gray" }, {"count":836, "label":"Partial", "color":"blue" }, {"count":683, "label":"Unreviewed", "color":"orange" }, {"count":1351, "label":"Complete", "color":"green" }, ],

     "transform": [{"type": "pie","field": "count"}]
   }
 ],
 "marks": [
   {
     "type": "arc",
     "from": {"data": "X"},
     "properties": {
       "enter": {
         "x": {"field": {"group": "width" },"mult": 0.5},
         "y": {"field": {"group": "height"},"mult": 0.5},
         "startAngle": {"field": "layout_start"},
         "endAngle": {"field": "layout_end"},
         "innerRadius": {"value": 0},
         "outerRadius": {"value": 400},
         "stroke": {"value": "white"},
         "fill": {"field": "color"}
       },
     }
   },
   {
     "type": "text",
     "from": {"data": "X"},
     "properties": {
       "enter": {
         "x": {"field": {"group": "width" },"mult": 0.5},
         "y": {"field": {"group": "height"},"mult": 0.5},
         "radius": {"value": "300"},
         "theta": {"field": "layout_mid"},
         "fill": {"value": "white"},
         "align": {"value": "center"},
         "baseline": {"value": "middle"},
         "text": {"field": "label"}, "fontWeight":{"value": "bold"}, "fontSize": {"value":"30"}
       }
     }
   }
 ]

} </graph>