Adapting this stuff to setState which should only becalled once per rendering...
This commit is contained in:
parent
e69a9a65de
commit
50d9fba939
|
@ -10,7 +10,7 @@ interface DoubleTouchHandlerProps {
|
||||||
shift: Point;
|
shift: Point;
|
||||||
addShift: (shift: Point) => void;
|
addShift: (shift: Point) => void;
|
||||||
zoom: number;
|
zoom: number;
|
||||||
addZoom: (zoomFactor: number, center: Point) => void;
|
addZoom: (zoomFactor: number, center: Point, deltaShift?: Point) => void;
|
||||||
children?: any;
|
children?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -102,11 +102,10 @@ const DoubleTouchHandler: react.FC<DoubleTouchHandlerProps> = (
|
||||||
x: (event.touches[0].pageX + event.touches[1].pageX) / 2,
|
x: (event.touches[0].pageX + event.touches[1].pageX) / 2,
|
||||||
y: (event.touches[0].pageY + event.touches[1].pageY) / 2,
|
y: (event.touches[0].pageY + event.touches[1].pageY) / 2,
|
||||||
};
|
};
|
||||||
props.addShift({
|
props.addZoom(factor, currentCenter, {
|
||||||
x: currentCenter.x - previousCenter.x,
|
x: currentCenter.x - previousCenter.x,
|
||||||
y: currentCenter.y - previousCenter.y,
|
y: currentCenter.y - previousCenter.y,
|
||||||
});
|
});
|
||||||
props.addZoom(factor, currentCenter);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -26,10 +26,14 @@ const Map: react.FC<MapProperties> = (props: MapProperties) => {
|
||||||
setShift({ x: shift.x + deltaShift.x, y: shift.y + deltaShift.y });
|
setShift({ x: shift.x + deltaShift.x, y: shift.y + deltaShift.y });
|
||||||
};
|
};
|
||||||
|
|
||||||
const addZoom = (zoomFactor: number, center: { x: number; y: number }) => {
|
const addZoom = (
|
||||||
|
zoomFactor: number,
|
||||||
|
center: { x: number; y: number },
|
||||||
|
deltaShift: { x: number; y: number } = { x: 0, y: 0 }
|
||||||
|
) => {
|
||||||
addShift({
|
addShift({
|
||||||
x: (shift.x - center.x) * (zoomFactor - 1),
|
x: (shift.x - center.x) * (zoomFactor - 1) + deltaShift.x,
|
||||||
y: (shift.y - center.y) * (zoomFactor - 1),
|
y: (shift.y - center.y) * (zoomFactor - 1) + deltaShift.y,
|
||||||
});
|
});
|
||||||
setZoom(zoom * zoomFactor);
|
setZoom(zoom * zoomFactor);
|
||||||
};
|
};
|
||||||
|
|
|
@ -11,7 +11,7 @@ interface MouseHandlerProperties {
|
||||||
shift: Point;
|
shift: Point;
|
||||||
addShift: (shift: Point) => void;
|
addShift: (shift: Point) => void;
|
||||||
zoom: number;
|
zoom: number;
|
||||||
addZoom: (zoomFactor: number, center: Point) => void;
|
addZoom: (zoomFactor: number, center: Point, deltaShift?: Point) => void;
|
||||||
children?: any;
|
children?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue