Forum Discussion

distra's avatar
distra
Frequent Visitor
1 year ago
Solved

Dynamic y-Axis calculation with Deneb

Hi everyone, hi giammariam, I have recently started exploring Deneb Visuals. In my particular case I want to display Average Cost per Month while offering to switch between currencies on my Dashbo...
  • dm-p's avatar
    1 year ago

    Hi distra,

     

    The area mark is designed to have a zero baseline, so even if you cut the domain, it is trying to plot the remainder of the shape outside the domain (as the second y-value is zero). It would work with a line mark as there is only a single y-coordinate to worry about.

     

    So, what is happening here is that your y-scale and axis are being correctly set to the desired range, but the size of your chart is condensing the vertical scale into the equivalent amount of space. You can see it "kind of" working if you make the visual container larger, e.g.:

     

    (ignore the 'undefined'; that's a copy/paste issue with your sample data at my end)

     

    One way to resolve this is to instruct Vega-Lite to clip the area mark. You should be able to make the following changes to your spec:

     

    1. Update the scale as follows (removing "zero": false), e.g.:

    {
      ...
      "encoding": {   
        "y": {
          "field": "Avg Rate dynamic Currency",
          "type": "quantitative",
          "scale": {
            "domain": [80, 235]  // or whatever you need min/max to be
          },
          ...
        },
        ...
      }
      ...
    }

     

    2. Update the area mark definition to include a clip as follows:

     

    {
      ...
      "layer": [
        {
          "description": "sparkline definition",
          "mark": {
            "type":"area",
            "clip": true
          },
          ...
        },
        ...
      }
      ...
    }

     

    This will now cut the baseline of the plotted area, e.g.:

     

    Hopefully this should be all you need to resolve. Good luck!

     

    (and thanks for using Deneb!)

     

    Daniel