diff --git a/src/module.ts b/src/module.ts
index 3c52a39..16e0522 100644
--- a/src/module.ts
+++ b/src/module.ts
@@ -62,6 +62,17 @@ class PlotlyPanelCtrl extends MetricsPanelCtrl {
           width: 0,
         },
         showscale: false,
+        cauto: true,
+        cmin: 0,
+        cmax: 1,
+        cmid: null,
+      },
+      hover: {
+        type: '',
+        hovertemplate: '',
+        hoverlabel: {
+          align: '',
+        },
       },
       color_option: 'ramp',
     },
@@ -686,6 +697,20 @@ class PlotlyPanelCtrl extends MetricsPanelCtrl {
       if (mode) {
         trace.mode = mode.substring(1);
       }
+
+      if (config.settings.hover) {
+        if (config.settings.hover.hovertemplate) {
+          trace.hovertemplate = config.settings.hover.hovertemplate;
+        }
+        if (config.settings.hover.hoverlabel) {
+          trace.hoverlabel = config.settings.hover.hoverlabel;
+        }
+        if (config.settings.hover.type) {
+          trace.hovertype = config.settings.hover.type;
+        } else {
+          trace.hovertype = '';
+        }
+      }
       return trace;
     });
   }
@@ -731,7 +756,15 @@ class PlotlyPanelCtrl extends MetricsPanelCtrl {
           if (!vals) {
             vals = zero;
           }
-          _.set(trace, v.path, vals);
+          let tempVals = vals;
+          if (v.path === 'text' && trace.hovertype === 'Date'){
+            let tempDate: Date[] = [];
+            vals.forEach( x => {
+              tempDate.push(new Date(x));
+            });
+            tempVals = tempDate;
+          }
+          _.set(trace, v.path, tempVals);
         });
       }
     });
diff --git a/src/partials/tab_traces.html b/src/partials/tab_traces.html
index 047b6d7..b2aac6a 100644
--- a/src/partials/tab_traces.html
+++ b/src/partials/tab_traces.html
@@ -154,6 +154,46 @@ <h5 class="section-heading">Markers</h5>
             on-change="ctrl.editor.onColorChanged()"></metric-segment>
         </div>
 
+        <div class="gf-form" ng-if="ctrl.editor.trace.settings.color_option != 'solid'">
+          <label class="gf-form-label width-7">- Range</label>
+          <div class="gf-form-select-wrapper max-width-14">
+            <select class="gf-form-input" 
+              ng-model="ctrl.editor.trace.settings.marker.cauto" 
+              ng-change="ctrl.editor.onColorChanged()">
+              <option ng-value="true">Auto</option>
+              <option nb-value="false">Between</option>
+            </select>
+          </div>
+        </div>
+
+        <div class="gf-form" ng-if="ctrl.editor.trace.settings.marker.cauto != true && ctrl.editor.trace.settings.color_option != 'solid'">
+          <label class="gf-form-label width-7">-- Min</label>
+          <input class="gf-form-input width-10"
+            placeholder="min" 
+            type="number"
+            ng-model="ctrl.editor.trace.settings.marker.cmin" 
+            ng-blur="ctrl.editor.onColorChanged()"
+          />
+        </div>
+        <div class="gf-form" ng-if="ctrl.editor.trace.settings.marker.cauto != true && ctrl.editor.trace.settings.color_option != 'solid'">
+          <label class="gf-form-label width-7">-- Max</label>
+          <input class="gf-form-input width-10"
+            placeholder="max" 
+            type="number"
+            ng-model="ctrl.editor.trace.settings.marker.cmax" 
+            ng-blur="ctrl.editor.onColorChanged()"
+          />
+        </div>
+        <div class="gf-form" ng-if="ctrl.editor.trace.settings.marker.cauto == true && ctrl.editor.trace.settings.color_option != 'solid'">
+          <label class="gf-form-label width-7">-- Mid</label>
+          <input class="gf-form-input width-10"
+            placeholder="mid" 
+            type="number"
+            ng-model="ctrl.editor.trace.settings.marker.cmid" 
+            ng-blur="ctrl.editor.onColorChanged()"
+          />
+        </div>
+
         <div class="gf-form" ng-if="ctrl.editor.trace.settings.color_option != 'solid'">
           <label class="gf-form-label width-7">- Scale</label>
           <div class="gf-form-select-wrapper max-width-14">
@@ -255,7 +295,40 @@ <h5 class="section-heading">Text</h5>
           get-options="ctrl.editor.getSeriesSegs(true)" 
           on-change="ctrl.editor.onTextMetricChanged()"></metric-segment>
       </div>
-      
+
+      <div class="gf-form" ng-if="ctrl.editor.trace.mapping.text">
+        <label class="gf-form-label width-7">Type</label>
+        <div class="gf-form-select-wrapper max-width-14">
+          <select class="gf-form-input"
+            ng-model="ctrl.editor.trace.settings.hover.type"
+            ng-change="ctrl.editor.onColorChanged()">
+            <option value="">None</option>
+            <option value="Date">Date</option>
+          </select>
+        </div>
+      </div>
+
+      <div class="gf-form" ng-if="ctrl.editor.trace.mapping.text">
+        <label class="gf-form-label width-7">Align</label>
+        <div class="gf-form-select-wrapper max-width-14">
+          <select class="gf-form-input"
+            ng-model="ctrl.editor.trace.settings.hover.hoverlabel.align"
+            ng-change="ctrl.editor.onColorChanged()">
+            <option value="">Auto</option>
+            <option value="left">Left</option>
+            <option value="right">Right</option>
+          </select>
+        </div>
+      </div>
+
+      <div class="gf-form" ng-if="ctrl.editor.trace.mapping.text">
+        <label class="gf-form-label width-7">Template</label>
+        <textarea class="gf-form-textarea"
+          ng-model="ctrl.editor.trace.settings.hover.hovertemplate"
+          ng-blur="ctrl.editor.onColorChanged()">
+        </textarea>
+      </div>
+
       <div class="gf-form" ng-if="ctrl.editor.trace.mapping.text">
         <label class="gf-form-label width-7">Show</label>
         <div class="gf-form-select-wrapper max-width-14">