GoFish GraphicsCharts Without the Headache

layer({ coord: clock() }, [
    Chart(seafood)
        .flow(
            spread({ by: "lake", dir: "x", spacing: (2 * Math.PI) / 6,
                     mode: "center", y: 50, label: false }),
            derive((d) => orderBy(d, "count")),
            stack({ by: "species", dir: "y", label: false }),
        )
        .mark(rect({ h: "count", fill: "species" }).name("bars")),
    Chart(select("bars"))
        .flow(group({ by: "species" }))
        .mark(area({ opacity: 0.8 })),
]).render(root, { w: 500, h: 300, transform: { x: 250, y: 150 }, axes: true });

Layer({"coord": clock()}, [
    chart(seafood)
        .flow(
            spread(by="lake", dir="x", spacing=2 * math.pi / 6,
                   mode="center", y=50, label=False),
            derive(lambda d: sorted(d, key=lambda r: r["count"])),
            stack(by="species", dir="y", label=False),
        )
        .mark(rect(h="count", fill="species").name("bars")),
    chart(select("bars"))
        .flow(group(by="species"))
        .mark(area(opacity=0.8)),
]).render(w=500, h=300, axes=True)