docs: add example with overlapping bars in a grouped bar chart

[mattijn]

This PR adds an example that demonstrates how to create partially overlapping bars in a grouped bar chart.

The example looks as such:

The overlapping effect was created using the following code (method-based syntax):

import altair as alt
import pandas as pd

source = pd.DataFrame(
    {
        "category": list("AABBCC"),
        "group": list("xyxyxy"),
        "value": [0.1, 0.6, 0.7, 0.2, 0.6, 0.1],
    }
)

base = alt.Chart(source, width=alt.Step(12)).encode(
    x="category:N",
    y="value:Q",
    xOffset=alt.XOffset("group:N").scale(paddingOuter=0.5),
)

alt.layer(
    base.mark_bar(size=20, stroke="white", fillOpacity=0.9).encode(fill="group:N"),
    base.mark_text(dy=-5).encode(text="value:Q"),
)

Explanation:

• The partial overlap is achieved by controlling the allocated space for each bar and its actual size.
• width=alt.Step(12) in alt.Chart() defines the space allocated for each bar and thus defines the amount of overlap.
• mark_bar(size=20) sets the actual width of the bars.
• The paddingOuter=0.5 parameter in the xOffset scale creates spacing between the categories along the x-axis, to make sure the groups are distinct

[dangotbanned]

Liking this @mattijn!

I had one suggestion on the labels, but since I'm not fully convinced on my alternative I'm happy to approve as is

[mattijn]

Thanks for your review, I will open a new PR with another example based on your suggestion to have text overlay on the bars instead of the text above the bars. That also will highlight an issue that I hope becomes easier to write with your work on expressions (edit: done per #3614).