Geog Basemaps Sprites

This directory contains sprite generation for Geog Basemaps POI icons.

Quick Start

# Generate sprites for light theme (default)
npm run sprites

# Generate sprites for a specific theme
npm run sprites:light
npm run sprites:dark
npm run sprites:warm
npm run sprites:gray

# Generate all theme sprites
npm run sprites:all-themes

Generated Sprites

Sprites are generated for each theme:

| Theme | Output Files | |-------|--------------| | light | dist/light.json, dist/light.png, dist/[email protected], dist/[email protected] | | dark | dist/dark.json, dist/dark.png, dist/[email protected], dist/[email protected] | | warm | dist/warm.json, dist/warm.png, dist/[email protected], dist/[email protected] | | gray | dist/gray.json, dist/gray.png, dist/[email protected], dist/[email protected] |

Directory Structure

sprites/
├── icons-light/     # Pre-processed SVG icons for light theme (315 icons)
├── icons-dark/      # Pre-processed SVG icons for dark theme
├── icons-warm/      # Pre-processed SVG icons for warm theme
├── icons-gray/      # Pre-processed SVG icons for gray theme
├── dist/            # Generated sprite sheets (output)
└── scripts/
    ├── generate-theme-sprites.sh  # Generates sprites from icons-* directories
    └── poi-icons.js               # POI icon definitions

Requirements

• Node.js 18+
• Spreet (Rust tool for sprite sheet generation)

  cargo install spreet

Testing

View the sprite preview page to verify icons render correctly:

# From repository root
open preview/sprites-preview.html

In the basemaps viewer (run npm run dev in /app), check the "local sprites" box to load sprites from /sprites/dist.