From 94fe8488e4572c4c54110e9a6c2da93b66471878 Mon Sep 17 00:00:00 2001 From: MarcoJayUsai Date: Fri, 28 Feb 2025 14:33:31 +0100 Subject: [PATCH 1/2] refactor(drawings): added global drawing lines thickness normalization --- .../react/src/map/drawings/drawingsmanager.ts | 44 ++++++++++++++++--- 1 file changed, 37 insertions(+), 7 deletions(-) diff --git a/frontend/react/src/map/drawings/drawingsmanager.ts b/frontend/react/src/map/drawings/drawingsmanager.ts index 75be02a6..6d193d40 100644 --- a/frontend/react/src/map/drawings/drawingsmanager.ts +++ b/frontend/react/src/map/drawings/drawingsmanager.ts @@ -7,10 +7,12 @@ import { Circle, DivIcon, Layer, LayerGroup, layerGroup, Marker, Polygon, Polyli export abstract class DCSDrawing { #name: string; #parent: DCSDrawingsContainer; + #weight: number; constructor(drawingData, parent: DCSDrawingsContainer) { this.#name = drawingData["name"]; this.#parent = parent; + this.setWeight(drawingData); } getName() { @@ -29,6 +31,26 @@ export abstract class DCSDrawing { }; } + setWeight(drawingData) { + if (!drawingData.thickness) { + return; + } + + this.#weight = drawingData.thickness * 0.5; + + if (this.#weight === 0) { + this.#weight = 0.1; + } + + if (this.#weight > 1) { + this.#weight = 1; + } + } + + getWeight() { + return this.#weight; + } + abstract getLayer(): Layer; abstract setOpacity(opacity: number): void; abstract getOpacity(): number; @@ -101,12 +123,19 @@ export class DCSPolygon extends DCSDrawing { fillColor: `${decimalToRGBA(drawingData.fillColorString)}`, opacity: 1, fillOpacity: 1, - weight: 1, + weight: this.getWeight(), dashArray: dashArray, }); break; case "arrow": + let weight = this.getWeight(); + + if (!weight || weight < 1) { + weight = 1; + } + + const arrowBounds = [ [drawingData.points["1"].lat, drawingData.points["1"].lng], [drawingData.points["2"].lat, drawingData.points["2"].lng], @@ -123,7 +152,7 @@ export class DCSPolygon extends DCSDrawing { fillColor: `${decimalToRGBA(drawingData.fillColorString)}`, opacity: 1, fillOpacity: 1, - weight: 1, + weight: weight, dashArray, }); break; @@ -180,7 +209,7 @@ export class DCSPolygon extends DCSDrawing { fillColor: `${decimalToRGBA(drawingData.fillColorString)}`, opacity: 1, fillOpacity: 1, - weight: 1, + weight: this.getWeight(), dashArray: dashArray, }); break; @@ -230,7 +259,7 @@ export class DCSPolygon extends DCSDrawing { fillColor: `${decimalToRGBA(drawingData.fillColorString)}`, opacity: 1, fillOpacity: 1, - weight: drawingData.thickness, + weight: this.getWeight(), dashArray: dashArray, }); @@ -242,11 +271,12 @@ export class DCSPolygon extends DCSDrawing { fillColor: `${decimalToRGBA(drawingData.fillColorString)}`, opacity: 1, fillOpacity: 1, - weight: drawingData.thickness, + weight: this.getWeight(), dashArray: dashArray, }); break; - default: + + default: break; } @@ -297,7 +327,7 @@ export class DCSLine extends DCSDrawing { this.#line = new Polyline(points, { color: `${decimalToRGBA(drawingData.colorString)}`, - weight: drawingData.thickness, + weight: this.getWeight(), dashArray: dashArray, }); From 3142a438f7c93ea231eb9433acfdadaca8a8aacc Mon Sep 17 00:00:00 2001 From: MarcoJayUsai Date: Thu, 6 Mar 2025 17:14:05 +0100 Subject: [PATCH 2/2] fix(drawings): added keys to drawing menu elements --- frontend/react/src/ui/panels/drawingmenu.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/react/src/ui/panels/drawingmenu.tsx b/frontend/react/src/ui/panels/drawingmenu.tsx index fa75d8ea..f061e168 100644 --- a/frontend/react/src/ui/panels/drawingmenu.tsx +++ b/frontend/react/src/ui/panels/drawingmenu.tsx @@ -66,7 +66,7 @@ export function DrawingMenu(props: { open: boolean; onClose: () => void }) { function renderDrawingsContainerControls(container: DCSDrawingsContainer) { if (container.hasSearchString(searchString)) { return ( -
+
void }) {
{openContainers.includes(container) && container.getSubContainers().map((container) => renderDrawingsContainerControls(container))} {openContainers.includes(container) && - container.getDrawings().map((drawing) => { + container.getDrawings().map((drawing, index) => { if (drawing instanceof DCSEmptyLayer) return <>; return ( -
+