diff --git a/src/components/MultiLineChart.tsx b/src/components/MultiLineChart.tsx index 5cc4a14b..c6d61ecc 100644 --- a/src/components/MultiLineChart.tsx +++ b/src/components/MultiLineChart.tsx @@ -48,10 +48,15 @@ export default function MultiLineChart({ sector = "power", metric = "capacity", }: MultiLineChartProps) { - const d3data = useMemo( - () => data.data.filter((d) => d.sector === sector && d.metric === metric), - [data.data, sector, metric], - ); + const d3data = useMemo(() => { + let filtered = data.data.filter( + (d) => d.sector === sector && d.metric === metric, + ); + if (metric == "emissionsIntensity" || metric == "absoluteEmissions") { + filtered = filtered.map((d) => ({ ...d, technology: d.metric })); + } + return filtered; + }, [data.data, sector, metric]); const ref = useRef(null); const gx = useRef(null); diff --git a/src/components/PlotSelector.tsx b/src/components/PlotSelector.tsx index db3e87fc..e82f25ab 100644 --- a/src/components/PlotSelector.tsx +++ b/src/components/PlotSelector.tsx @@ -1,7 +1,6 @@ import React, { useCallback, useEffect, useState, useMemo } from "react"; import NormalizedStackedAreaChart from "./NormalizedStackedAreaChart"; import MultiLineChart from "./MultiLineChart"; -import VerticalBarChart from "./VerticalBarChart"; import { geographyLabel } from "../utils/geographyUtils"; interface DataPoint { @@ -155,7 +154,7 @@ export const PlotSelector: React.FC = ({ case "absoluteEmissions": return (
- = ({ case "emissionsIntensity": return (
-