uber / react-vis

Data Visualization Components
https://uber.github.io/react-vis
MIT License
8.72k stars 834 forks source link

Add a theme props to root chart types #242

Open mcnuttandrew opened 7 years ago

mcnuttandrew commented 7 years ago

The uber branded color type is really cool, but what if users want material design? or a color blind friendly theme? I propose we expose a prop on all top level charts to modify our concept of theme. The api would be like

<XYPlot theme="material">
...
</XYPlot>
balthazar commented 7 years ago

👍 and a top level component that exposes those properties to all child components

mcnuttandrew commented 7 years ago

So this would be something like

<ReactVis theme='material'>
<XYPlot> ... </XYPlot>
<XYPlot> ... </XYPlot>
</ReactVis>

question mark?

mcnuttandrew commented 7 years ago

Let's get a list of themes going?

balthazar commented 7 years ago

Yes, and these are the ones we can start with yes.

akre54 commented 7 years ago

Maybe allow passing a theme object (merged with defaults from theme.js), or pull out more scss variables instead of passing a theme string?

balthazar commented 7 years ago

Yep, we were planning on that too, theme strings only represent the default ones, thanks for the reminder!

mcnuttandrew commented 7 years ago

Added custom to the list!

mcnuttandrew commented 7 years ago

Given that we are starting to treat XYPlot as the root for chart types, it seems like this could effectively handled there!

leetercola commented 5 years ago

Can I ask where this feature landed. From the documentation there is no clear way to providing a default theme or color palette to the components as a whole. I see this enhancement ticket https://github.com/uber/react-vis/issues/823 which doesn't seem to be resolved but a user mentions creating https://github.com/swiftcarrot/react-vis-styles to solve the use case. Can we get some documentation around official direction of theming or global overrides of color palettes