Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Example of a chart with named thresholds #1109

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

jmansilla
Copy link

Follow up of #1067

@jakevdp
Copy link
Collaborator

jakevdp commented Aug 22, 2018

Thanks for submitting this! I like the threshold example, but the chart itself is a bit difficult to understand... I've played around with it but haven't come up with any ideas of an effective visualization of this data that uses these thresholds... is there another dataset we could use?

@jmansilla
Copy link
Author

jmansilla commented Aug 22, 2018 via email

@afonit
Copy link
Contributor

afonit commented Aug 22, 2018

Perhaps one with bands? for example ratings on imdb as bad/good/excellent?
image
Perhaps that would be a different example entirely as it is not necessarily thresholds but bands.

@jakevdp
Copy link
Collaborator

jakevdp commented Aug 22, 2018

@afonit – that's a good option... I think the key thing to illustrate here is labeling of the thresholds, and it would be well-suited to this example.

@jmansilla
Copy link
Author

Perhaps something like this
https://i.stack.imgur.com/4RE1S.png
(just the lines, not the area)
?

@jakevdp
Copy link
Collaborator

jakevdp commented Aug 23, 2018

Perhaps something like this

That looks good! maybe using the seattle_temps dataset from Vega-Lite?

@mattijn
Copy link
Contributor

mattijn commented Mar 18, 2023

I like the goal of this PR, meanwhile its been a few year. I tried a few things, but to get something clear and concise is not super easy here.

Trial 1:

import pandas as pd
from vega_datasets import data

df_data = data.seattle_weather()
df_thresholds = pd.DataFrame(
    data={"threshold_value": [50, 150], "threshold_label": ["> 50 mm", "> 150 mm"]}
)

chart_bar = alt.Chart(df_data).mark_bar().encode(
    x=alt.X('yearmonth(date):T', title=None),
    y=alt.Y("sum(precipitation):Q"),
    color=alt.Color("sum(precipitation):Q", scale=alt.Scale(type='threshold', domain=[50, 150]))         
)

chart_rule = alt.Chart(df_thresholds).mark_rule().encode(y=alt.Y("threshold_value", title='Sum of precipitation'))

chart_text = chart_rule.mark_text(x=alt.expr('width'), align="right", dx=-15, dy=-7, fontWeight="bold", fontSize=12).encode(
    text="threshold_label"
)

alt.layer(chart_bar, chart_rule, chart_text).properties(title="monthly precipitation with thresholds")

image

Trial 2:
A bit more lengthy. including a for-loop:

import pandas as pd
from vega_datasets import data

df_data = data.seattle_weather()
df_thresholds = pd.DataFrame(
    data={"threshold_value": [50, 150], "threshold_label": ["> 50 mm", "> 150 mm"]}
)

base = (
    alt.Chart()
    .transform_timeunit(year_month="yearmonth(date)")
    .transform_aggregate(sum_precip="sum(precipitation)", groupby=["year_month"])
)

bar_coll = []
bar_coll.append(
    base.mark_bar().encode(
        x=alt.X("year_month:T", title=None),
        y=alt.Y("sum_precip:Q", title="Sum of precipitation"),
        color=alt.datum("<= 50 mm"),
    )
)
for idx, row in df_thresholds.iterrows():
    bar_th = (
        base.transform_filter(alt.datum.sum_precip >= row.threshold_value)
        .transform_calculate(baseline=f"{row.threshold_value}")
        .mark_bar()
        .encode(
            x=alt.X("year_month:T"),
            y=alt.Y("baseline:Q"),
            y2=alt.Y2("sum_precip:Q"),
            color=alt.datum(row.threshold_label),
        )
    )
    bar_coll.append(bar_th)
    
# collection of bar charts based on threshold values
chart_bar_coll = alt.layer(*bar_coll, data=df_data)

# rules based on threshold values + text based on threshold labels
chart_rule = alt.Chart(df_thresholds).mark_rule().encode(y=alt.Y("threshold_value"))
chart_text = chart_rule.mark_text(
    x=alt.expr('width'), align="right",dx=-15, dy=-7, fontWeight="bold", fontSize=12
).encode(
    text="threshold_label",
)

# combine
alt.layer(chart_bar_coll, chart_rule, chart_text).configure_range(
    ["#9CC8E2", "#5BA3CF", "#2978B8"]
).properties(title="monthly precipitation with thresholds")

image

Anyone any suggestions to bring this forward?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants