fix(ui): отображать одиночные измерения на графике трафика
This commit is contained in:
1 parent
ed491c313f
commit
88a8b5f02f
5 files changed
+47
-5
No files matched your search
@@ -85,6 +85,11 @@ export function TrafficRxTxChart({
|
||||
const hasRx = data.some(point => point.rx !== null)
|
||||
const hasTx = data.some(point => point.tx !== null)
|
||||
const hasData = hasRx || hasTx
|
||||
const isolatedDot = (direction: "rx" | "tx") => function IsolatedDot({ cx, cy, index }: { cx?: number; cy?: number; index?: number }) {
|
||||
if (index == null || cx == null || cy == null || data[index]?.[direction] == null
|
||||
|| data[index - 1]?.[direction] != null || data[index + 1]?.[direction] != null) return <g />
|
||||
return <circle cx={cx} cy={cy} r={3} fill={`var(--chart-${direction})`} data-isolated-direction={direction} />
|
||||
}
|
||||
const chart = !hasData ? (
|
||||
<p role="status" className="flex min-h-[220px] items-center justify-center text-sm text-muted-foreground">Нет исторических измерений за выбранный период</p>
|
||||
) : (
|
||||
@@ -119,14 +124,14 @@ export function TrafficRxTxChart({
|
||||
type="monotone"
|
||||
stroke="var(--chart-rx)"
|
||||
strokeWidth={2}
|
||||
dot={false}
|
||||
dot={isolatedDot("rx")}
|
||||
/>}
|
||||
{hasTx && <Line
|
||||
dataKey="tx"
|
||||
type="monotone"
|
||||
stroke="var(--chart-tx)"
|
||||
strokeWidth={2}
|
||||
dot={false}
|
||||
dot={isolatedDot("tx")}
|
||||
/>}
|
||||
</LineChart>
|
||||
</ChartContainer>
|
||||
|
||||
Reference in new issue
Block a user