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

fixed text rendering

Browse source
This commit is contained in:
Fedor Katurov 2020-02-14 10:58:09 +07:00
parent 3ca211b9bb
commit 97fe205e5f
2 changed files with 5 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/redux/editor/sagas.ts
View file

@ -118,7 +118,6 @@ function* getRenderData() {
yield put(editorSetRenderer({ info: 'Загрузка тайлов', progress: 0.1 })); yield put(editorSetRenderer({ info: 'Загрузка тайлов', progress: 0.1 }));
const { route, stickers, provider }: ReturnType<typeof selectMap> = yield select(selectMap); const { route, stickers, provider }: ReturnType<typeof selectMap> = yield select(selectMap);
const gpx: ReturnType<typeof selectEditorGpx> = yield select(selectEditorGpx);
const { distance }: ReturnType<typeof selectEditor> = yield select(selectEditor); const { distance }: ReturnType<typeof selectEditor> = yield select(selectEditor);
const canvas = <HTMLCanvasElement>document.getElementById('renderer'); const canvas = <HTMLCanvasElement>document.getElementById('renderer');

12
src/utils/renderer.ts
View file

@ -66,13 +66,12 @@ const tileToLatLng = (point: { x: number; y: number }): LatLng => {
}; };
export const getTilePlacement = (): ITilePlacement => { export const getTilePlacement = (): ITilePlacement => {
const map = MainMap;
const width = window.innerWidth; const width = window.innerWidth;
const height = window.innerHeight; const height = window.innerHeight;
// map corners // map corners
const southWest = map.getBounds().getSouthWest(); const southWest = MainMap.getBounds().getSouthWest();
const northEast = map.getBounds().getNorthEast(); const northEast = MainMap.getBounds().getNorthEast();
// map corner's tile files [x, y, z] to fetch from server // map corner's tile files [x, y, z] to fetch from server
const southWestTile = latLngToTile(southWest); const southWestTile = latLngToTile(southWest);
@ -85,8 +84,8 @@ export const getTilePlacement = (): ITilePlacement => {
// actual coords of file's corners (they're shifted from view) // actual coords of file's corners (they're shifted from view)
const southWestTileCoords = tileToLatLng(southWestTile); const southWestTileCoords = tileToLatLng(southWestTile);
const tileTransformTranslate = map.latLngToLayerPoint(southWestTileCoords); const tileTransformTranslate = MainMap.latLngToLayerPoint(southWestTileCoords);
const msw2 = map.latLngToLayerPoint(southWest); const msw2 = MainMap.latLngToLayerPoint(southWest);
return { return {
minX, minX,
@ -317,7 +316,7 @@ const measureRect = (x: number, y: number, width: number, height: number, scale:
rectY: y - 7 * scale - height / 2, rectY: y - 7 * scale - height / 2,
rectW: width + 46 * scale, rectW: width + 46 * scale,
rectH: height + 20 * scale, rectH: height + 20 * scale,
textX: reversed ? x - width - 36 : x + 36 * scale, textX: reversed ? x - width - (36 * scale) : x + 36 * scale,
}); });
const measureDistRect = ( const measureDistRect = (
@ -402,7 +401,6 @@ const composeStickerText = (
// text // text
ctx.fillStyle = 'white'; ctx.fillStyle = 'white';
lines.map((line, i) => ctx.fillText(line, textX, rectY + (6 + 16 * (i + 1)) * scale)); lines.map((line, i) => ctx.fillText(line, textX, rectY + (6 + 16 * (i + 1)) * scale));
// ctx.scale(1/scale, 1/scale);
}; };
export const composeDistMark = ({ export const composeDistMark = ({