Skip to content

Instantly share code, notes, and snippets.

@pelotom
Last active February 19, 2019 05:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pelotom/e2945b1925e473a9d4a4a37b0fe70811 to your computer and use it in GitHub Desktop.
Save pelotom/e2945b1925e473a9d4a4a37b0fe70811 to your computer and use it in GitHub Desktop.
Example of a chart with axis labels overrunning axis title
{
"$schema": "https://vega.github.io/schema/vega/v4.json",
"width": 300,
"height": 240,
"padding": 5,
"config": {
"axis": {
"labelLimit": 500
}
},
"data": [
{
"name": "table",
"values": [
{"category":"AXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":0, "value":0.1},
{"category":"AXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":1, "value":0.6},
{"category":"BXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":2, "value":0.9},
{"category":"BXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":3, "value":0.4},
{"category":"CXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":0, "value":0.7},
{"category":"CXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":1, "value":0.2},
{"category":"DXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":2, "value":1.1},
{"category":"DXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":3, "value":0.8},
{"category":"EXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":0, "value":0.6},
{"category":"EXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":1, "value":0.1},
{"category":"FXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":2, "value":0.2},
{"category":"FXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX", "position":3, "value":0.7}
]
}
],
"scales": [
{
"name": "yscale",
"type": "band",
"domain": {"data": "table", "field": "category"},
"range": "height",
"padding": 0.2
},
{
"name": "xscale",
"type": "linear",
"domain": {"data": "table", "field": "value"},
"range": "width",
"round": true,
"zero": true,
"nice": true
},
{
"name": "color",
"type": "ordinal",
"domain": {"data": "table", "field": "position"},
"range": {"scheme": "category20"}
}
],
"axes": [
{"orient": "left", "scale": "yscale", "tickSize": 0, "labelPadding": 4, "zindex": 1, "title": "this is my axis title" },
{"orient": "bottom", "scale": "xscale"}
],
"marks": [
{
"type": "group",
"from": {
"facet": {
"data": "table",
"name": "facet",
"groupby": "category"
}
},
"encode": {
"enter": {
"y": {"scale": "yscale", "field": "category"}
}
},
"signals": [
{"name": "height", "update": "bandwidth('yscale')"}
],
"scales": [
{
"name": "pos",
"type": "band",
"range": "height",
"domain": {"data": "facet", "field": "position"}
}
],
"marks": [
{
"name": "bars",
"from": {"data": "facet"},
"type": "rect",
"encode": {
"enter": {
"y": {"scale": "pos", "field": "position"},
"height": {"scale": "pos", "band": 1},
"x": {"scale": "xscale", "field": "value"},
"x2": {"scale": "xscale", "value": 0},
"fill": {"scale": "color", "field": "position"}
}
}
},
{
"type": "text",
"from": {"data": "bars"},
"encode": {
"enter": {
"x": {"field": "x2", "offset": -5},
"y": {"field": "y", "offset": {"field": "height", "mult": 0.5}},
"fill": {"value": "white"},
"align": {"value": "right"},
"baseline": {"value": "middle"},
"text": {"field": "datum.value"}
}
}
}
]
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment