mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2024-12-23 17:40:23 +03:00
Code Issues Projects Releases Packages Wiki Activity

Recovered function to render pie chart labels

Browse source
This commit is contained in:
Alejandro Celaya 2021-08-29 22:04:04 +02:00
parent 0572bc2854
commit d55160e8f6
2 changed files with 10 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/utils/helpers/charts.ts
View file

@ -6,7 +6,13 @@ export const pointerOnHover = ({ native }: ChartEvent, [ firstElement ]: ActiveE
return; return;
} }
(native.target as any).style.cursor = firstElement ? 'pointer' : 'default'; const canvas = native.target as HTMLCanvasElement;
canvas.style.cursor = firstElement ? 'pointer' : 'default';
}; };
export const renderChartLabel = ({ dataset, label }: TooltipItem<ChartType>) => `${dataset.label}: ${prettify(label)}`; export const renderChartLabel = ({ dataset, formattedValue }: TooltipItem<ChartType>) =>
`${dataset.label}: ${prettify(formattedValue)}`;
export const renderPieChartLabel = ({ label, formattedValue }: TooltipItem<ChartType>) =>
`${label}: ${prettify(formattedValue)}`;

4
src/visits/helpers/DefaultChart.tsx
View file

@ -6,7 +6,7 @@ import { Chart, ChartData, ChartDataset, ChartOptions, LegendItem } from 'chart.
import { fillTheGaps } from '../../utils/helpers/visits'; import { fillTheGaps } from '../../utils/helpers/visits';
import { Stats } from '../types'; import { Stats } from '../types';
import { prettify } from '../../utils/helpers/numbers'; import { prettify } from '../../utils/helpers/numbers';
import { pointerOnHover, renderChartLabel } from '../../utils/helpers/charts'; import { pointerOnHover, renderChartLabel, renderPieChartLabel } from '../../utils/helpers/charts';
import { import {
HIGHLIGHTED_COLOR, HIGHLIGHTED_COLOR,
HIGHLIGHTED_COLOR_ALPHA, HIGHLIGHTED_COLOR_ALPHA,
@ -149,7 +149,7 @@ const DefaultChart = (
// Do not show tooltip on items with empty label when in a bar chart // Do not show tooltip on items with empty label when in a bar chart
filter: ({ label }) => !isBarChart || label !== '', filter: ({ label }) => !isBarChart || label !== '',
callbacks: { callbacks: {
label: renderChartLabel, label: isBarChart ? renderChartLabel : renderPieChartLabel,
}, },
}, },
}, },