Patterns

Patterns tile an SVG fill over a region's normal color, adding an orthogonal visual channel. Five patterns are built in: stripes, stripes-diagonal, dots, crosshatch, and solid-outline.

Typical uses: disputed territories, regions with no data, embargoed areas, or any case where color alone is insufficient to mark a categorical distinction.

Examples

All five patterns

https://api.maproll.io/map.svg?scope=world&theme=light&data=DE:80,IT:120,ES:60,FR:100,GB:90&patterns=DE:stripes,IT:dots,ES:crosshatch,FR:stripes-diagonal,GB:solid-outline

Pattern with color override as foreground

When a region also has a color override, that color becomes the pattern foreground (stripes, dots) rather than the theme text color.

https://api.maproll.io/map.svg?scope=world&theme=light&data=RO:1:%23ff0000&patterns=RO:stripes

Pattern-only regions (no value, no color)

Regions with a pattern but no value render the pattern over the theme's base land color.

https://api.maproll.io/map.svg?scope=world&theme=dark&patterns=RU:crosshatch,CN:dots,IR:stripes

Parameters

GET — patterns= query param

patterns=DE:stripes,IT:dots,ES:crosshatch

Comma-separated id:patternName pairs. IDs are uppercased automatically.

POST — regions[].pattern

{
  "scope": "world",
  "regions": [
    { "id": "DE", "value": 100, "pattern": "crosshatch" },
    { "id": "IT", "value": 80,  "pattern": "dots", "color": "#ff0000" }
  ]
}

Field	Type	Allowed values
pattern	string	stripes, stripes-diagonal, dots, crosshatch, solid-outline

Pattern reference

Name	Description
stripes	Horizontal stripes, alternating foreground and background.
stripes-diagonal	Same as stripes but rotated 45°.
dots	Filled circles on a solid background.
crosshatch	Diagonal lines in both directions.
solid-outline	Solid fill with a 1-px stroke — a subtle stylized outline rather than a texture.

All patterns tile at 8×8 px in SVG user-space units, which reads clearly at typical render widths (1,200–2,400 px).

Color precedence

Region inputs	What renders
value: 80, pattern: stripes	Stripes — foreground = theme.text, background = scale color for 80
value: 80, color: #ff0000, pattern: stripes	Stripes — foreground = #ff0000, background = scale color for 80
pattern: stripes only	Stripes — foreground = theme.text, background = theme.land
value: 80, color: #ff0000 (no pattern)	Flat #ff0000 — existing color override behavior

Pattern wins over color override wins over scale-derived fill.

Notes

• Identical (pattern, foreground, background) triples across multiple regions share a single <pattern> definition in the SVG <defs> — the output stays compact.
• Patterns do not appear in the legend. The legend reflects scale stops only.
• There is no global pattern param — patterns are per-region only.
• Invalid pattern names return a 400 error: {"error":"invalid_patterns"}.

POST example

curl -X POST 'https://api.maproll.io/render/map' \
  -H 'content-type: application/json' \
  -d '{
    "scope": "world",
    "theme": "light",
    "regions": [
      { "id": "DE", "value": 100, "pattern": "crosshatch" },
      { "id": "IT", "value": 80,  "pattern": "dots", "color": "#ff0000" }
    ]
  }'

Related

• Color Overrides — color overrides become the pattern foreground
• Data Input — full region data syntax
• Themes — theme.text and theme.land colors used as pattern defaults