Commit Graph

4 Commits

Author SHA1 Message Date
e26chiu 912fd50216 Refactor PieChart
continuous-integration/drone/push Build is passing Details
2022-12-21 23:08:27 -05:00
e26chiu b837032ca0 Merge branch 'main' of https://git.csclub.uwaterloo.ca/www/cs-2022-class-profile into personal-page 2022-12-21 21:25:47 -05:00
Mark Chiu 550029feb0 Change Graphs to use tooltips (Closes #97) (#112)
continuous-integration/drone/push Build is passing Details
Changes:
- Remove Text that is displayed when hovering over the bar in the Bar Graph and Grouped Bar Graph - DIDN'T DO IT FOR Pie Charts since I wasn't sure if we still want the text or no.
- Add tooltips for Bar Graph + Grouped Bar Graph + Pie Chart

NOTE: weird tooltip position with PieChart, might be related to other tooltip bugs we have

Used this approach for the PieChart: https://codesandbox.io/s/mjp8lmvop?expanddevtools=1
The only approach that worked with the PieChart required to have the PieSlice code within the PieChart component.

Improvement we can make:
- For the Pie Chart, we could display the percentage and the number of answers in the tooltip to provide more context.
- For the Pie Chart, we could also display label in tooltip.

Co-authored-by: e26chiu <e26chiu@csc.uwaterloo.ca>
Reviewed-on: #112
Reviewed-by: Shahan Nedadahandeh <snedadah@csclub.uwaterloo.ca>
2022-12-21 16:23:32 -05:00
Jared He 9200e5f491 Pie chart component (#19)
continuous-integration/drone/push Build is passing Details
Closes #5.

To fix:

- [x] Inner pie slice text not perfectly centered

- [x] Create optional props for `padRadius` and `innerRadius`

- [x] Change colors to global colors and merge from main to get fonts

Also, outer labels can get cut off if they are long enough, but the `labelWidth` is provided as a prop for the user to adjust.

Staging url: https://j285he-pie-chart-csc-class-profile-staging-snedadah.k8s.csclub.cloud

Co-authored-by: Jared He <66887902+jaredjhe@users.noreply.github.com>
Reviewed-on: #19
Reviewed-by: Amy <a258wang@csclub.uwaterloo.ca>
2022-09-07 22:20:30 -04:00