Commit 3bda45a5 authored by tom's avatar tom

small fixes

parent b7a94aa2
...@@ -141,7 +141,7 @@ const ChartTooltip = ({ chartId, xScale, yScale, width, height, data, anchorEl, ...@@ -141,7 +141,7 @@ const ChartTooltip = ({ chartId, xScale, yScale, width, height, data, anchorEl,
const createPointerTracker = React.useCallback((event: PointerEvent, isSubsequentCall?: boolean) => { const createPointerTracker = React.useCallback((event: PointerEvent, isSubsequentCall?: boolean) => {
let isShown = false; let isShown = false;
let isPressed = event.pointerType === 'mouse' && event.type === 'pointerdown' && !isSubsequentCall; let isPressed = event.pointerType === 'mouse' && (event.type === 'pointerdown' || event.type === 'pointerenter') && !isSubsequentCall;
if (isPressed) { if (isPressed) {
hideContent(); hideContent();
...@@ -181,11 +181,20 @@ const ChartTooltip = ({ chartId, xScale, yScale, width, height, data, anchorEl, ...@@ -181,11 +181,20 @@ const ChartTooltip = ({ chartId, xScale, yScale, width, height, data, anchorEl,
React.useEffect(() => { React.useEffect(() => {
const anchorD3 = d3.select(anchorEl); const anchorD3 = d3.select(anchorEl);
let isMultiTouch = false; // disabling creation of new tracker in multi touch mode
anchorD3 anchorD3
.on('touchmove.tooltip', (event: PointerEvent) => event.preventDefault()) // prevent scrolling .on('touchmove.tooltip', (event: TouchEvent) => event.preventDefault()) // prevent scrolling
.on(`touchstart.tooltip`, (event: TouchEvent) => {
isMultiTouch = event.touches.length > 1;
})
.on(`touchend.tooltip`, (event: TouchEvent) => {
if (isMultiTouch && event.touches.length === 0) {
isMultiTouch = false;
}
})
.on('pointerenter.tooltip pointerdown.tooltip', (event: PointerEvent) => { .on('pointerenter.tooltip pointerdown.tooltip', (event: PointerEvent) => {
createPointerTracker(event); !isMultiTouch && createPointerTracker(event);
}); });
return () => { return () => {
......
...@@ -38,9 +38,8 @@ export function trackPointer(event: PointerEvent, { start, move, out, end }: Poi ...@@ -38,9 +38,8 @@ export function trackPointer(event: PointerEvent, { start, move, out, end }: Poi
const target = sourceEvent.target as Element; const target = sourceEvent.target as Element;
const touches = d3.pointers(sourceEvent, target); const touches = d3.pointers(sourceEvent, target);
if (touches.length > 1) { // disable current tracker when entering to multi touch mode
untrack(sourceEvent); touches.length > 1 && untrack(sourceEvent);
}
}) })
.on(`pointerup.${ id } pointercancel.${ id } lostpointercapture.${ id }`, (sourceEvent: PointerEvent) => { .on(`pointerup.${ id } pointercancel.${ id } lostpointercapture.${ id }`, (sourceEvent: PointerEvent) => {
if (sourceEvent.pointerId !== id) { if (sourceEvent.pointerId !== id) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment