muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 19:16:41 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

render: map composing (working with proper shifts)

Browse source
This commit is contained in:
muerwre 2018-11-28 09:38:39 +07:00
parent 4747c918e2
commit 2f3cb0e770
3 changed files with 22 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/utils/renderer.js
View file

@ -13,13 +13,15 @@ const latLngToTile = latlng => {
const tileToLatLng = point => {
const z = map.getZoom();
const lon = (point.x / Math.pow(2, z) * 360 - 180);
const lng = (point.x / Math.pow(2, z) * 360 - 180);
const n = Math.PI - 2 * Math.PI * point.y / Math.pow(2, z);
const lat = (180 / Math.PI * Math.atan(0.5 * (Math.exp(n) - Math.exp(-n))));
return { lat, lng: lon };
return { lat, lng };
};
window.tileToLatLng = tileToLatLng;
export const getTilePlacement = () => {
const width = window.innerWidth;
const height = window.innerHeight;
@ -39,12 +41,15 @@ export const getTilePlacement = () => {
const southWestTileCoords = tileToLatLng(southWestTile);
const northEastTileCoords = tileToLatLng(northEastTile);
console.log({ southWestTileCoords, northEastTileCoords });
// console.log({ southWestTileCoords, northEastTileCoords });
const rsw = map.latLngToContainerPoint(southWestTileCoords);
const msw = map.latLngToContainerPoint(southWest);
console.log({ southWest, northEast });
const tileTransformTranslate = map.latLngToLayerPoint(southWestTileCoords);
const msw2 = map.latLngToLayerPoint(southWest);
console.log({ rsw, msw, tileTransformTranslate, msw2, });
// console.log({x: rsw.x-msw.x, y: h+rsw.y-msw.y, orig_x: sw.x, orig_y: sw.y})
// console.log('going from '+sw.x+','+sw.y+' to '+ne.x+','+ne.y+' shift '+(rsw.x-msw.x)+','+(h+rsw.y-msw.y));
// console.log('original shift: '+map.latLngToContainerPoint(original_shift))
@ -54,8 +59,13 @@ export const getTilePlacement = () => {
minY,
maxY,
shiftX: (rsw.x - msw.x),
shiftY: (height + (rsw.y - msw.y)) + 3,
// shiftX: (rsw.x - msw.x),
// shiftY: (height + (rsw.y - msw.y)),
shiftX: tileTransformTranslate.x - msw2.x,
shiftY: window.innerHeight + (tileTransformTranslate.y - msw2.y),
// shiftY: 815,
size: 256,
width,