RadialGauge: Fixes glow effect in light theme (#112768)

* RadialGauge: Fixes glwo effect in light theme

* Update

packages/grafana-ui/src/components/RadialGauge/RadialGauge.tsx

@@ -293,10 +293,6 @@ function getStyles(theme: GrafanaTheme2) {
       display: 'flex',
       justifyContent: 'center',
       alignItems: 'center',
-      // Adds subtle shadow in light themes to help bar stand out
-      '.radial-arc-path': {
-        filter: theme.isLight ? `drop-shadow(0px 0px 1px #888);` : '',
-      },
     }),
     clearButton: css({
       background: 'transparent',

public/app/plugins/panel/radialbar/GaugeMigrations.ts

@@ -20,6 +20,7 @@ export function gaugePanelMigrationHandler(panel: PanelModel<Options>): Partial<
 
     // This option is enabled by default in new gauge but does not exist in old gauge
     newOptions.sparkline = false;
+    newOptions.gradient = 'none';
 
     // Remove deprecated sizing options
     if ('sizing' in newOptions) {

public/app/plugins/panel/radialbar/module.tsx

@@ -35,7 +35,7 @@ export const plugin = new PanelPlugin<Options>(RadialBarPanel)
       path: 'gradient',
       name: t('radialbar.config.gradient', 'Gradient'),
       category,
-      defaultValue: 'none',
+      defaultValue: defaultOptions.gradient,
       settings: {
         options: [
           { value: 'none', label: t('radialbar.config.gradient-none', 'None') },

public/app/plugins/panel/radialbar/suggestions.ts

@@ -1,4 +1,5 @@
 import { VisualizationSuggestionsBuilder } from '@grafana/data';
+import { FieldColorModeId } from '@grafana/schema/dist/esm/index.gen';
 import { SuggestionName } from 'app/types/suggestions';
 
 import { Options } from './panelcfg.gen';
@@ -12,7 +13,7 @@ export class GaugeSuggestionsSupplier {
     }
 
     // for many fields / series this is probably not a good fit
-    if (dataSummary.numberFieldCount >= 50) {
+    if (dataSummary.numberFieldCount >= 10) {
       return;
     }
 
@@ -35,7 +36,7 @@ export class GaugeSuggestionsSupplier {
 
     if (dataSummary.hasStringField && dataSummary.frameCount === 1 && dataSummary.rowCountTotal < 10) {
       list.append({
-        name: SuggestionName.RadialBar,
+        name: SuggestionName.Gauge,
         options: {
           reduceOptions: {
             values: true,
@@ -43,9 +44,26 @@ export class GaugeSuggestionsSupplier {
           },
         },
       });
+      list.append({
+        name: SuggestionName.GaugeCircular,
+        options: {
+          shape: 'circle',
+          showThresholdMarkers: false,
+          reduceOptions: {
+            values: true,
+            calcs: [],
+          },
+        },
+        fieldConfig: {
+          defaults: {
+            color: { mode: FieldColorModeId.PaletteClassic },
+          },
+          overrides: [],
+        },
+      });
     } else {
       list.append({
-        name: SuggestionName.RadialBar,
+        name: SuggestionName.Gauge,
         options: {
           reduceOptions: {
             values: false,
@@ -53,6 +71,30 @@ export class GaugeSuggestionsSupplier {
           },
         },
       });
+      list.append({
+        name: SuggestionName.GaugeCircular,
+        options: {
+          shape: 'circle',
+          showThresholdMarkers: false,
+          barWidthFactor: 0.3,
+          effects: {
+            rounded: true,
+            barGlow: true,
+            centerGlow: true,
+            spotlight: true,
+          },
+          reduceOptions: {
+            values: false,
+            calcs: ['lastNotNull'],
+          },
+        },
+        fieldConfig: {
+          defaults: {
+            color: { mode: FieldColorModeId.PaletteClassic },
+          },
+          overrides: [],
+        },
+      });
     }
   }
 }

public/app/types/suggestions.ts

@@ -18,8 +18,8 @@ export enum SuggestionName {
   Stat = 'Stat',
   StatColoredBackground = 'Stat colored background',
   Gauge = 'Gauge',
+  GaugeCircular = 'Circular gauge',
   GaugeNoThresholds = 'Gauge no thresholds',
-  RadialBar = 'Radial bar',
   BarGaugeBasic = 'Bar gauge basic',
   BarGaugeLCD = 'Bar gauge LCD',
   Table = 'Table',