bot/WeatherTool
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Increase font and box sizes for large maps

Browse Source
This commit is contained in:
Guntis Smaukstelis
2024-02-09 21:42:55 +02:00
parent 336dbe5596
commit 46b16e462e
2 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/cities/map/canvasDraw.ts
+2 -4
View File
@@ -8,8 +8,6 @@ export function drawOnMap(
windData: [string, string, string, boolean, WindProps], windData: [string, string, string, boolean, WindProps],
props: ResolutionPropsValue, props: ResolutionPropsValue,
): void { ): void {
const boxSize = 80;
const [windDirection, windSpeed, windGusts, roundValues, windProp] = windData; const [windDirection, windSpeed, windGusts, roundValues, windProp] = windData;
const [bgImg, arrowImg] = imgArr; const [bgImg, arrowImg] = imgArr;
@@ -24,13 +22,13 @@ export function drawOnMap(
ctx.beginPath(); ctx.beginPath();
ctx.fillStyle = "#FFFFFF"; ctx.fillStyle = "#FFFFFF";
ctx.rect(localX-boxSize/2, localY-boxSize/2, boxSize, boxSize); ctx.rect(localX-props.boxSize/2, localY-props.boxSize/2, props.boxSize, props.boxSize);
ctx.fill(); ctx.fill();
}); });
ctx.fill(); ctx.fill();
// weather values // weather values
ctx.font = "bold 30px Rubik"; ctx.font = `bold ${props.fontSize}px Rubik`;
ctx.textAlign = "center"; ctx.textAlign = "center";
ctx.textBaseline = "middle"; ctx.textBaseline = "middle";
coords.forEach(([, {x, y}, value]) => { coords.forEach(([, {x, y}, value]) => {
web/src/cities/map/mapConsts.ts
+6 -4
View File
@@ -13,13 +13,15 @@ export type ResolutionPropsValue = {
scale: number; scale: number;
showWind: boolean; showWind: boolean;
map: string; map: string;
fontSize: number;
boxSize: number;
}; };
export const resolutionProps: Record<string, ResolutionPropsValue> = { export const resolutionProps: Record<string, ResolutionPropsValue> = {
"map_1920x1080": { offsetX: 290, offsetY: 120, width: 1920, height: 1080, scale: 1.35, showWind: false, map: map_1920x1080 }, "map_1920x1080": { offsetX: 290, offsetY: 120, width: 1920, height: 1080, scale: 1.35, fontSize: 30, boxSize: 80, showWind: false, map: map_1920x1080 },
"map_1920x1080_wind": { offsetX: 90, offsetY: 120, width: 1920, height: 1080, scale: 1.35, showWind: true, map: map_1920x1080_wind }, "map_1920x1080_wind": { offsetX: 90, offsetY: 120, width: 1920, height: 1080, scale: 1.35, fontSize: 30, boxSize: 80, showWind: true, map: map_1920x1080_wind },
"map_3840x1440": { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, showWind: false, map: map_3840x1440 }, "map_3840x1440": { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, fontSize: 68, boxSize: 140, showWind: false, map: map_3840x1440 },
"map_3840x1440_wind": { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, showWind: true, map: map_3840x1440_wind }, "map_3840x1440_wind": { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, fontSize: 68, boxSize: 140, showWind: true, map: map_3840x1440_wind },
} }
export type WindProps = { export type WindProps = {