From 83b0f958166d6876ba5c0ecc3a58449e3bc93adf Mon Sep 17 00:00:00 2001 From: Sophia Mersmann Date: Thu, 9 Jan 2025 18:00:53 +0100 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20(line)=20deduplicate=20line=20label?= =?UTF-8?q?s=20(#4420)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../grapher/src/lineCharts/LineChart.tsx | 20 +++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/packages/@ourworldindata/grapher/src/lineCharts/LineChart.tsx b/packages/@ourworldindata/grapher/src/lineCharts/LineChart.tsx index 207959ea00..3369bbbfa2 100644 --- a/packages/@ourworldindata/grapher/src/lineCharts/LineChart.tsx +++ b/packages/@ourworldindata/grapher/src/lineCharts/LineChart.tsx @@ -1363,13 +1363,21 @@ export class LineChart // Order of the legend items on a line chart should visually correspond // to the order of the lines as the approach the legend @computed get lineLegendSeries(): LineLabelSeries[] { - // If there are any projections, ignore non-projection legends - // Bit of a hack - let seriesToShow = this.series - if (seriesToShow.some((series) => !!series.isProjection)) - seriesToShow = seriesToShow.filter((series) => series.isProjection) + // If there are any projections, ignore non-projection legends (bit of a hack) + let series = this.series + if (series.some((series) => !!series.isProjection)) + series = series.filter((series) => series.isProjection) + + // Deduplicate series by seriesName to avoid showing the same label multiple times + const deduplicatedSeries: LineChartSeries[] = [] + const seriesGroupedByName = groupBy(series, "seriesName") + for (const duplicates of Object.values(seriesGroupedByName)) { + // keep only the label for the series with the most recent data + // (series are sorted by time, so we can just take the last one) + deduplicatedSeries.push(last(duplicates)!) + } - return seriesToShow.map((series) => { + return deduplicatedSeries.map((series) => { const { seriesName, color } = series const lastValue = last(series.points)!.y return {