Drilldown-possibility on bar-chart,histogram,pie-chart...

[TONODEKEN]

Given the code like in https://altair-viz.github.io/gallery/scatter_with_layered_histogram.html

It would be nice if there would be a possibility to open a grid with the details if you click on one of the bars of pie of the graph or see the details when a graph shown sums, means,....

Please follow these steps to make it more efficient to respond to your feature request.

Any help is appreciated !

Thanks in advance.

[mattijn]

You will have to define this by yourself, but I've heard the request of drilling more often.

I personally like to have an example in the docs that can drill/highlight/filter from a bar chart of a grouped timeseries by year to eg yearmonth groups.

In the following example I placed two bar charts side by side, one grouped by year and the other by yearmonth (the source data is in days):

import altair as alt
from vega_datasets import data

source = data.stocks()
source = source[source.symbol == 'GOOG']

# define a point selection
point = alt.selection_point(encodings=['x'])

# define a bar chart aggregated by year
# change the color of the bar when selected
bar_year = (
    alt.Chart(
        data=source, 
        title=['bar chart grouped by `year`', 'click bar to select year']
    )
    .mark_bar(tooltip=True).encode(
        x=alt.X('date:O').timeUnit('year'),
        y=alt.Y('price:Q').aggregate('sum'),
        color=alt.condition(point, alt.value('#1FC3AA'), alt.value('#8624F5'))
    )
    .add_params(point)
)

# define a bar chart aggregated by yearmonth
# change the color of all months of the selected year in the other chart.
bar_yearmonth = (
    alt.Chart(
        data=source, 
        width=alt.Step(5), 
        title=['bar chart grouped by `yearmonth`', 'highlight months of selected year']
    )
    .mark_bar(tooltip=True).encode(
        x=alt.X('date:O').timeUnit('yearmonth'),
        y=alt.Y('price:Q').aggregate('sum'),
        color=alt.condition(point, alt.value('#1FC3AA'), alt.value('#8624F5'))
    )
)

# horizontal concatenate
comb_bars = bar_year | bar_yearmonth
comb_bars

Currently the bar corresponding to year 2008 is selected in the left-chart and it would be nice if then the months in the year 2008 are highlighted in the chart on the right.

I tried a bit, but could not get it to work. Maybe someone else knows.

[binste]

It works if you use an expression for the colors of bar_yearmonth, that's the only change compared to your code:

import altair as alt
from vega_datasets import data

source = data.stocks()
source = source[source.symbol == 'GOOG']

# define a point selection
point = alt.selection_point(encodings=['x'])

# define a bar chart aggregated by year
# change the color of the bar when selected
bar_year = (
    alt.Chart(
        data=source, 
        title=['bar chart grouped by `year`', 'click bar to select year']
    )
    .mark_bar(tooltip=True).encode(
        x=alt.X('date:O').timeUnit('year'),
        y=alt.Y('price:Q').aggregate('sum'),
        color=alt.condition(point, alt.value('#1FC3AA'), alt.value('#8624F5'))
    )
    .add_params(point)
)

# define a bar chart aggregated by yearmonth
# change the color of all months of the selected year in the other chart.
bar_yearmonth = (
    alt.Chart(
        data=source, 
        width=alt.Step(5), 
        title=['bar chart grouped by `yearmonth`', 'highlight months of selected year']
    )
    .mark_bar(tooltip=True).encode(
        x=alt.X('date:O').timeUnit('yearmonth'),
        y=alt.Y('price:Q').aggregate('sum'),
        color=alt.condition(f"year({point.name}.year_date) === year(datum['yearmonth_date'])", alt.value('#1FC3AA'), alt.value('#8624F5'))
    )
)

# horizontal concatenate
comb_bars = bar_year | bar_yearmonth
comb_bars

I pasted the vega-lite spec into the [Vega Editor] to inspect the intermediate datasets in "Data Viewer" to find out that I can access the field yearmonth_date:

I found the .year_date attribute for the parameter in the signal viewer:

I don't know if there is also a way without the Vega Editor to infer this information.

[ChristopherDavisUCI]

That's very elegant @binste!

I was wondering if an inelegant solution might be to layer a green chart on top of the right-hand purple chart, and then use a transform_filter to only show the selected portion of the green chart? I didn't get around to trying it out, but just thought I'd write the idea down (and give others a chance to say if it's too inefficient).

[joelostblom]

In addition to what has already been said, here is a Vega example with drilldown-like functionality https://vega.github.io/vega/examples/job-voyager/. And there is also an issue somewhere in the repo where we "drill down" by filtering faceted images from a selection but Ican't find it right now. I agree that we should add some of the examples above to the docs

[mattijn]

Just want to say that it is a very interesting solution @binste! Nice.

For another discussion: somehow wished we could facilitate Python users more to surface these internal computed datasets and defined parameters (signals) without jumping back and forth between the Vega editor.

[jonmmease]

For another discussion: somehow wished we could facilitate Python users more to surface these internal computed datasets and defined parameters (signals) without jumping back and forth between the Vega editor.

That's something that VegaFusion may be able to help with down the road as it can already evaluate Vega datasets and signals on the Python side