diff --git a/packages/core-ui/command-surface/src/components/graph/index.tsx b/packages/core-ui/command-surface/src/components/graph/index.tsx index e2112aea..6f993e49 100644 --- a/packages/core-ui/command-surface/src/components/graph/index.tsx +++ b/packages/core-ui/command-surface/src/components/graph/index.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useMemo } from "react"; import { ResponsiveContainer, @@ -48,14 +48,40 @@ const BaseGraph: React.FC = (props) => { console.log({xAxisDomain, yAxisDomain}) + const yTicks = useMemo(() => { + const tickCount = 5; + if(typeof(yAxisDomain?.[0]) == 'number' && typeof(yAxisDomain?.[1]) == 'number'){ + let tickWidth = (yAxisDomain?.[1] - yAxisDomain?.[0]) / tickCount; + let ticks : any[] = []; + for(var i = 0; i < tickCount; i++){ + ticks.push(yAxisDomain?.[0] + (tickWidth * i)) + } + + return ticks; + } + return undefined; + }, [yAxisDomain]) + + const yInterval = useMemo(() => { + if(typeof(yAxisDomain?.[0]) == 'number' && typeof(yAxisDomain?.[1]) == 'number'){ + return 0; + } + return undefined; + }, [yAxisDomain]) + return ( ({...x, [props.yKey || '']: typeof(x?.[props.yKey || '']) === "number" ? x?.[props.yKey || ''] : parseFloat(x?.[props.yKey || ''])}))} > - - + +