mhkeller / layercake

graphics framework for sveltejs

Home Page:https://layercake.graphics

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to handle combo charts?

jhiney opened this issue · comments

What would be the best way to approach a "combo" chart, like this example:

https://observablehq.com/@d3/bar-line-chart

Specifically I am having trouble when the data set for the line chart and bar chart would be different. For example, funding by year plotted onto a bar chart, and the overall summation of funding per year plotted onto the line chart. They would have the same scale, but what would be the best way to superimpose them?

I would do them as two separate <LayerCake> components and use the position='absolute' prop (https://layercake.graphics/guide#position)

I think "one cake per dataset" is a good rule and then you super-impose them on top of one another. Just make sure the margins and scale extents are the same. Use the debug prop to double check.

Excellent, this is exactly what I was looking for. Thank you!