Deneb #27: Bar Chart Highlighted

Un gráfico de barras convencional a simple vista; hasta que colocamos el cursor encima de él y, presionamos sobre sus elementos.

JSON template to import in Deneb

{
   "$schema":"https://vega.github.io/schema/vega-lite/v5.json",
   "usermeta":{
      "deneb":{
         "build":"1.1.0.0",
         "metaVersion":1,
         "provider":"vegaLite",
         "providerVersion":"5.2.0"
      },
      "interactivity":{
         "tooltip":true,
         "contextMenu":true,
         "selection":true,
         "dataPointLimit":50
      },
      "information":{
         "name":"Deneb #27 Bar - Highlighting",
         "description":"[EN] Bar chart with Highlighting on hover. [ES] Barras con resaltado al colocar el cursor por encima. Email: jrescalante@sentidoanalitica.com",
         "author":"Sentido Analítica - José Rafael Escalante",
         "uuid":"a2168fa9-9e0a-4d83-bb09-fba68516abe0",
         "generated":"2022-02-13T00:27:32.247Z"
      },
      "dataset":[
         {
            "key":"__0__",
            "name":"Month",
            "description":"Mes - Valor Categorico",
            "type":"text",
            "kind":"column"
         },
         {
            "key":"__1__",
            "name":"Users",
            "description":"Usuarios - Valor Cuantitativo",
            "type":"numeric",
            "kind":"measure"
         }
      ]
   },
   "config":{
      "autosize":{
         "type":"fit",
         "contains":"padding"
      },
      "axis":{
         "domain":false,
         "ticks":false,
         "title":true,
         "grid":false,
         "labelAngle":0,
         "labelColor":"#FFDFD3",
         "labelFont":"Segoe UI"
      },
      "background":"#301934"
   },
   "data":{
      "name":"dataset"
   },
   "params":[
      {
         "name":"highlight",
         "select":{
            "type":"point",
            "on":"mouseover"
         }
      }
   ],
   "mark":{
      "type":"bar",
      "color":"#9a009a",
      "stroke":"#1bffc6"
   },
   "encoding":{
      "x":{
         "field":"__0__",
         "sort":[
            "Jan",
            "Feb"
         ],
         "scale":{
            "padding":0.4
         }
      },
      "y":{
         "field":"__1__",
         "type":"quantitative"
      },
      "strokeWidth":{
         "condition":[
            {
               "param":"highlight",
               "empty":false,
               "value":4
            }
         ],
         "value":0
      },
      "opacity":{
         "condition":{
            "test":{
               "field":"__selected__",
               "equal":"off"
            },
            "value":0.3
         }
      },
      "fill":{
         "condition":{
            "test":{
               "field":"__selected__",
               "equal":"on"
            },
            "value":"yellow"
         }
      }
   },
   "view":{
      "stroke":"transparent"
   }
}