Dyomedea
/
dyomedea
1
1
Fork 0
Code Issues 4 Pull Requests Projects 3 Releases 1 Wiki Activity

Continuing to re-plug the handlers.

This commit is contained in:
Eric van der Vlist 2022-10-31 21:01:56 +01:00
parent eb1618d009
commit 8deed17b05
2 changed files with 38 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/map/Handlers.tsx
View File

@ -81,10 +81,10 @@ export const Handlers: react.FC<HandlersProperties> = (
if (
mouseState.current.down &&
Date.now() - mouseState.current.timestamp >
handlersConfig.mouseMoveThrottleDelay &&
handlersConfig.mouseMoveThrottleDelay /* &&
(event.clientX - mouseState.current.starting.x) ** 2 +
(event.clientY - mouseState.current.starting.y) ** 2 >
100
100 */
) {
genericHandler(event);
if (mouseState.current.down) {
@ -227,15 +227,6 @@ export const Handlers: react.FC<HandlersProperties> = (
);
const factor = newDistance / touchState.current.distance;
// console.log(`+++++++++ ZOOM Factor is ${factor} ++++++++++`);
touchState.current = {
state: 'double',
touches: [
{ x: event.touches[0].screenX, y: event.touches[0].screenY },
{ x: event.touches[1].screenX, y: event.touches[1].screenY },
],
distance: newDistance,
timestamp: Date.now(),
};
const previousCenter = {
x:
(touchState.current.touches[0].x +
@ -257,10 +248,19 @@ export const Handlers: react.FC<HandlersProperties> = (
},
deltaZoom: factor,
zoomCenter: {
x: currentCenter.x - previousCenter.x,
y: currentCenter.y - previousCenter.y,
x: (currentCenter.x + previousCenter.x) / 2,
y: (currentCenter.y + previousCenter.y) / 2,
},
});
touchState.current = {
state: 'double',
touches: [
{ x: event.touches[0].screenX, y: event.touches[0].screenY },
{ x: event.touches[1].screenX, y: event.touches[1].screenY },
],
distance: newDistance,
timestamp: Date.now(),
};
}
} else if (
touchState.current.state === 'pointer' &&

29
src/components/map/LiveMap.tsx
View File

@ -81,7 +81,8 @@ export const LiveMap: react.FC<LiveMapProperties> = (
const [scope, setScope] = useState(props.scope);
console.log(`LiveMap rendering: ${JSON.stringify(scope)}`);
const transform = (t: Transformation) => {
const deltaZoom = t.deltaZoom === null ? 0 : Math.log2(t.deltaZoom);
const deltaZoom = t.deltaZoom === null ? 1 : t.deltaZoom;
const deltaZoomLevel = Math.log2(deltaZoom);
const tileProvider = tileProviders[scope.tileProvider];
@ -93,17 +94,37 @@ export const LiveMap: react.FC<LiveMapProperties> = (
const relativeScale = 2 ** softZoom;
const visibleTileSize = tileProvider.tileSize * relativeScale;
// Values in pixels
const actualDeltaShift =
t.deltaShift === null ? { x: 0, y: 0 } : t.deltaShift;
const actualZoomCenter =
t.zoomCenter === null ? { x: 0, y: 0 } : t.zoomCenter;
// Values in tiles (for the current zoom level)
const actualDeltaShiftTiles = {
x: actualDeltaShift.x / visibleTileSize,
y: actualDeltaShift.y / visibleTileSize,
};
const actualZoomCenterTiles = {
x: actualZoomCenter.x / visibleTileSize,
y: actualZoomCenter.y / visibleTileSize,
};
const tilesCenter: Point = {
x: lon2tile(scope.center.lon, tilesZoom),
y: lat2tile(scope.center.lat, tilesZoom),
};
const newTilesCenter = {
x:
tilesCenter.x -
(t.deltaShift === null ? 0 : t.deltaShift.x) / visibleTileSize,
actualDeltaShiftTiles.x -
(window.innerWidth / 2 / visibleTileSize - actualZoomCenterTiles.x) *
(deltaZoom - 1),
y:
tilesCenter.y -
(t.deltaShift === null ? 0 : t.deltaShift.y) / visibleTileSize,
actualDeltaShiftTiles.y -
(window.innerHeight / 2 / visibleTileSize - actualZoomCenterTiles.y) *
(deltaZoom - 1),
};
const newScope: MapScope = {
@ -111,7 +132,7 @@ export const LiveMap: react.FC<LiveMapProperties> = (
lat: tile2lat(newTilesCenter.y, tilesZoom),
lon: tile2long(newTilesCenter.x, tilesZoom),
},
zoom: deltaZoom + scope.zoom,
zoom: deltaZoomLevel + scope.zoom,
tileProvider: scope.tileProvider,
};
console.log(