You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
comparison,// result from invoking 'allStorage' in 'PerformanceVisx'
49
56
setSeries,// setter function to update the state located in 'PerfomanceVisx'
50
57
series,// initialized as boolean, can be an object, from state set in 'PerformanceVisx'
51
-
setAction // setter function to update the state located in 'PerfomanceVisx'
58
+
setAction,// setter function to update the state located in 'PerfomanceVisx'
52
59
}=props;
53
60
const[snapshots]=useState(0);// creates a local state snapshots and sets it to a value of 0 (why is there no setter function? Also, why use state when it's only referenced once and never changed? 08/03/2023)
54
61
const[open,setOpen]=useState(false);// creates a local state setOpen and sets it to false (why is there no setter function? 08/03/2023)
constcalculateMaxTotalRender=(serie: number): number=>{// This function will iterate through the snapshots of the series, and grab the highest render times (sum of all component times). We'll then use it in the renderingScale function and compare with the render time of the current tab. The max render time will determine the Y-axis's highest number.
// This function will iterate through the snapshots of the series, and grab the highest render times (sum of all component times). We'll then use it in the renderingScale function and compare with the render time of the current tab. The max render time will determine the Y-axis's highest number.
constrenderingScale=scaleLinear<number>({// this function will use the domain array to assign each key a different color to make rectangle boxes and use range to set the color scheme each bar
120
+
constrenderingScale=scaleLinear<number>({
121
+
// this function will use the domain array to assign each key a different color to make rectangle boxes and use range to set the color scheme each bar
113
122
domain: [0,Math.max(calculateMaxTotalRender(series),data.maxTotalRender)],// [minY, maxY] the domain array on rendering scale will set the coordinates for Y-axis points.
yScale={renderingScale}// takes in a value and maps it to an y axis position
321
359
color={colorScale}// returns the desired color for a bar with a given key and index
322
360
>
323
-
{(barStacks)=>// overides render function which is past the configured stack generator
324
-
barStacks.map((barStack,idx)=>{// Uses map method to iterate through all components, creating a rect component, from visx, for each iteration. height, width, etc are calculated by visx to set X and Y scale. The scaler will used the passed in function and will run it on the array thats outputted by data
361
+
{(
362
+
barStacks,// overides render function which is past the configured stack generator
363
+
)=>
364
+
barStacks.map((barStack,idx)=>{
365
+
// Uses map method to iterate through all components, creating a rect component, from visx, for each iteration. height, width, etc are calculated by visx to set X and Y scale. The scaler will used the passed in function and will run it on the array thats outputted by data
barStacks.map((barStack,idx)=>{// Uses map method to iterate through all components, creating a react component (from visx) for each iteration. height/width/etc. are calculated by visx.
416
+
barStacks.map((barStack,idx)=>{
417
+
// Uses map method to iterate through all components, creating a react component (from visx) for each iteration. height/width/etc. are calculated by visx.
0 commit comments