From 4e1cab1e69893126873095bcc68e66c7d16456c5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Tue, 15 Dec 2020 21:50:40 +0100
Subject: [PATCH] GraphNG: Do not set fillColor from GraphNG only opacity
 (#29851)

* GraphNG: Do not set fillColor from GraphNG only opacity

* use color settings if they exist

Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
---
 packages/grafana-ui/src/components/GraphNG/GraphNG.tsx    | 5 ++---
 .../src/components/uPlot/config/UPlotSeriesBuilder.ts     | 8 +++++---
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/packages/grafana-ui/src/components/GraphNG/GraphNG.tsx b/packages/grafana-ui/src/components/GraphNG/GraphNG.tsx
index 40dfda10f25..a08cb4cc1e7 100755
--- a/packages/grafana-ui/src/components/GraphNG/GraphNG.tsx
+++ b/packages/grafana-ui/src/components/GraphNG/GraphNG.tsx
@@ -157,14 +157,13 @@ export const GraphNG: React.FC<GraphNGProps> = ({
       builder.addSeries({
         scaleKey,
         drawStyle: customConfig.drawStyle!,
-        lineColor: seriesColor,
+        lineColor: customConfig.lineColor ?? seriesColor,
         lineWidth: customConfig.lineWidth,
         lineInterpolation: customConfig.lineInterpolation,
         showPoints,
         pointSize: customConfig.pointSize,
-        pointColor: seriesColor,
+        pointColor: customConfig.pointColor ?? seriesColor,
         fillOpacity: customConfig.fillOpacity,
-        fillColor: seriesColor,
         spanNulls: customConfig.spanNulls || false,
       });
 
diff --git a/packages/grafana-ui/src/components/uPlot/config/UPlotSeriesBuilder.ts b/packages/grafana-ui/src/components/uPlot/config/UPlotSeriesBuilder.ts
index a014754fe37..423e1aca77f 100755
--- a/packages/grafana-ui/src/components/uPlot/config/UPlotSeriesBuilder.ts
+++ b/packages/grafana-ui/src/components/uPlot/config/UPlotSeriesBuilder.ts
@@ -81,9 +81,11 @@ export class UPlotSeriesBuilder extends PlotConfigBuilder<SeriesProps, Series> {
     }
 
     if (fillOpacityNumber !== 0) {
-      fillConfig.fill = tinycolor(fillColor ?? lineColor)
-        .setAlpha(fillOpacityNumber / 100)
-        .toRgbString();
+      fillConfig = {
+        fill: tinycolor(fillColor ?? lineColor)
+          .setAlpha(fillOpacityNumber / 100)
+          .toRgbString(),
+      };
     }
 
     return {