diff --git a/apps/web/src/widgets/map3d/Map3D.tsx b/apps/web/src/widgets/map3d/Map3D.tsx index 95f18a6..cd4c710 100644 --- a/apps/web/src/widgets/map3d/Map3D.tsx +++ b/apps/web/src/widgets/map3d/Map3D.tsx @@ -289,7 +289,9 @@ function extractProjectionType(map: maplibregl.Map): MapProjectionId | undefined const DEG2RAD = Math.PI / 180; const RAD2DEG = 180 / Math.PI; -const GLOBE_ICON_HEADING_OFFSET_DEG = -90; +// ship.svg's native "up" direction is north (0deg), +// so map icon rotation can use COG directly. +const GLOBE_ICON_HEADING_OFFSET_DEG = 0; const MAP_SELECTED_SHIP_RGB: [number, number, number] = [34, 211, 238]; const MAP_HIGHLIGHT_SHIP_RGB: [number, number, number] = [245, 158, 11]; const MAP_DEFAULT_SHIP_RGB: [number, number, number] = [100, 116, 139]; @@ -5002,7 +5004,7 @@ export function Map3D({ getIcon: () => "ship", getPosition: (d) => [d.lon, d.lat] as [number, number], getAngle: (d) => - getDisplayHeading({ + -getDisplayHeading({ cog: d.cog, heading: d.heading, }), @@ -5030,7 +5032,7 @@ export function Map3D({ getIcon: () => "ship", getPosition: (d) => [d.lon, d.lat] as [number, number], getAngle: (d) => - getDisplayHeading({ + -getDisplayHeading({ cog: d.cog, heading: d.heading, }), @@ -5085,7 +5087,7 @@ export function Map3D({ getIcon: () => "ship", getPosition: (d) => [d.lon, d.lat] as [number, number], getAngle: (d) => - getDisplayHeading({ + -getDisplayHeading({ cog: d.cog, heading: d.heading, }), @@ -5230,7 +5232,7 @@ export function Map3D({ getIcon: () => "ship", getPosition: (d) => [d.lon, d.lat] as [number, number], getAngle: (d) => - getDisplayHeading({ + -getDisplayHeading({ cog: d.cog, heading: d.heading, }),