Allow ShieldJSON to specify a map of banners on a base shield instead of requiring separate entries

shieldlib/README.md

@@ -136,6 +136,10 @@ You should create one definition entry for each network. The entry key must matc
     }
   },
   "banners": ["ALT"],
+  "bannerMap": {
+    "ThisNetwork:Truck": ["TRK"],
+    "ThisNetwork:Truck:Bypass": ["TRK", "BYP"]
+  },
   "bannerTextColor": "#000",
   "bannerTextHaloColor": "#FFF",
   "textLayout": {
@@ -176,6 +180,7 @@ You should create one definition entry for each network. The entry key must matc
 
 ![Bannered routes near Downington, PA](https://wiki.openstreetmap.org/w/images/f/f8/Downington_bannered_routes_Americana.png)
 
+- **`bannerMap`**: a map of network-to-banner arrays listing networks that should have the same style but with specified banners.
 - **`bannerTextColor`**: specify the color of the banner text.
 - **`bannerTextHaloColor`**: specify the color of the banner knockout halo.
 - **`textLayout`**: specify how text should be inscribed within the padded bounds of the shield. The text will be drawn at the maximum size allowed by this constraint. See the [text layout functions](#text-layout-functions) section for text layout options.

shieldlib/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@americana/maplibre-shield-generator",
   "description": "Generate highway shields for maplibre-gl-js maps",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "author": "OpenStreetMap Americana Contributors",
   "type": "module",
   "keywords": [

shieldlib/src/shield_renderer.ts

@@ -11,6 +11,7 @@ import {
   RouteDefinition,
   RouteParser,
   ShapeBlankParams,
+  ShieldDefinition,
   ShieldDefinitions,
   ShieldOptions,
   ShieldSpecification,
@@ -104,6 +105,30 @@ export class AbstractShieldRenderer {
   /** Specify which shields to draw and with what graphics */
   protected setShields(shieldSpec: ShieldSpecification) {
     this._renderContext.options = shieldSpec.options;
+
+    // Unpack any banner maps and compose them as separate network entries in-memory
+    for (const [key, shieldDef] of Object.entries(shieldSpec.networks)) {
+      if (!shieldDef) {
+        continue; // Skip if shieldDef is null or undefined
+      }
+
+      // Check to see if it has a bannerMap
+      if (shieldDef.bannerMap) {
+        // If it does, loop through each entry in the bannerMap
+        for (const [bannerKey, banners] of Object.entries(
+          shieldDef.bannerMap
+        )) {
+          // Make a copy of the ShieldDefinition and attach the banners
+          const banneredShieldDef: ShieldDefinition = {
+            ...shieldDef,
+            banners: banners,
+          };
+          // Insert this modified ShieldDefinition into the global network list
+          shieldSpec.networks[bannerKey] = banneredShieldDef;
+        }
+      }
+    }
+
     this._renderContext.shieldDef = shieldSpec.networks;
     this._fontSpec = "1em " + shieldSpec.options.shieldFont;
     console.log("ShieldJSON loaded");

shieldlib/src/types.ts

@@ -35,6 +35,10 @@ export interface ShieldDefinitionBase {
   textLayout?: TextLayout;
   /** Banners to be drawn above a shield */
   banners?: string[];
+  /** Map of additional networks that are bannered variants of this one */
+  bannerMap?: {
+    [key: string]: string[];
+  };
   /** If true, no next should be drawn on this shield */
   notext?: boolean;
   /** Maximum size of shield text */