flip axes on sparks and metrics

This commit is contained in:
Michael Quigley 2023-06-27 10:41:09 -04:00
parent 75795b326b
commit 041330b54f
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
4 changed files with 8 additions and 8 deletions

View File

@ -47,8 +47,8 @@ const EnvironmentsTab = (props) => {
cell: row => { cell: row => {
return <ResponsiveContainer width={"100%"} height={"100%"}> return <ResponsiveContainer width={"100%"} height={"100%"}>
<AreaChart data={row.activity}> <AreaChart data={row.activity}>
<Area type={"basis"} dataKey={(v) => v.rx ? v.rx : 0} stroke={"#231069"} fill={"#04adef"} isAnimationActive={false} dot={false} /> <Area type={"basis"} dataKey={(v) => v.tx ? v.tx : 0} stroke={"#231069"} fill={"#04adef"} isAnimationActive={false} dot={false} />
<Area type={"basis"} dataKey={(v) => v.tx ? v.tx * -1 : 0} stroke={"#231069"} fill={"#9BF316"} isAnimationActive={false} dot={false} /> <Area type={"basis"} dataKey={(v) => v.rx ? v.rx * -1 : 0} stroke={"#231069"} fill={"#9BF316"} isAnimationActive={false} dot={false} />
</AreaChart> </AreaChart>
</ResponsiveContainer> </ResponsiveContainer>
} }

View File

@ -48,8 +48,8 @@ const SharesTab = (props) => {
cell: row => { cell: row => {
return <ResponsiveContainer width={"100%"} height={"100%"}> return <ResponsiveContainer width={"100%"} height={"100%"}>
<AreaChart data={row.activity}> <AreaChart data={row.activity}>
<Area type={"basis"} dataKey={(v) => v.rx ? v.rx : 0} stroke={"#231069"} fill={"#04adef"} isAnimationActive={false} dot={false} /> <Area type={"basis"} dataKey={(v) => v.tx ? v.tx : 0} stroke={"#231069"} fill={"#04adef"} isAnimationActive={false} dot={false} />
<Area type={"basis"} dataKey={(v) => v.tx ? v.tx * -1 : 0} stroke={"#231069"} fill={"#9BF316"} isAnimationActive={false} dot={false} /> <Area type={"basis"} dataKey={(v) => v.rx ? v.rx * -1 : 0} stroke={"#231069"} fill={"#9BF316"} isAnimationActive={false} dot={false} />
</AreaChart> </AreaChart>
</ResponsiveContainer> </ResponsiveContainer>
} }

View File

@ -43,8 +43,8 @@ const ShareDetail = (props) => {
activity: row => ( activity: row => (
<ResponsiveContainer width={"100%"} height={"100%"}> <ResponsiveContainer width={"100%"} height={"100%"}>
<AreaChart data={row.value}> <AreaChart data={row.value}>
<Area type={"basis"} dataKey={(v) => v.rx ? v.rx : 0} stroke={"#231069"} fill={"#04adef"} isAnimationActive={false} dot={false} /> <Area type={"basis"} dataKey={(v) => v.tx ? v.tx : 0} stroke={"#231069"} fill={"#04adef"} isAnimationActive={false} dot={false} />
<Area type={"basis"} dataKey={(v) => v.tx ? v.tx * -1 : 0} stroke={"#231069"} fill={"#9BF316"} isAnimationActive={false} dot={false} /> <Area type={"basis"} dataKey={(v) => v.rx ? v.rx * -1 : 0} stroke={"#231069"} fill={"#9BF316"} isAnimationActive={false} dot={false} />
</AreaChart> </AreaChart>
</ResponsiveContainer> </ResponsiveContainer>
), ),

View File

@ -50,8 +50,8 @@ const MetricsGraph = (props) => {
<CartesianGrid strokeDasharay={"3 3"} /> <CartesianGrid strokeDasharay={"3 3"} />
<XAxis dataKey={(v) => v.timestamp} scale={"time"} tickFormatter={(v) => moment(v).format("MMM DD") } style={{ fontSize: '75%'}}/> <XAxis dataKey={(v) => v.timestamp} scale={"time"} tickFormatter={(v) => moment(v).format("MMM DD") } style={{ fontSize: '75%'}}/>
<YAxis tickFormatter={(v) => bytesToSize(v)} style={{ fontSize: '75%' }}/> <YAxis tickFormatter={(v) => bytesToSize(v)} style={{ fontSize: '75%' }}/>
<Area type={"basis"} stroke={"#231069"} fill={"#9BF316"} dataKey={(v) => v.tx ? v.tx : 0} stackId={"1"} /> <Area type={"basis"} stroke={"#231069"} fill={"#04adef"} dataKey={(v) => v.tx ? v.tx : 0} stackId={"1"} />
<Area type={"basis"} stroke={"#231069"} fill={"#04adef"} dataKey={(v) => v.rx ? v.rx : 0} stackId={"1"} /> <Area type={"basis"} stroke={"#231069"} fill={"#9BF316"} dataKey={(v) => v.rx ? v.rx : 0} stackId={"1"} />
</AreaChart> </AreaChart>
</ResponsiveContainer> </ResponsiveContainer>
</Col> </Col>