Small interaction improvements

vasturiano · Oct 23, 2023 · 30ba6a3 · 30ba6a3
1 parent fe1dbbe
commit 30ba6a3
Showing 1 changed file with 17 additions and 23 deletions.
diff --git a/src/hilbert.js b/src/hilbert.js
@@ -300,21 +300,18 @@ export default Kapsule({
           state.hoverD = hoverD;
 
           state.rangeTooltip.style('display', 'none');
-          if (hoverD) {
-            if (state.showRangeTooltip) {
-              state.rangeTooltip.style('display', 'inline');
-
-              const d = hoverD;
-              if (state.rangeTooltipContent) {
-                state.rangeTooltip.html(accessorFn(state.rangeTooltipContent)(d));
-              } else {
-                // default tooltip
-                const rangeLabel = accessorFn(state.rangeLabel);
-                const rangeFormatter = d => state.valFormatter(d.start) + (d.length > 1 ? ' - ' + state.valFormatter(d.start + d.length - 1) : '');
-                state.rangeTooltip.html(`<b>${rangeLabel(d)}</b>: ${rangeFormatter(d)}`);
-              }
-            }
+          if (hoverD && state.showRangeTooltip) {
+            const d = hoverD;
+            const tooltipContent = state.rangeTooltipContent
+              ? accessorFn(state.rangeTooltipContent)(d)
+              // default tooltip
+              : `<b>${accessorFn(state.rangeLabel)(d)}</b>: ${state.valFormatter(d.start) + (d.length > 1 ? ' - ' + state.valFormatter(d.start + d.length - 1) : '')}`
+
+            state.rangeTooltip.html(tooltipContent || '');
+            tooltipContent && state.rangeTooltip.style('display', 'inline');
           }
+
+          hilbertCanvas.style('cursor', hoverD && state.onRangeClick ? 'pointer' : null);
           state.onRangeHover && state.onRangeHover(hoverD || null);
         }
       }
@@ -439,16 +436,13 @@ export default Kapsule({
           state.rangeTooltip.style('display', 'none');
 
           if (state.showRangeTooltip) {
-            state.rangeTooltip.style('display', 'inline');
-
-            if (state.rangeTooltipContent) {
-              state.rangeTooltip.html(accessorFn(state.rangeTooltipContent)(d));
-            } else {
+            const tooltipContent = state.rangeTooltipContent
+              ? accessorFn(state.rangeTooltipContent)(d)
               // default tooltip
-              const rangeLabel = accessorFn(state.rangeLabel);
-              const rangeFormatter = d => state.valFormatter(d.start) + (d.length > 1 ? ' - ' + state.valFormatter(d.start + d.length - 1) : '');
-              state.rangeTooltip.html(`<b>${rangeLabel(d)}</b>: ${rangeFormatter(d)}`);
-            }
+              : `<b>${accessorFn(state.rangeLabel)(d)}</b>: ${state.valFormatter(d.start) + (d.length > 1 ? ' - ' + state.valFormatter(d.start + d.length - 1) : '')}`
+
+            state.rangeTooltip.html(tooltipContent || '');
+            tooltipContent && state.rangeTooltip.style('display', 'inline');
           }
 
           state.onRangeHover && state.onRangeHover(d);