Hey @Sergii_Petrov - based on the mockup and the data, I interpret your desired output as this. Is this correct? If not, please advise what needs fixing, and I will find more time to finish this up.
Apologies for the delay. I have been sick for the last couple of weeks and am trying to catch up on things before the holidays. I've added columns to mimic the original mockup, so you should be able to adapt accordingly. Note that x-positioning is hard-coded, but this could be done via transforms - either way, I'm hoping this is enough for you to have a think about your version. A workbook containing the spec is also attached to this post.
Spec
{
"data": {
"name": "dataset"
},
"transform": [
{
"calculate": "datum['Sector'] + '-' + datum['Channel']",
"as": "grain"
},
{
"window": [
{
"op": "row_number",
"as": "group_row_number"
}
],
"groupby": [
"Sector"
]
}
],
"spacing": 0,
"hconcat": [
/* Labels */
{
"width": 150,
"layer": [
/* "Group" (sector) */
{
"transform": [
{
"filter": "datum['group_row_number'] == 1"
}
],
"mark": {
"type": "text",
"style": [
"category_label"
]
},
"encoding": {
"text": {
"field": "Sector"
},
"x": {
"value": 0
}
}
},
/* Channel column */
{
"mark": {
"type": "text",
"style": [
"category_label"
]
},
"encoding": {
"text": {
"field": "Channel"
},
"x": {
"value": 75
}
}
},
/* Sales Value */
{
"mark": {
"type": "text",
"style": [
"value_label"
]
},
"encoding": {
"text": {
"field": "Sales"
},
"x": {
"value": 175
}
}
},
/* Net Sales Value */
{
"mark": {
"type": "text",
"style": [
"value_label"
]
},
"encoding": {
"text": {
"field": "Net Sales"
},
"x": {
"value": 225
}
}
},
/* Profit Value */
{
"mark": {
"type": "text",
"style": [
"value_label"
]
},
"encoding": {
"text": {
"field": "Profit",
"format": ".1%"
},
"x": {
"value": 275
}
}
}
],
"encoding": {
"y": {
"field": "grain"
}
}
},
/* Negative-facing stack */
{
"width": 150,
"transform": [
{
"fold": [
"Sales",
"Net Sales"
],
"as": [
"metric",
"value"
]
}
],
"layer": [
{
"mark": {
"type": "bar"
}
}
],
"encoding": {
"y": {
"field": "grain"
},
"x": {
"field": "value",
"type": "quantitative",
"scale": {
"reverse": true
}
},
"color": {
"field": "metric",
"legend": null,
"scale": {
"range": ["#cee9fb", "#99cef7"]
}
}
}
},
/* Positive-facing stack */
{
"width": 150,
"layer": [
{
"mark": {
"type": "bar",
"color": "#d5a0c7"
}
}
],
"encoding": {
"x": {
"field": "Profit",
"type": "quantitative"
},
"y": {
"field": "grain"
}
}
}
]
}Config
{
"view": {
"stroke": "transparent"
},
"axis": {
"title": false,
"ticks": false,
"grid": false,
"domain": false,
"labels": false
},
"style": {
"category_label": {
"align": "left"
},
"value_label": {
"align": "right"
}
}
}Cheers,
Daniel
screenshot of what I'm trying to achieve and test data
| Sector | Channel | Sales | Net Sales | Profit |
| Sector 0 | Fragmented | 100 | 40 | 40.0% |
| Organized | 120 | 60 | 50.0% | |
| Sector 1 | Fragmented | 1,222 | 1,162 | 95.1% |
| Organized | 534 | 474 | 88.8% | |
| Sector 2 | Fragmented | 265 | 205 | 77.4% |
| Organized | 456 | 396 | 86.8% | |
| Sector 4 | Fragmented | 666 | 606 | 91.0% |
| Organized | 56 | 34 | 60.7% | |
| Sector 5 | Fragmented | 6,665 | 6,605 | 99.1% |
| Organized | 777 | 717 | 92.3% | |
| Sector 6 | Fragmented | 888 | 828 | 93.2% |
| Organized | 99 | 39 | 39.4% |
Helpful resources
Join us at the Microsoft Fabric Community Conference
March 31 - April 2, 2025, in Las Vegas, Nevada. Use code MSCUST for a $150 discount!
We want your feedback!
Your insights matter. That’s why we created a quick survey to learn about your experience finding answers to technical questions.
Microsoft Fabric Community Conference 2025
Arun Ulag shares exciting details about the Microsoft Fabric Conference 2025, which will be held in Las Vegas, NV.
A Year in Review - December 2024
Find out what content was popular in the Fabric community during 2024.
