Create util file for graph default props value #82

Closed
opened 3 months ago by e26chiu · 0 comments
Collaborator

To keep the consistency of the layout across pages, we can have a util file to contain all the graph default props value shared across graph components. This can take the same format as Color.ts to enable smart autocomplete in visual studio code.

These default graph props can include the following props:

const defaultGraphWidth = isMobile ? width / 1.25 : width / 2;
const defaultPieChartWidth = isMobile ? width / 1.25 : width / 3;
const defaultGraphHeight = 500;

const defaultBarGraphMargin = { top: 20, bottom: 80, left: 60, right: 20 };

const defaultLabelSize = 24;
const defaultLabelWidth = 100;

Note the isMobile will probably have to be passed in as a function since this value is determined in the page.

To keep the consistency of the layout across pages, we can have a util file to contain all the graph default props value shared across graph components. This can take the same format as [Color.ts](https://git.csclub.uwaterloo.ca/www/cs-2022-class-profile/src/branch/main/utils/Color.ts) to enable smart autocomplete in visual studio code. These default graph props can include the following props: ```javascript const defaultGraphWidth = isMobile ? width / 1.25 : width / 2; const defaultPieChartWidth = isMobile ? width / 1.25 : width / 3; const defaultGraphHeight = 500; const defaultBarGraphMargin = { top: 20, bottom: 80, left: 60, right: 20 }; const defaultLabelSize = 24; const defaultLabelWidth = 100; ``` Note the `isMobile` will probably have to be passed in as a function since this value is determined in the page.
e26chiu added the
Config
label 3 months ago
e26chiu self-assigned this 3 months ago
e26chiu closed this issue 2 months ago
Sign in to join this conversation.
No Milestone
No project
No Assignees
1 Participants
Notifications
Due Date

No due date set.

Dependencies

No dependencies set.

Reference: www/cs-2022-class-profile#82
Loading…
There is no content yet.