Altair chart clipped when no legend title

[dougmet]

Summary

When displaying an altair plot, with a legend at the top or the bottom without a title, the chart is being clipped at the sides, losing the y-axis labels.

I'm not 100% sure if this is a streamlit issue or an altair issue. However, I do not experience this problem in a Jupyter notebook without streamlit so thought I'd start here.

Steps to reproduce

Code snippet:

import altair as alt
import streamlit as st
from vega_datasets import data

iris = data.iris()

iris_chart = alt.Chart(iris).mark_point().encode(
    x='petalWidth',
    y='petalLength',
    color=alt.Color('species', legend=alt.Legend(title=None, orient="top")),
)

st.altair_chart(iris_chart, use_container_width=True)

Expected behavior:

I would expect that the y-axis label is rendered within the viewable area. If you set title=" " then you get the following:

Actual behavior:

With title=None or title="" I get the y-axis label clipped. You can just about see it's there:

Is this a regression?

No. But I am a new user.

Debug info

• Streamlit version: 1.13.0
• Python version: 3.10.6
• Using Pipenv and Poetry
• OS version: MacOS 12.6 (M1 arm64)
• Browser version: Chrome 106.0.5249.91

Additional information

As a workaround you can simply set legend=alt.Legend(title=" ", orient="top").