Vega spec from Fri Mar 22 2024

spec.json

{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "width": 400,
  "height": 400,
  "signals": [
    {
      "name": "increase",
      "on": [{"events": "rect:click", "force": true, "update": "datum"}]
    }
  ],
  "data": [
    {
      "name": "table",
      "values": [
        {"id": 1, "value": 0},
        {"id": 2, "value": 0},
        {"id": 3, "value": 0}
      ],
      "on": [
        {
          "trigger": "increase",
          "insert": "{id:increase.id+10,value:increase.value}"
        }
      ]
    }
  ],
  "scales": [
    {
      "name": "x",
      "type": "band",
      "padding": 0.1,
      "domain": {"data": "table", "field": "id"},
      "range": "width"
    }
  ],
  "marks": [
    {
      "type": "rect",
      "from": {"data": "table"},
      "encode": {
        "enter": {"y": {"signal": "height/2 - min(height,50)/2"}},
        "update": {
          "height": {"signal": "min(height, 50)"},
          "x": {"field": "id", "scale": "x"},
          "width": {"scale": "x", "band": true}
        }
      }
    },
    {
      "type": "text",
      "from": {"data": "table"},
      "encode": {
        "enter": {
          "align": {"value": "center"},
          "baseline": {"value": "middle"}
        },
        "update": {
          "x": {
            "field": "id",
            "scale": "x",
            "offset": {"signal": "bandwidth('x')/2"}
          },
          "y": {"signal": "height/2"},
          "text": {"field": "value"}
        }
      }
    }
  ]
}