implement hovertemplate for ohlc and candlestick traces

Author: emilykl

src/components/fx/hover.js

@@ -1662,7 +1662,11 @@ function getHoverLabelText(d, showCommonLabel, hovermode, fullLayout, t0, g) {
         text = name;
     }
 
-    // hovertemplate
+    // Ignore hovertemplate if hoverlabel.split is set
+    // This ensures correct behavior of hoverlabel.split for candlestick and OHLC traces
+    // Not very elegant but it works
+    if (d.trace?.hoverlabel?.split) d.hovertemplate = false;
+
     const { hovertemplate = false } = d;
     if (hovertemplate) {
         const labels = d.hovertemplateLabels || d;

src/traces/candlestick/attributes.js

@@ -2,6 +2,8 @@
 
 var extendFlat = require('../../lib').extendFlat;
 var axisHoverFormat = require('../../plots/cartesian/axis_format_attributes').axisHoverFormat;
+var hovertemplateAttrs = require('../../plots/template_attributes').hovertemplateAttrs;
+var templatefallbackAttrs = require('../../plots/template_attributes').templatefallbackAttrs;
 var OHLCattrs = require('../ohlc/attributes');
 var boxAttrs = require('../box/attributes');
 
@@ -49,6 +51,8 @@ module.exports = {
 
     text: OHLCattrs.text,
     hovertext: OHLCattrs.hovertext,
+    hovertemplate: OHLCattrs.hovertemplate,
+    hovertemplatefallback: OHLCattrs.hovertemplatefallback,
 
     whiskerwidth: extendFlat({}, boxAttrs.whiskerwidth, { dflt: 0 }),
 

src/traces/candlestick/defaults.js

@@ -28,6 +28,9 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
 
     coerce('text');
     coerce('hovertext');
+    coerce('hovertemplate');
+    coerce('hovertemplatefallback');
+
     coerce('whiskerwidth');
 
     layout._requestRangeslider[traceOut.xaxis] = true;

src/traces/ohlc/attributes.js

@@ -2,7 +2,10 @@
 
 var extendFlat = require('../../lib').extendFlat;
 var scatterAttrs = require('../scatter/attributes');
+var baseAttrs = require('../../plots/attributes');
 var axisHoverFormat = require('../../plots/cartesian/axis_format_attributes').axisHoverFormat;
+var hovertemplateAttrs = require('../../plots/template_attributes').hovertemplateAttrs;
+var templatefallbackAttrs = require('../../plots/template_attributes').templatefallbackAttrs;
 var dash = require('../../components/drawing/attributes').dash;
 var fxAttrs = require('../../components/fx/attributes');
 var delta = require('../../constants/delta.js');
@@ -105,7 +108,13 @@ module.exports = {
         editType: 'calc',
         description: 'Same as `text`.'
     },
-
+    hovertemplate: hovertemplateAttrs(
+        {},
+        {
+            keys: ['open', 'high', 'low', 'close']
+        }
+    ),
+    hovertemplatefallback: templatefallbackAttrs(),
     tickwidth: {
         valType: 'number',
         min: 0,

src/traces/ohlc/defaults.js

@@ -28,6 +28,9 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
 
     coerce('text');
     coerce('hovertext');
+    coerce('hovertemplate');
+    coerce('hovertemplatefallback');
+
     coerce('tickwidth');
 
     layout._requestRangeslider[traceOut.xaxis] = true;

src/traces/ohlc/hover.js

@@ -165,7 +165,7 @@ function hoverOnPoints(pointData, xval, yval, hovermode) {
         return t.labels[attr] + Axes.hoverLabelText(ya, trace[attr][i], trace.yhoverformat);
     }
 
-    var hoverinfo = di.hi || trace.hoverinfo;
+    var hoverinfo = di.hi || trace.hoverinfo || '';
     var hoverParts = hoverinfo.split('+');
     var isAll = hoverinfo === 'all';
     var hasY = isAll || hoverParts.indexOf('y') !== -1;