Stacked Stream

Info - How to setup Chart

import pandas as pd
from ipyvizzu import Chart, Data, Config, Style

data_frame = pd.read_csv(
    "https://ipyvizzu.vizzuhq.com/0.15/assets/data/music_industry_history_1.csv",
    dtype={"Year": str, "Timeseries": str},
)
data = Data()
data.add_data_frame(data_frame)

chart = Chart()
chart.animate(data)

This is a 2-step animation:

1st: set the Split parameter to True

2nd:

• move the Measure to the X-axis
• set the Align parameter 'center'
• set the Split parameter to False
• arrange the markers in reverse order
• switch the Geometry from Area to Rectangle

method = """
      let year = parseFloat(event.data.text);
      if (!event.data.text.includes("$") && !isNaN(year) && year % 5 != 0)
        event.preventDefault();
    """
handler = chart.on("plot-axis-label-draw", method)

chart.animate(
    Config(
        {
            "channels": {
                "x": "Year",
                "y": ["Revenue [$]", "Format"],
                "color": "Format",
            },
            "geometry": "area",
            "align": "center",
        }
    ),
    Style(
        {"plot": {"yAxis": {"label": {"numberScale": "K, M, B, T"}}}}
    ),
)

chart.animate(Config({"split": True}))

chart.animate(
    Config(
        {
            "channels": {
                "y": ["Revenue [$]", "Year"],
                "x": ["Format"],
            },
            "geometry": "rectangle",
            "align": "min",
            "split": False,
            "sort": "byValue",
            "reverse": True,
        }
    )
)

chart.feature("tooltip", True)