Skip to content

Commit 36d6a37

Browse files
Filmbostock
andauthored
mobile tooltip on tap (#1526)
* mobile tooltip on tap test: https://observablehq.com/@fil/tt-tests * pointermove on pointerenter * ignore pointerleave for non-mouse --------- Co-authored-by: Mike Bostock <[email protected]>
1 parent efad9d7 commit 36d6a37

File tree

1 file changed

+6
-4
lines changed

1 file changed

+6
-4
lines changed

src/marks/tooltip.js

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -92,8 +92,7 @@ export class Tooltip extends Mark {
9292
let sticky = false;
9393

9494
function pointermove(event) {
95-
if (sticky) return;
96-
if (event.buttons === 1) return; // dragging
95+
if (sticky || (event.pointerType === "mouse" && event.buttons === 1)) return; // dragging
9796
const rect = svg.getBoundingClientRect();
9897
let ii, fxi, fyi;
9998
if (
@@ -206,7 +205,8 @@ export class Tooltip extends Mark {
206205
}
207206
}
208207

209-
function pointerdown() {
208+
function pointerdown(event) {
209+
if (event.pointerType !== "mouse") return;
210210
if (sticky) {
211211
sticky = false;
212212
dot.attr("display", "none");
@@ -217,7 +217,8 @@ export class Tooltip extends Mark {
217217
}
218218
}
219219

220-
function pointerleave() {
220+
function pointerleave(event) {
221+
if (event.pointerType !== "mouse") return;
221222
if (!sticky) {
222223
dot.attr("display", "none");
223224
dot.attr("pointer-events", "none");
@@ -246,6 +247,7 @@ export class Tooltip extends Mark {
246247
// us receive pointer events from farther away, but would also make it hard
247248
// to know when to remove the listeners. (Using a mutation observer to watch
248249
// the entire document is likely too expensive.)
250+
svg.addEventListener("pointerenter", pointermove);
249251
svg.addEventListener("pointermove", pointermove);
250252
svg.addEventListener("pointerdown", pointerdown);
251253
svg.addEventListener("pointerleave", pointerleave);

0 commit comments

Comments
 (0)