Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-09 00:18:00 +01:00
Code Issues Projects Releases Wiki Activity

refactor: improve feature metrics chart line legibility (#902)

Browse Source
This commit is contained in:
olav 2022-04-22 12:27:04 +02:00 committed by GitHub
parent 03e04e7c31
commit ffa91a3758
2 changed files with 22 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureMetricsChart/createChartData.ts
View File

@ -18,6 +18,15 @@ export const createChartData = (
borderColor: theme.palette.primary.light, borderColor: theme.palette.primary.light,
backgroundColor: theme.palette.primary.light, backgroundColor: theme.palette.primary.light,
data: createChartPoints(metrics, locationSettings, m => m.yes + m.no), data: createChartPoints(metrics, locationSettings, m => m.yes + m.no),
elements: {
point: {
radius: 6,
pointStyle: 'circle',
},
line: {
borderDash: [8, 4],
},
},
}; };
const yesSeries = { const yesSeries = {
@ -25,6 +34,12 @@ export const createChartData = (
borderColor: theme.palette.success.light, borderColor: theme.palette.success.light,
backgroundColor: theme.palette.success.light, backgroundColor: theme.palette.success.light,
data: createChartPoints(metrics, locationSettings, m => m.yes), data: createChartPoints(metrics, locationSettings, m => m.yes),
elements: {
point: {
radius: 6,
pointStyle: 'triangle',
},
},
}; };
const noSeries = { const noSeries = {
@ -32,6 +47,13 @@ export const createChartData = (
borderColor: theme.palette.error.light, borderColor: theme.palette.error.light,
backgroundColor: theme.palette.error.light, backgroundColor: theme.palette.error.light,
data: createChartPoints(metrics, locationSettings, m => m.no), data: createChartPoints(metrics, locationSettings, m => m.no),
elements: {
point: {
radius: 6,
pointStyle: 'triangle',
pointRotation: 180,
},
},
}; };
return { datasets: [yesSeries, noSeries, requestsSeries] }; return { datasets: [yesSeries, noSeries, requestsSeries] };

8
frontend/src/component/feature/FeatureView/FeatureMetrics/FeatureMetricsChart/createChartOptions.ts
View File

@ -77,14 +77,6 @@ export const createChartOptions = (
}, },
}, },
}, },
elements: {
point: {
// If we only have one point, always show a dot (since there's no line).
// If we have multiple points, only show dots on hover (looks better).
radius: metrics.length === 1 ? 6 : 0,
hoverRadius: 6,
},
},
}; };
}; };