{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "usermeta": {
    "deneb": {
      "build": "1.6.2.1",
      "metaVersion": 1,
      "provider": "vegaLite",
      "providerVersion": "5.16.3"
    },
    "interactivity": {
      "tooltip": true,
      "contextMenu": false,
      "selection": false,
      "highlight": false,
      "dataPointLimit": 50
    },
    "information": {
      "name": "Slicer con Señales Dinámicas (binding en vivo)",
      "description": "Un param de Vega-Lite enlazado a un dropdown (bind: select) filtra el gráfico por la dimensión Región en vivo. Es el patrón de un slicer, declarado dentro del spec Deneb. Autor: Cristobal Salcedo Beltrán."
    },
    "dataset": [
      {
        "key": "__0__",
        "name": "Región",
        "description": "Dimensión que controla el slicer (el dropdown filtra por este campo)",
        "type": "text",
        "kind": "column"
      },
      {
        "key": "__1__",
        "name": "Categoría",
        "description": "Categoría mostrada en el eje X",
        "type": "text",
        "kind": "column"
      },
      {
        "key": "__2__",
        "name": "Valor",
        "description": "Medida cuantitativa agregada por categoría",
        "type": "numeric",
        "kind": "measure"
      }
    ]
  },
  "config": {
    "axis": {
      "labelColor": "#605E5C",
      "labelFontSize": 14,
      "titleFontSize": 16,
      "titleColor": "#252423"
    },
    "axisX": {
      "labelAngle": 0,
      "labelPadding": 5
    },
    "view": {
      "stroke": "transparent"
    }
  },
  "title": {
    "text": "Valor por Categoría — filtrado por Región",
    "anchor": "start",
    "fontSize": 18,
    "color": "#252423"
  },
  "description": "Slicer en vivo: el dropdown Región filtra las barras mediante un param + bind de Vega-Lite.",
  "data": {
    "name": "dataset"
  },
  "params": [
    {
      "name": "regionSel",
      "value": "Todas",
      "bind": {
        "input": "select",
        "name": "Región:  ",
        "options": [
          "Todas",
          "Norte",
          "Sur",
          "Este",
          "Oeste"
        ]
      }
    }
  ],
  "transform": [
    {
      "filter": "regionSel == 'Todas' || datum['__0__'] == regionSel"
    }
  ],
  "mark": {
    "type": "bar",
    "cornerRadiusEnd": 3,
    "tooltip": true,
    "color": "#118DFF"
  },
  "encoding": {
    "x": {
      "field": "__1__",
      "type": "nominal",
      "title": "Categoría",
      "sort": "-y"
    },
    "y": {
      "aggregate": "sum",
      "field": "__2__",
      "type": "quantitative",
      "title": "Valor"
    },
    "tooltip": [
      {
        "field": "__1__",
        "type": "nominal",
        "title": "Categoría"
      },
      {
        "aggregate": "sum",
        "field": "__2__",
        "type": "quantitative",
        "title": "Valor",
        "format": ",.0f"
      }
    ]
  }
}