Public-Mirror/metacubexd
1
0
Fork 0
mirror of https://github.com/MetaCubeX/metacubexd.git synced 2024-12-26 19:24:12 +08:00
Code Issues Projects Releases Wiki Activity

fix: charts data slice (#17)

Browse Source 
* fix: charts data slice

* feat: shrink the chart data array size down once a while

---------

Co-authored-by: kunish <kunish.butt@gmail.com>
This commit is contained in:
Zephyruso 2023-08-29 17:45:07 +08:00 committed by GitHub
parent 36cc05fca3
commit 35f80426ce
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 22 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/pages/Overview.tsx
View File

@ -10,10 +10,13 @@ import {
createEffect,
createMemo,
createSignal,
onCleanup,
} from 'solid-js'
import { secret, wsEndpointURL } from '~/signals'
import type { Connection } from '~/types'
const CHART_MAX_XAXIS = 10
const defaultChartOptions: ApexOptions = {
chart: {
toolbar: { show: false },
@ -30,7 +33,11 @@ const defaultChartOptions: ApexOptions = {
grid: { yaxis: { lines: { show: false } } },
stroke: { curve: 'smooth' },
tooltip: { enabled: false },
xaxis: { labels: { show: false }, axisTicks: { show: false } },
xaxis: {
range: CHART_MAX_XAXIS,
labels: { show: false },
axisTicks: { show: false },
},
yaxis: {
labels: {
style: { colors: 'gray' },
@ -55,6 +62,18 @@ export default () => {
[],
)
const [memories, setMemories] = createSignal<number[]>([])
// https://github.com/apexcharts/apexcharts.js/blob/main/samples/source/line/realtime.xml
// TODO: need a better way
const preventLeakTimer = setInterval(
() => {
setTraffics((traffics) => traffics.slice(-CHART_MAX_XAXIS))
setMemories((memo) => memo.slice(-CHART_MAX_XAXIS))
},
// we shrink the chart data array size down every 10 minutes
10 * 60 * 1000,
)
onCleanup(() => clearInterval(preventLeakTimer))
const trafficWS = createReconnectingWS(
`${wsEndpointURL()}/traffic?token=${secret()}}`,
@ -74,7 +93,7 @@ export default () => {
const t = traffic()
if (t) {
setTraffics((traffics) => [...traffics, t].slice(-10))
setTraffics((traffics) => [...traffics, t])
}
})
@ -112,7 +131,7 @@ export default () => {
const m = memory()
if (m) {
setMemories((memories) => [...memories, m].slice(-10))
setMemories((memories) => [...memories, m])
}
})