diff --git a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html
index 200a0b11..20acb44a 100644
--- a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html
+++ b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.html
@@ -3,22 +3,22 @@
        [attr.viewBox]="styles.viewBox" preserveAspectRatio="xMinYMin meet" (mousedown)="mouseDown($event)">
     <defs>
 
-      <filter id="blurFilter" x="0" y="0" width="100%" height="100%">
+      <filter [attr.id]="'blurFilter' + svgControlId" x="0" y="0" width="100%" height="100%">
         <feGaussianBlur in="SourceGraphic" [attr.stdDeviation]="styles.blurRadius" />
         <feComponentTransfer>
           <feFuncA type="discrete" tableValues="1 1"/>
         </feComponentTransfer>
       </filter>
 
-      <clipPath id="sliderClip">
+      <clipPath [attr.id]="'sliderClip' + svgControlId">
         <path [attr.d]="styles.clipPathStr" stroke="black"></path>
       </clipPath>
 
     </defs>
     <g [attr.transform]="styles.arcTranslateStr">
 
-      <g class="toClip" clip-path="url(#sliderClip)">
-        <g class="toFilter" filter="url(#blurFilter)">
+      <g class="toClip" [attr.clip-path]="'url(#sliderClip' + svgControlId +')'">
+        <g class="toFilter" [attr.filter]="'url(#blurFilter' + svgControlId +')'">
           <path [attr.d]="arc.d" [attr.fill]="arc.color" *ngFor="let arc of styles.gradArcs"></path>
         </g>
         <!-- ngFor is a quirk fix for webkit rendering issues -->
diff --git a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts
index e089240a..5d750032 100644
--- a/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts
+++ b/src/app/pages/dashboard/temperature/temperature-dragger/temperature-dragger.component.ts
@@ -53,6 +53,7 @@ export class TemperatureDraggerComponent implements AfterViewInit, OnChanges {
   off: boolean = false;
   oldValue: number;
 
+  svgControlId = new Date().getTime();
   scaleFactor: number = 1;
   bottomAngleRad = 0;
   radius: number = 100;
@@ -130,14 +131,14 @@ export class TemperatureDraggerComponent implements AfterViewInit, OnChanges {
     const halfAngle = this.bottomAngleRad / 2;
 
     const svgBoundingRect = this.svgRoot.nativeElement.getBoundingClientRect();
-    const svgAreaFactor = svgBoundingRect.width / svgBoundingRect.height;
+    const svgAreaFactor = svgBoundingRect.height && svgBoundingRect.width / svgBoundingRect.height || 1;
     const svgHeight = VIEW_BOX_SIZE / svgAreaFactor;
     const thumbMaxRadius = Math.max(this.thumbRadius, this.thumbDashRadius);
     const thumbMargin = 2 * thumbMaxRadius > this.arcThickness
       ? (thumbMaxRadius - this.arcThickness / 2) / this.scaleFactor
       : 0;
 
-    this.scaleFactor = svgBoundingRect.width / VIEW_BOX_SIZE;
+    this.scaleFactor = svgBoundingRect.width / VIEW_BOX_SIZE || 1;
     this.styles.viewBox = `0 0 ${VIEW_BOX_SIZE} ${svgHeight}`;
 
 
diff --git a/src/app/pages/dashboard/temperature/temperature.component.html b/src/app/pages/dashboard/temperature/temperature.component.html
index 1c63f420..ff515e6e 100644
--- a/src/app/pages/dashboard/temperature/temperature.component.html
+++ b/src/app/pages/dashboard/temperature/temperature.component.html
@@ -40,19 +40,19 @@
 
       <span>Humidity placeholder</span>
 
-      <!--<ngx-temperature-dragger [(value)]="humidity" (power)="humidityOff = !$event" [min]="0" [max]="100"-->
-           <!--[arcThickness]="20" [thumbRadius]="15" [bottomAngle]="90" [disableArcColor]="themeConfig.layoutBg"-->
-           <!--[fillColors]="[themeConfig.colorInfo, themeConfig.colorSuccess, themeConfig.colorWarning]">-->
+      <ngx-temperature-dragger [(value)]="humidity" (power)="humidityOff = !$event" [min]="0" [max]="100"
+           [arcThickness]="20" [thumbRadius]="15" [bottomAngle]="90" [disableArcColor]="themeConfig.layoutBg"
+           [fillColors]="[themeConfig.colorInfo, themeConfig.colorSuccess, themeConfig.colorWarning]">
 
-        <!--<div class="temperature"  [ngClass]="{ 'off': humidityOff }">-->
-          <!--<div class="value">-->
-            <!--{{ humidityOff ? '&#45;&#45;' : (humidity | ngxRound) }}-->
-          <!--</div>-->
-          <!--<div class="desc">-->
-            <!--Celsius-->
-          <!--</div>-->
-        <!--</div>-->
-      <!--</ngx-temperature-dragger>-->
+        <div class="temperature"  [ngClass]="{ 'off': humidityOff }">
+          <div class="value">
+            {{ humidityOff ? '--' : (humidity | ngxRound) }}
+          </div>
+          <div class="desc">
+            Celsius
+          </div>
+        </div>
+      </ngx-temperature-dragger>
     </nga-tab>
   </nga-tabset>
 </nga-card>