From 9d27f6d5b26198a53c313811a6e59c8bd03ab7f3 Mon Sep 17 00:00:00 2001
From: Elizabeth Thompson <eschutho@gmail.com>
Date: Fri, 15 Nov 2024 17:32:54 -0800
Subject: [PATCH] adjust line type as well as weight for time series

---
 .../src/Timeseries/transformProps.ts          | 19 ++++++++++++++-----
 .../src/Timeseries/transformers.ts            | 10 +---------
 2 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
index b552ceba5c49e..31532efed2367 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformProps.ts
@@ -278,7 +278,7 @@ export default function transformProps(
   const array = ensureIsArray(chartProps.rawFormData?.time_compare);
   const inverted = invert(verboseMap);
 
-  const offsetLineWidths: { [key: string]: number } = {};
+  const offsetLineWidths: string[] = [];
 
   rawSeries.forEach(entry => {
     const derivedSeries = isDerivedSeries(entry, chartProps.rawFormData);
@@ -288,11 +288,20 @@ export default function transformProps(
         entry,
         ensureIsArray(chartProps.rawFormData?.time_compare),
       )!;
-      if (!offsetLineWidths[offset]) {
-        offsetLineWidths[offset] = Object.keys(offsetLineWidths).length + 1;
+      if (!offsetLineWidths.includes(offset)) {
+        offsetLineWidths.push(offset);
+        const position = offsetLineWidths.length;
+        if (position < 5) {
+          // increase the width of the line only up to 5
+          // or it gets too thick and hard to distinguish
+          lineStyle.width = position;
+          lineStyle.type = 'dashed';
+        } else {
+          // use a combination of dash and dot for the line style
+          lineStyle.width = (position % 3) + 1;
+          lineStyle.type = [(position % 5) + 1, (position % 3) + 1];
+        }
       }
-      lineStyle.type = 'dashed';
-      lineStyle.width = offsetLineWidths[offset];
       lineStyle.opacity = OpacityEnum.DerivedSeries;
     }
 
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformers.ts b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformers.ts
index df4817a018c86..de90333c1e7b8 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformers.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/transformers.ts
@@ -314,15 +314,7 @@ export function transformSeries(
             opacity: opacity * areaOpacity,
           }
         : undefined,
-    emphasis: {
-      // bold on hover as required since 5.3.0 to retain backwards feature parity:
-      // https://apache.github.io/echarts-handbook/en/basics/release-note/5-3-0/#removing-the-default-bolding-emphasis-effect-in-the-line-chart
-      // TODO: should consider only adding emphasis to currently hovered series
-      lineStyle: {
-        width: 'bolder',
-      },
-      ...emphasis,
-    },
+    emphasis,
     showSymbol,
     symbolSize: markerSize,
     label: {