diff --git a/web/src/assets/map_1920x1080.webp b/web/src/assets/map_1920x1080.webp index bc1640f..bf61c1d 100644 Binary files a/web/src/assets/map_1920x1080.webp and b/web/src/assets/map_1920x1080.webp differ diff --git a/web/src/assets/map_1920x1080_wind.webp b/web/src/assets/map_1920x1080_wind.webp new file mode 100644 index 0000000..bc1640f Binary files /dev/null and b/web/src/assets/map_1920x1080_wind.webp differ diff --git a/web/src/assets/map_3840x1440_wind.webp b/web/src/assets/map_3840x1440_wind.webp new file mode 100644 index 0000000..3e27d6b Binary files /dev/null and b/web/src/assets/map_3840x1440_wind.webp differ diff --git a/web/src/cities/map/MapView.tsx b/web/src/cities/map/MapView.tsx index f02d778..addca84 100644 --- a/web/src/cities/map/MapView.tsx +++ b/web/src/cities/map/MapView.tsx @@ -5,11 +5,13 @@ import { drawRotatedImage, getAngleFromString } from "./windAngles"; import { WindInputs, WindSignals } from "./WindInputs"; import map_1920x1080 from "../../assets/map_1920x1080.webp"; +import map_1920x1080_wind from "../../assets/map_1920x1080_wind.webp"; import map_3840x1440 from "../../assets/map_3840x1440.webp"; +import map_3840x1440_wind from "../../assets/map_3840x1440_wind.webp"; import arrowUrl from "../../assets/arrow.webp"; import { cityCoords } from "../../components/cityCoords"; -type MapResolution = "map_1920x1080" | "map_3840x1440"; +type MapResolution = "map_1920x1080" | "map_1920x1080_wind" | "map_3840x1440" | "map_3840x1440_wind"; type ResolutionPropsValue = { offsetX: number; @@ -22,8 +24,10 @@ type ResolutionPropsValue = { }; const resolutionProps: Record = { - "map_1920x1080": { offsetX: 90, offsetY: 120, width: 1920, height: 1080, scale: 1.35, showWind: true, map: map_1920x1080 }, - "map_3840x1440": { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, showWind: false, map: map_3840x1440 }, + "map_1920x1080": { offsetX: 90, offsetY: 120, width: 1920, height: 1080, scale: 1.35, 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_3840x1440": { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, 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 }, } export const MapView: Component<{ type: MapResolution, data: () => ResultKeyVal[] }> = ({ type, data }) => { @@ -88,7 +92,12 @@ export const MapView: Component<{ type: MapResolution, data: () => ResultKeyVal[ return ( <> - + ); } diff --git a/web/src/cities/result/ResultView.tsx b/web/src/cities/result/ResultView.tsx index 196368c..5358f2c 100644 --- a/web/src/cities/result/ResultView.tsx +++ b/web/src/cities/result/ResultView.tsx @@ -11,7 +11,7 @@ export const ResultView: Component<{ result: Resource }> = ({ result: resultResource }) => { const [getOrderKey, setOrderKey] = createSignal("A -> Z"); - type ResultView = "grid" | "list" | "map_1920x1080" | "map_3840x1440"; + type ResultView = "grid" | "list" | "map_1920x1080" | "map_1920x1080_wind" | "map_3840x1440" | "map_3840x1440_wind"; const [getResultView, setResultView] = createSignal("grid"); const cityData = () => @@ -45,12 +45,26 @@ export const ResultView: Component<{ onClick={() => setResultView("map_1920x1080")} />   |   + setResultView("map_1920x1080_wind")} + /> +   |   setResultView("map_3840x1440")} /> +   |   + setResultView("map_3840x1440_wind")} + /> @@ -80,9 +94,15 @@ export const ResultView: Component<{ + + + + + + );