diff --git a/ui-ngx/src/app/core/utils.ts b/ui-ngx/src/app/core/utils.ts
index ec02a0d117..b810689b69 100644
--- a/ui-ngx/src/app/core/utils.ts
+++ b/ui-ngx/src/app/core/utils.ts
@@ -817,3 +817,7 @@ export const getOS = (): string => {
 export const camelCase = (str: string): string => {
   return _.camelCase(str);
 };
+
+export const convertKeysToCamelCase = (obj: Record<string, any>): Record<string, any> => {
+  return _.mapKeys(obj, (value, key) => _.camelCase(key));
+};
diff --git a/ui-ngx/src/app/modules/home/components/widget/config/basic/chart/doughnut-basic-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/config/basic/chart/doughnut-basic-config.component.ts
index 77e86a697c..f8149bc97d 100644
--- a/ui-ngx/src/app/modules/home/components/widget/config/basic/chart/doughnut-basic-config.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/config/basic/chart/doughnut-basic-config.component.ts
@@ -40,7 +40,7 @@ import {
   doughnutLayoutImages,
   doughnutLayouts,
   doughnutLayoutTranslations,
-  DoughnutLegendPosition,
+  doughnutLegendPositions,
   doughnutLegendPositionTranslations,
   DoughnutTooltipValueType,
   doughnutTooltipValueTypes,
@@ -83,7 +83,7 @@ export class DoughnutBasicConfigComponent extends BasicWidgetConfigComponent {
 
   doughnutLayoutImageMap: Map<DoughnutLayout, string>;
 
-  doughnutLegendPositions: DoughnutLegendPosition[];
+  doughnutLegendPositions = doughnutLegendPositions;
 
   doughnutLegendPositionTranslationMap = doughnutLegendPositionTranslations;
 
@@ -116,8 +116,6 @@ export class DoughnutBasicConfigComponent extends BasicWidgetConfigComponent {
     const params = widgetConfig.typeParameters as any;
     this.horizontal = isDefinedAndNotNull(params.horizontal) ? params.horizontal : false;
     this.doughnutLayoutImageMap = this.horizontal ? horizontalDoughnutLayoutImages : doughnutLayoutImages;
-    this.doughnutLegendPositions = this.horizontal ? [DoughnutLegendPosition.left, DoughnutLegendPosition.right] :
-      [DoughnutLegendPosition.top, DoughnutLegendPosition.bottom];
     super.setupConfig(widgetConfig);
   }
 
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts
index 281a429adc..1595c59110 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts
@@ -264,7 +264,7 @@ export class DoughnutWidgetComponent implements OnInit, OnDestroy, AfterViewInit
       if (tsValue && isDefinedAndNotNull(tsValue[1]) && isNumeric(tsValue[1])) {
         value = tsValue[1];
         dataItem.hasValue = true;
-        dataItem.value = value;
+        dataItem.value = Number(value);
       } else {
         dataItem.hasValue = false;
         dataItem.value = 0;
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.models.ts
index 4fb192c4bd..1771dbbb8a 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.models.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.models.ts
@@ -57,6 +57,8 @@ export enum DoughnutLegendPosition {
   right = 'right'
 }
 
+export const doughnutLegendPositions = Object.keys(DoughnutLegendPosition) as DoughnutLegendPosition[];
+
 export const doughnutLegendPositionTranslations = new Map<DoughnutLegendPosition, string>(
   [
     [DoughnutLegendPosition.top, 'widgets.doughnut.legend-position-top'],
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/chart/doughnut-widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/chart/doughnut-widget-settings.component.ts
index a018557aba..220fc7c320 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/chart/doughnut-widget-settings.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/chart/doughnut-widget-settings.component.ts
@@ -14,20 +14,19 @@
 /// limitations under the License.
 ///
 
-import { Component, Injector } from '@angular/core';
+import { Component } from '@angular/core';
 import { WidgetSettings, WidgetSettingsComponent } from '@shared/models/widget.models';
 import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
 import { Store } from '@ngrx/store';
 import { AppState } from '@core/core.state';
 import { formatValue, isDefinedAndNotNull } from '@core/utils';
-import { getDataKey } from '@shared/models/widget-settings.models';
 import {
   doughnutDefaultSettings,
   DoughnutLayout,
   doughnutLayoutImages,
   doughnutLayouts,
   doughnutLayoutTranslations,
-  DoughnutLegendPosition,
+  doughnutLegendPositions,
   doughnutLegendPositionTranslations,
   DoughnutTooltipValueType,
   doughnutTooltipValueTypes,
@@ -56,7 +55,7 @@ export class DoughnutWidgetSettingsComponent extends WidgetSettingsComponent {
 
   doughnutLayoutImageMap: Map<DoughnutLayout, string>;
 
-  doughnutLegendPositions: DoughnutLegendPosition[];
+  doughnutLegendPositions = doughnutLegendPositions;
 
   doughnutLegendPositionTranslationMap = doughnutLegendPositionTranslations;
 
@@ -71,7 +70,6 @@ export class DoughnutWidgetSettingsComponent extends WidgetSettingsComponent {
   tooltipValuePreviewFn = this._tooltipValuePreviewFn.bind(this);
 
   constructor(protected store: Store<AppState>,
-              private $injector: Injector,
               private fb: UntypedFormBuilder) {
     super(store);
   }
@@ -84,8 +82,6 @@ export class DoughnutWidgetSettingsComponent extends WidgetSettingsComponent {
     const params = widgetConfig.typeParameters as any;
     this.horizontal  = isDefinedAndNotNull(params.horizontal) ? params.horizontal : false;
     this.doughnutLayoutImageMap = this.horizontal ? horizontalDoughnutLayoutImages : doughnutLayoutImages;
-    this.doughnutLegendPositions = this.horizontal ? [DoughnutLegendPosition.left, DoughnutLegendPosition.right] :
-      [DoughnutLegendPosition.top, DoughnutLegendPosition.bottom];
   }
 
   protected defaultSettings(): WidgetSettings {
diff --git a/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts b/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
index f49a5454f1..b218504ad1 100644
--- a/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
+++ b/ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
@@ -27,7 +27,15 @@ import { WidgetLayout, WidgetLayouts } from '@app/shared/models/dashboard.models
 import { IDashboardWidget, WidgetAction, WidgetContext, WidgetHeaderAction } from './widget-component.models';
 import { Timewindow } from '@shared/models/time/time.models';
 import { Observable, of, Subject } from 'rxjs';
-import { formattedDataFormDatasourceData, guid, isDefined, isEqual, isUndefined } from '@app/core/utils';
+import {
+  convertKeysToCamelCase,
+  formattedDataFormDatasourceData,
+  guid,
+  isDefined,
+  isEmpty,
+  isEqual,
+  isUndefined
+} from '@app/core/utils';
 import { IterableDiffer, KeyValueDiffer } from '@angular/core';
 import { IAliasController, IStateController } from '@app/core/api/widget-api.models';
 import { enumerable } from '@shared/decorators/enumerable';
@@ -479,9 +487,9 @@ export class DashboardWidget implements GridsterItem, IDashboardWidget {
       backgroundColor: this.backgroundColor,
       padding: this.padding,
       margin: this.margin,
-      borderRadius: this.borderRadius || 'unset' };
-    if (this.widget.config.widgetStyle) {
-      this.style = {...this.style, ...this.widget.config.widgetStyle};
+      borderRadius: this.borderRadius };
+    if (!isEmpty(this.widget.config.widgetStyle)) {
+      this.style = {...this.style, ...convertKeysToCamelCase(this.widget.config.widgetStyle)};
     }
 
     this.showWidgetTitlePanel = this.widgetContext.hideTitlePanel ? false :