Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Stacked bar chart? #5

Closed
peterbe opened this issue Oct 15, 2019 · 8 comments
Closed

Stacked bar chart? #5

peterbe opened this issue Oct 15, 2019 · 8 comments

Comments

@peterbe
Copy link

peterbe commented Oct 15, 2019

Can this be done or is this a feature request?

@jwilber
Copy link
Owner

jwilber commented Oct 15, 2019

Hey @peterbe, currently this would be a feature request.
It's something I'd like to add as well, maybe this weekend :)

@jwilber
Copy link
Owner

jwilber commented Oct 15, 2019

I should mention if you/anyone wants to submit a pr that’d be awesome as well and I’d be super down to assist 😎

@peterbe
Copy link
Author

peterbe commented Oct 15, 2019

I doubt that I'll get around to it. I'm currently not blocked as this is just an experiment I was planning to do. Perhaps when my experiment materializes more I might be capable to help out but I doubt it's an investment I'm ready to do any time soon.

If you get around to it, it would be great but don't hope for me being a good open-source citizen :)

@jwilber
Copy link
Owner

jwilber commented Oct 16, 2019

No worries! I'll make sure to ping you when one is added

@jolo-dev
Copy link

Can I try?

@jwilber
Copy link
Owner

jwilber commented Oct 22, 2019

@jolo-dev yep!

Some advice: If you look at, say, the Bar class, there's a lot of stuff you can reuse (at some point I'll throw these into an ABC).

Basically, when defining a new chart, you just need to define 2-3 methods:

  • drawFromFile(): roughjs code for data from files.
  • drawFromObject(): roughjs code for data from parameters.
  • addInteraction: This is where the original, non-rough d3 code goes. Basically, you just create a stacked barchart as normal in d3 that will exist behind the roughjs version. This allows for interactivity on hover.

Note that much of the code for the above methods in the Bar class may itself be recycled.

You should be able to reuse all of the other methods. If you need to update the axis values, edit the addAxes() method (no need to touch makeAxesRough().

Feel free to reach out with any questions if you decide to approach this, and thanks for the interest!

@jolo-dev
Copy link

@jwilber Wow, thanks for your support. Stacks are created. Let's see if I can do a PR soon.

@jwilber
Copy link
Owner

jwilber commented Nov 16, 2019

Hey @peterbe , this was added by @jolo-dev and is now available in version 1.0.5 :)

Example

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants