Access to all datum values on axes signal
97 views
Skip to first unread message
Rafael Coelho
Jan 19, 2022, 9:26:29 AM1/19/22
to vega-js
I am trying to access all datum inside the axes label, to allow me to change the text presented according to a different field presented in data values. The datum signal only has access to value/label.
In data values, I have a field called "hasTooltip" and according to this flag, I wanna change the label presented on Y-axis.
We can open on vega editor the json below.
{
"$schema": "https://vega.github.io/schema/vega/v5.json",
"padding": 25,
"autosize": "fit-x",
"height": 500,
"width": 900,
"data": [
{
"name": "table",
"values": [
{
"category": "Transferências correntes",
"position": 2020,
"hasTooltip": true,
"value": 1100000
},
{
"category": "Transferências correntes",
"position": 2021,
"value": 600000
},
{
"category": "Despesas com o pessoal",
"position": 2020,
"value": 70000
},
{
"category": "Despesas com o pessoal",
"position": 2021,
"value": 55555
},
{
"category": "Aquisição de bens e serviços correntes",
"position": 2020,
"value": 5555
},
{
"category": "Aquisição de bens e serviços correntes",
"position": 2021,
"value": 22222
},
{
"category": "Outras despesas correntes",
"position": 2020,
"value": 2150
},
{
"category": "Outras despesas correntes",
"position": 2021,
"value": 200
},
{
"category": "Outras despesas scorrentes",
"position": 2020,
"value": 2150
},
{
"category": "Outras despesas scorrentes",
"position": 2021,
"value": 200
},
{
"category": "Transferências para investimentos",
"position": 2020,
"value": 25789
},
{
"category": "Transferências para investimentos",
"position": 2021,
"value": 22222
},
{
"category": "Transferêncdias para investimentos",
"position": 2020,
"value": 25789
},
{
"category": "Transferêncdias para investimentos",
"position": 2021,
"value": 22222
}
],
"transform": [
{
"type": "formula",
"expr": "datum.value",
"as": "num_text2"
}
]
}
],
"scales": [
{
"name": "yscale",
"type": "band",
"domain": {
"data": "table",
"field": "category"
},
"range": "height",
"padding": 0.25
},
{
"name": "xscale",
"type": "linear",
"domain": {
"data": "table",
"field": "value"
},
"range": [
0,
{
"signal": "width"
}
],
"round": true,
"zero": true,
"nice": true,
"padding": 0.0001
},
{
"name": "color",
"type": "ordinal",
"domain": {
"data": "table",
"field": "position"
},
"range": {
"scheme": "category20"
}
}
],
"axes": [
{
"orient": "left",
"scale": "yscale",
"tickSize": 0,
"labelPadding": 205,
"zindex": 1,
"labelFontSize": 12,
"labelFont": {
"value": "Manrope-Regular"
},
"minExtent": 205,
"labelAlign": "left",
"labelBound": true,
"labelFlush": 1,
"labelFlushOffset": 1,
"bandPosition": 1,
"encode": {
"labels": {
"interactive": true,
"update": {
"text": {"signal": "datum.value"},
"tooltip": {"signal": "datum.value"}
}
}
}
},
{
"orient": "top",
"grid": true,
"gridDash": {
"value": [
5
]
},
"tickCount": 4,
"scale": "xscale",
"labelFontSize": 12,
"tickSize": 0,
"labelFont": {
"value": "Manrope-Regular"
},
"labelPadding": 10,
"domain": false,
"formatType": "number"
}
],
"marks": [
{
"type": "group",
"from": {
"facet": {
"data": "table",
"name": "facet",
"groupby": "category"
}
},
"encode": {
"enter": {
"y": {
"scale": "yscale",
"field": "category"
}
}
},
"signals": [
{
"name": "heightGroup",
"value": 60
}
],
"scales": [
{
"name": "pos",
"type": "band",
"range": [
0,
{
"signal": "heightGroup"
}
],
"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": 10
},
"y": {
"field": "y",
"offset": {
"field": "height",
"mult": 0.5
}
},
"fill": [
{
"value": "#0C1932"
}
],
"fontSize": {
"value": 14
},
"font": {
"value": "Manrope-Extra-Bold"
},
"align": {
"value": "left"
},
"baseline": {
"value": "middle"
},
"text": {
"field": "datum.num_text2"
}
}
}
}
]
}
],
"legends": [
{
"fill": "color",
"orient": "none",
"legendX": -200,
"legendY": -90,
"direction": "horizontal",
"offset": -50,
"labelOffset": 10,
"labelFont": {
"value": "Manrope-Regular"
},
"symbolSize": 400,
"encode": {
"title": {
"update": {
"fontSize": {
"value": 14
}
}
},
"labels": {
"interactive": true,
"update": {
"fontSize": {
"value": 12
},
"fill": {
"value": "black"
}
},
"hover": {
"fill": {
"value": "firebrick"
}
}
},
"symbols": {
"update": {
"stroke": {
"value": "transparent"
}
}
},
"legend": {
"update": {
}
}
}
}
],
"config": {
"locale": {
"number": {
"decimal": ",",
"thousands": " ",
"grouping": [
3
],
"currency": [
"",
" €"
]
}
}
}
}
Reply all
Reply to author
Forward
0 new messages