Defining Y axis Min value in Stacked area chart

Question

New to Deneb and Vega Lite, I am trying to create a combo stacked area chart and line chart. For simplicity, I didnt include the line chart as it works fine. The issue I am having is to set the Y axis Min/Max.

Based on the research I did, it looks like I am supposed to use the "scale" syntax within the "y" settings. However when I do so, the chart domain is "shrinking" and the area chart is going "below" the X axis, instead of stopping to the min Y axis value. Here are some screen shots of the behavior described above.

Regular stacked area chart with default Y axis setup: Stacked Area chart with Default Y axis This works fine but this is not the behavior that I want.

Stacked are chart where I manually define the Y scale to [1500,3500]. Stacked Area chart with scale added to Y axis

{
  "data": {
    "name": "dataset"
  },
  "transform": [
    {
      "calculate": "datum['CUSTOMER'] + ' - ' + datum['WORKSCOPE']",
      "as": "CUST_WORKSCOPE"
    },
    {
      "calculate": "if(datum['LABEL'] == null, '', datum['LABEL'])",
      "as": "LABEL_NEW"
    }
    
  ],

      "encoding": {
        "x": {
          "field": "DATE",
          "type": "temporal",
          "timeUnit":"binnedyearmonth",
          "axis":{
            "labelAlign":"center",
            "labelFontSize": 11,
            "labelFontWeight":"bold",
            "title":null,
            "ticks": true
          }
        },
        "y": {
          "field": "DEMAND",
          "type": "quantitative",
          "stack":"zero",
          "aggregate":"sum",
          "impute":null,
          "scale": {"domain": [1500, 3500]},
          "axis":{
            "labelAlign":"right",
            "labelFontSize": 10,
            "title":null,
            "format":".2s"
          }
        },
        "color": {
          "field": "SORTING",
          "scale": {"scheme": "tableau10","type": "ordinal"}
          ,"legend":null
        },
        "text": {
          "field": "LABEL_NEW",
          "type": "nominal"
        }
        ,"order":{
          "field":"SORTING",
          "type": "quantitative",
          "sort": "ascending"
        }
      },
        //AREA, LINES and LABELS
      "layer":[
            {
              
              "mark": {
                "type": "area",
                "tooltip": true,
                "line":{"strokeWidth":3},
                "interpolate":"step",
                "fillOpacity":1
              }
            },
            {
              "mark": {
                "type": "text",
                "align": "center",
                "baseline": "middle",
                "fontSize": 9,
                "strokeWidth":2,
                "stroke":"white",
                "fontWeight":"bolder",
                "lineBreak": "%&$"
              },
              "encoding": {
                "y":{
                  "field":"DEMAND",
                  "bandPosition": 0.5
                }
              }
            },
            {
              "mark": {
                "type": "text",
                "align": "center",
                "baseline": "middle",
                "fontSize": 9,
                "fontWeight":"bolder",
                "lineBreak": "%&$"
              },
              "encoding": {
                "y":{
                  "field":"DEMAND",
                  "bandPosition": 0.5
                }
              }
            }
          ]

}

Trying to link the pbixfile: pbix file

Thank you for you help.

PS: this is my first time posting here, so let me know if you need more information

Answer 1

Try using the clip:true within the mark spec. Example:

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "width": 300,
  "height": 200,
  "data": {"url": "data/unemployment-across-industries.json"},
  "mark": {"type": "area", "clip": true},
  "encoding": {
    "x": {"timeUnit": "yearmonth", "field": "date", "axis": {"format": "%Y"}},
    "y": {"aggregate": "sum", "field": "count", "title": "count",
    "scale": {"domain": [4500, 9000]}}
  }
}

Read more about "clipping" here:

https://vega.github.io/vega-lite/docs/scale.html