continuous-integration/drone/push Build is passingDetails
Applied the fix used by the WordCloud to all graphs so that tooltips will be properly positioned, even if the graph is centered on the page. Did so by refactoring some tooltip logic in to a common getTooltipPosition used by all graphs.
One thing is that this simplifies all the tooltips to simply follow the mouse, instead of locking onto certain "blocks"/bars like in the grouped bar graph, which is more consitant with all the other tooltips, since we only had this in some cases.
Do we think that having the tooltip be sticky to a certain bar/group is important?
Closes#89https://fix-tooltip-center-csc-class-profile-staging-snedadah.k8s.csclub.cloud/samplePage/
Co-authored-by: shahanneda <shahan.neda@gmail.com>
Reviewed-on: #118
Reviewed-by: Mark Chiu <e26chiu@csclub.uwaterloo.ca>
continuous-integration/drone/push Build is passingDetails
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>
continuous-integration/drone/push Build is passingDetails
* Add alternating label functionality to vertical bar graphs when the width of the graph reaches its `minWidth`
* Add `minWidth` prop to horizontal and vertical bar graphs, by default, set to 500 (make a PR to contain these default prop values)
* Add overflow scroll on mobile for horizontal and vertical bar graphs
https://fix-mobile-bug-labels-csc-class-profile-stag-snedadah.k8s.csclub.cloud/
Co-authored-by: e26chiu <e26chiu@csc.uwaterloo.ca>
Co-authored-by: shahanneda <shahan.neda@gmail.com>
Reviewed-on: #83
Reviewed-by: Shahan Nedadahandeh <snedadah@csclub.uwaterloo.ca>
continuous-integration/drone/push Build is passingDetails
Closes#2
Notes:
- Named the component the GroupedBarGraph since it can support bar groups of > 2 bars.
- The horizontal graph is mostly a copy of the vertical graph, with slight modifications. This ended up being the ~~laziest~~ easiest way to implement it.
Reviewed-on: #65
Reviewed-by: Shahan Nedadahandeh <snedadah@csclub.uwaterloo.ca>
continuous-integration/drone/push Build is passingDetails
Adds a `<BarGraphHorizontal />` component and a `<BarGraphVertical />` component.
Closes#1.
Possible changes for the future:
- Refactor to make the horizontal and vertical bar graphs into one component
- Add (optional) graph title
Co-authored-by: Amy Wang <a258wang@csclub.uwaterloo.ca>
Reviewed-on: #16
Reviewed-by: Shahan Neda <snedadah@csclub.uwaterloo.ca>
Shahan Nedadahandeh
Mark Chiu
Amy Wang