📊
Diagrama de Pareto Vertical
Diagrama de Pareto Vertical en Power BI con Deneb y Vega Lite (Parte: 1)
Vega-Lite pareto intermedio
✓ Cross-filter
✓ Tooltip
✓ Context menu
✓ Selección
Vista previa en vivo
Render con datos de muestra · Vega/Vega-Lite🖱️ Cross-filter en vivo — haz clic en una marca y las demás se filtran/atenúan aquí mismo (runtime de Deneb reutilizado, MIT). Igual que en Power BI.
Cargando vista previa…
Vista previa renderizada con el runtime de Deneb · MIT © Daniel Marsh-Patrick
🧩 Campos que espera
-
__0__Product texto -
__1__Total Ventas número medida
Arrastra tus campos a Values en este orden.
🎯 Técnica
- Motor
- Vega-Lite 5.6.1
- Marks
- bar, line, text
- Power BI
- pbiFormat
Cómo usarlo en Power BI
- Agrega el visual Deneb a tu reporte e ingresa a su editor.
- Arrastra tus campos a Values en este orden: Product , Total Ventas .
- Pega el spec (botón «Copiar spec» arriba) en el editor JSON de Deneb.
- Mapea tus columnas y ajusta a tu gusto. La interactividad nativa ya viene configurada.
Ver el spec Vega-Lite completo
spec.vega-lite.json
{
"$schema": "https://vega.github.io/schema/vega-lite/v5.json",
"usermeta": {
"deneb": {
"build": "1.5.1.0",
"metaVersion": 1,
"provider": "vegaLite",
"providerVersion": "5.6.1"
},
"interactivity": {
"tooltip": true,
"contextMenu": true,
"selection": true,
"highlight": true,
"dataPointLimit": 50
},
"information": {
"name": "Diagrama de Pareto Vertical",
"description": "Diagrama de Pareto Vertical en Power BI con Deneb y Vega Lite (Parte: 1)",
"author": "Cristobal-Salcedo",
"uuid": "88a97e3a-26fd-4c80-8e8f-98934537107d",
"generated": "2023-06-19T05:12:48.455Z"
},
"dataset": [
{
"key": "__0__",
"name": "Product",
"description": "",
"type": "text",
"kind": "column"
},
{
"key": "__1__",
"name": "Total Ventas",
"description": "",
"type": "numeric",
"kind": "measure"
}
]
},
"config": {
"view": {
"stroke": "transparent"
},
"font": "Segoe UI",
"text": {
"font": "Segoe UI",
"fontSize": 12,
"fill": "#605E5C"
},
"axis": {
"ticks": false,
"grid": false,
"domain": false,
"labelColor": "#605E5C",
"labelFontSize": 12,
"titleFont": "wf_standard-font",
"titleColor": "#252423",
"titleFontSize": 16,
"titleFontWeight": "normal"
},
"axisQuantitative": {
"tickCount": 3,
"grid": true,
"gridColor": "#C8C6C4",
"gridDash": [
1,
5
],
"labelFlush": false
},
"axisX": {
"labelPadding": 5,
"labelAngle": 0
},
"axisY": {
"labelPadding": 10,
"labels": false
},
"legend": {
"title": "Principio de Pareto",
"orient": "top",
"symbolStrokeWidth": 0,
"padding": 10
}
},
"data": {
"name": "dataset"
},
"transform": [
{
"sort": [
{
"field": "__1__",
"order": "descending"
}
],
"window": [
{
"field": "__1__",
"op": "sum",
"as": "Total_Ventas_Acumulado"
}
],
"ignorePeers": true
},
{
"sort": [
{
"field": "__1__"
}
],
"window": [
{
"field": "__1__",
"op": "sum",
"as": "_GranTotal_Ventas"
}
],
"frame": [
null,
null
]
},
{
"calculate": "datum.Total_Ventas_Acumulado/datum._GranTotal_Ventas",
"as": "%_Acumulado"
},
{
"calculate": "datum['__1__']/datum._GranTotal_Ventas",
"as": "PCT"
}
],
"title": {
"text": "Ventas por producto (Principio de Pareto)",
"subtitle": "'Muestra la contribución de los productos al total de ventas",
"fontSize": 20,
"color": "#333333"
},
"layer": [
{
"layer": [
{
"mark": {
"type": "bar",
"opacity": 0.3,
"tooltip": true
},
"encoding": {
"x": {
"field": "__1__"
},
"color": {
"field": "Total_Ventas_Acumulado",
"type": "quantitative",
"scale": {
"range": [
"#000000",
"#7F7F7F",
"#D62728"
]
},
"legend": null
}
}
},
{
"mark": {
"type": "bar",
"tooltip": true
},
"encoding": {
"x": {
"field": "__1____highlight",
"axis": {
"labels": false
}
},
"opacity": {
"condition": {
"test": {
"field": "__selected__",
"equal": "off"
},
"value": 0
},
"value": 1
},
"color": {
"field": "Total_Ventas_Acumulado",
"type": "quantitative",
"scale": {
"range": [
"#000000",
"#7F7F7F",
"#D62728"
]
},
"legend": null
}
}
},
{
"mark": {
"type": "text",
"color": "#333333",
"xOffset": 20
},
"encoding": {
"text": {
"field": "__1__",
"format": "0.2s"
},
"x": {
"field": "__1__"
}
}
}
]
},
{
"layer": [
{
"mark": {
"type": "line",
"color": "#1F77B4",
"point": {
"color": "#1F77B4",
"filled": false,
"fill": "white"
}
},
"encoding": {
"x": {
"field": "%_Acumulado"
}
}
},
{
"mark": {
"type": "text",
"xOffset": 25
},
"encoding": {
"text": {
"field": "%_Acumulado",
"format": "0.0%",
"formatType": "pbiFormat"
},
"x": {
"field": "%_Acumulado",
"axis": {
"orient": "bottom",
"formatType": "pbiFormat",
"format": "0.0%",
"values": [
0,
0.4,
0.8,
1
],
"tickCount": 4
}
},
"color": {
"field": "Total_Ventas_Acumulado",
"type": "quantitative",
"scale": {
"range": [
"white",
"white",
"black"
]
},
"legend": null
}
}
},
{
"mark": {
"type": "text"
},
"encoding": {
"text": {
"field": "PCT",
"format": "0.0%",
"formatType": "pbiFormat"
},
"x": {
"value": -25
}
}
}
]
}
],
"resolve": {
"scale": {
"x": "independent",
"color": "independent"
}
},
"encoding": {
"y": {
"field": "__0__",
"type": "nominal",
"sort": {
"field": "__1__",
"op": "sum",
"order": "descending"
},
"axis": {
"labels": true,
"title": "",
"labelFontSize": 14,
"offset": 40
}
},
"x": {
"type": "quantitative",
"axis": {
"title": ""
}
},
"tooltip": [
{
"field": "__1__",
"title": "Monto de Venta |",
"format": "$#0,,0",
"formatType": "pbiFormat"
},
{
"field": "%_Acumulado",
"title": "Porcentaje |",
"format": "0.0%",
"formatType": "pbiFormat"
}
]
}
}