Search code examples
vega-liteyaxis

Vega-Lite Calculated Scale domainMax


I'm trying to calculate a value for domainMax on the Y-axis scale. I tried the following example where I want the Y-axis domainMax to be one greater than the maximum value in the dataset field named "value". The example produces the error 'Unrecognized signal name: "domMax"'. How can I get it to work?

{
  "data": {
    "values": [
      {"date": "2021-03-01T00:00:00", "value": 1},
      {"date": "2021-04-01T00:00:00", "value": 3},
      {"date": "2021-05-01T00:00:00", "value": 2}
    ]
  },
  "transform": [
    { "calculate": "max(datum.value)+1","as": "domMax"}
  ],
  "mark": "line",
  "encoding": {
    "x": {
      "field": "date",
      "type": "temporal"
    },
    "y": {"field": "value", "type": "quantitative",
      "scale": {"domainMax": {"expr": "domMax"}}
    }
  }
}

Solution

  • I tried to get a custom domain based on the data but hit the same limitations as you did.

    In my case, I update the data from the outside a bit like the streaming example. I compute the domain from the outside and modify them in the visualization with params. This is quite easy as vega-lite params are exposed as vega signals.

    This is the gist of the layout:

      {
        "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
        "params": [
          {
            "name": "lowBound",
            "value": -10
          },
          {
            "name": "highBound",
            "value": 100
          }
        ],
        ../..
        "vconcat": [
          {
            "name": "detailed",
            ../..
            "layer": [
              { 
                ../..
                "mark": "line",
                "encoding": {
                  "y": {
                    "field": "value",
                    "title": "Temperature",
                    "type": "quantitative",
                    "scale": {
                      "domainMin": {
                        "expr": "lowBound"
                      },
                      "domainMax": {
                        "expr": "highBound"
                      }
                    }
                  },
    ...
    

    The lowBound and highBound are dynamically changed through vega signals. I change them with the regular JS API.