Merge pull request #120 from dfpc-coe/circle-color

KML Colors

Author: ingalls

lib/parser/from_geojson.ts

@@ -357,11 +357,11 @@ export async function from_geojson(
                     },
                     Style: {
                         LineStyle: {
-                            color: { _text: strokeColor.as_hexa().slice(1) },
+                            color: { _text: strokeColor.as_kml() },
                             width: { _text: cot.event.detail.strokeWeight?._attributes?.value ? cot.event.detail.strokeWeight._attributes.value : 3 }
                         },
                         PolyStyle: {
-                            color: { _text: fillColor.as_hexa().slice(1) },
+                            color: { _text: fillColor.as_kml() },
                         }
                     }
                 }

lib/parser/to_geojson.ts

@@ -376,27 +376,35 @@ export async function to_geojson(cot: CoT): Promise<Static<typeof Feature>> {
             && raw.event.detail.shape.link?.Style
         ) {
             if (raw.event.detail.shape.link.Style.LineStyle?.color) {
-                const rawColor = raw.event.detail.shape.link.Style.LineStyle.color._text.startsWith('#')
-                    ? raw.event.detail.shape.link.Style.LineStyle.color._text
-                    : '#' + raw.event.detail.shape.link.Style.LineStyle.color._text;
+                let rawColor = raw.event.detail.shape.link.Style.LineStyle.color._text;
+                if (rawColor.startsWith('#')) rawColor = rawColor.substring(1);
 
-                const strokeColor = new Color(rawColor);
+                const a = parseInt(rawColor.substring(0, 2), 16);
+                const b = parseInt(rawColor.substring(2, 4), 16);
+                const g = parseInt(rawColor.substring(4, 6), 16);
+                const r = parseInt(rawColor.substring(6, 8), 16);
+
+                const strokeColor = new Color([a, r, g, b]);
                 feat.properties.stroke = strokeColor.as_hex();
 
-                feat.properties['stroke-opacity'] = strokeColor.as_opacity();
+                feat.properties['stroke-opacity'] = strokeColor.as_opacity() / 255;
             }
 
             if (raw.event.detail.shape.link.Style.LineStyle?.width) {
                 feat.properties['stroke-width'] = Number(raw.event.detail.shape.link.Style.LineStyle.width._text);
             }
 
             if (raw.event.detail.shape.link.Style.PolyStyle?.color) {
-                const rawColor = raw.event.detail.shape.link.Style.PolyStyle.color._text.startsWith('#')
-                    ? raw.event.detail.shape.link.Style.PolyStyle.color._text
-                    : '#' + raw.event.detail.shape.link.Style.PolyStyle.color._text;
+                let rawColor = raw.event.detail.shape.link.Style.PolyStyle.color._text;
+                if (rawColor.startsWith('#')) rawColor = rawColor.substring(1);
+
+                const a = parseInt(rawColor.substring(0, 2), 16);
+                const b = parseInt(rawColor.substring(2, 4), 16);
+                const g = parseInt(rawColor.substring(4, 6), 16);
+                const r = parseInt(rawColor.substring(6, 8), 16);
 
-                const fillColor = new Color(rawColor);
-                feat.properties['fill-opacity'] = fillColor.as_opacity();
+                const fillColor = new Color([a, r, g, b]);
+                feat.properties['fill-opacity'] = fillColor.as_opacity() / 255;
                 feat.properties['fill'] = fillColor.as_hex();
             }
         }

lib/utils/color.ts

@@ -52,6 +52,15 @@ export default class Color {
          }).hexa();
     }
 
+    as_kml(): string {
+        const a = Math.round(this.a).toString(16).padStart(2, '0');
+        const b = Math.round(this.b).toString(16).padStart(2, '0');
+        const g = Math.round(this.g).toString(16).padStart(2, '0');
+        const r = Math.round(this.r).toString(16).padStart(2, '0');
+
+        return `${a}${b}${g}${r}`.toUpperCase();
+    }
+
     as_32bit(): number {
         return (this.a << 24) | (this.r << 16) | (this.g << 8) | this.b;
     }