Area charts broken in >=5.14.1

[lukasmasuch]

Bug Description

We would like to update the vega-lite dependency in Streamlit to the latest version. However, the area charts seem to be broken in vega-lite >=5.14.1. This might be related to this PR: https://github.com/vega/vega-lite/pull/9018

in 5.14.0 (expected):

in 5.14.1 (broken):

Here is the current spec based on st.area_chart in Streamlit. I will try to provide a reproducible example within the next couple of days:

{
  "data": {"name": "6275643184"},
  "mark": {"type": "area"},
  "encoding": {
    "color": {
      "field": "color--p5bJXXpQgvPz6yvQMFiy",
      "legend": {"titlePadding": 5, "offset": 5, "orient": "bottom"},
      "title": " ",
      "type": "nominal"
    },
    "opacity": {"value": 0.7},
    "tooltip": [
      {
        "field": "index--p5bJXXpQgvPz6yvQMFiy",
        "title": "index",
        "type": "quantitative"
      },
      {
        "field": "value--p5bJXXpQgvPz6yvQMFiy",
        "title": "value",
        "type": "quantitative"
      },
      {
        "field": "color--p5bJXXpQgvPz6yvQMFiy",
        "title": "color",
        "type": "nominal"
      }
    ],
    "x": {
      "axis": {"grid": false, "tickMinStep": 1},
      "field": "index--p5bJXXpQgvPz6yvQMFiy",
      "scale": {},
      "title": "",
      "type": "quantitative"
    },
    "y": {
      "axis": {"grid": true},
      "field": "value--p5bJXXpQgvPz6yvQMFiy",
      "scale": {},
      "title": "",
      "type": "quantitative"
    }
  },
  "height": 0,
  "params": [
    {
      "name": "param_6",
      "select": {"type": "interval", "encodings": ["x", "y"]},
      "bind": "scales"
    }
  ],
  "width": 704,
  "$schema": "https://vega.github.io/schema/vega-lite/v5.17.0.json",
  "autosize": {"type": "fit", "contains": "padding"},
}

Checklist

• [x] I checked for duplicate issues.

[domoritz]

@yhoonkim @kanitw can you look at this?

[lukasmasuch]

bump: just tried to update Streamlit to use 5.21 ... but the issue still exists :(

[domoritz]

Could you bisect what change causes this issue?

[lukasmasuch]

I looked more into it, and it seems that the default stack behavior for area charts was changed in 5.14.1. To fix this on our side, we just need to provide stack=False on the axis. With this workaround, we can update to the latest vega-lite.

To close this issue, I'm not sure if the behavior < 5.14.1 was broken or if the current behavior is broken. Other related issues:

https://github.com/vega/vega-lite/issues/9170 https://github.com/vega/altair/pull/3558

[domoritz]

Stacking should work if the data for the line and area are aligned. If not, it's hard to say what the correct behavior is anyway so that's probably what's going on here. Also, you can't stack negative values. Your original example isn't actually stacked so I don't think the title of this issue is correct. Without an example it's hard to say whether there is a bug but I think this is working as expected and you can disable stacking for you use case. Glad to hear it's what you need to update.

@yhoonkim and @kanitw do you agree? Asking since you worked on https://github.com/vega/vega-lite/pull/9018.