# OpenStreetMap Nominatim / GeoJSON Static SVG Map Renderer with Styled POI Icons and Route Overlay

Render a GeoJSON FeatureCollection as a self-contained, tile-free static SVG map: OSM Carto-style water/greens/buildings and class-coloured roads, amenity/shop/tourism-classified POI pin icons with halo labels, highlighted route LineStrings with geodesic bearing arrows, scale bar, lat/lon graticule and the embedded OpenStreetMap attribution (ODbL). Optional Nominatim geocoding (max 5 queries, policy-compliant pacing and User-Agent) adds place markers.

> Canonical page: https://elysiatools.com/en/tools/openstreetmap-nominatim-geojson-static-svg-map-renderer-with-styled-poi-icons-and-route-overlay

- **Category:** Geography

- **Keywords:** geojson to svg, static map, osm carto style, poi icons, route overlay, bearing arrows, nominatim geocoding, openstreetmap attribution, odbl, web mercator, tile free map, hiking map, travel blog map, offline map

## Overview

A vector map renderer with no tile dependency: features are projected with Web Mercator (EPSG:3857 slippy math) fitted to the data bbox, then drawn in cartographic order — landuse (#e0dfdf), greens (#add19e/#c8facc), water (#aad3df), buildings (#d9d0c9), roads with casing per class (motorway #e892a2, trunk #f9b29c, primary #fcd6a4, secondary #f7fabf, residential white), highlighted route LineStrings with per-segment bearing arrows (θ = atan2(sin Δλ cos φ₂, cos φ₁ sin φ₂ − sin φ₁ cos φ₂ cos Δλ); Mercator is conformal, screen rotation = bearing − 90°), POI pins classified by amenity/shop/tourism with white-halo labels (paint-order), a scale bar derived from metres-per-pixel at the bbox centre latitude, an optional lat/lon graticule, and the OpenStreetMap attribution embedded in the SVG per the OSMF guidelines (© OpenStreetMap contributors, ODbL, linked to openstreetmap.org/copyright). Nominatim geocoding is optional (leave empty for fully offline rendering): max 5 queries, 1.1 s apart per the absolute 1-request/second policy, with an application-identifying User-Agent; failures become warnings, never a broken render.

## Inputs

- **GeoJSON FeatureCollection** (textarea): {"type":"FeatureCollection","features":\[…\]}
- **Nominatim place queries (max 5, semicolon-separated)** (text): Brandenburg Gate; Eiffel Tower (leave empty for offline)
- **SVG width (px)** (number)
- **SVG height (px)** (number)
- **POI labels** (checkbox)
- **Route bearing arrows** (checkbox)
- **Scale bar** (checkbox)
- **Lat/lon graticule** (checkbox)
- **Write downloadable .svg file** (checkbox)

## When to use

- When you need lightweight, resolution-independent vector SVG maps for websites, PDFs, or print without loading raster map tile servers.
- When plotting outdoor hiking trails or transit routes that require geodesic bearing arrows indicating segment directions.
- When visualizing geographic polygons, classified amenities (cafes, hotels, viewpoints), and geocoded place markers in a clean static layout.

## How it works

- Paste a GeoJSON FeatureCollection into the input field and optionally add up to five semicolon-separated Nominatim place search queries.
- Customize the output by setting SVG dimensions and toggling POI labels, bearing arrows, scale bar, or the lat/lon graticule grid.
- The renderer projects all features using Web Mercator (EPSG:3857) fitted to the data bounds, paints styled cartographic layers in order, and generates the SVG code.

## Use cases

- Generating static trail maps with directional route overlays and scale bars for outdoor guidebooks and travel blogs.
- Creating vector basemaps of municipal boundaries and neighborhood amenities for print reports and static documentation.
- Geocoding and displaying multiple landmark destinations alongside custom route GeoJSON for event location overviews.

## Frequently asked questions

### Does this tool require external raster map tile servers?

No, it converts raw vector coordinates directly into SVG paths and shapes without fetching external slippy map tiles.

### How does the Nominatim geocoding feature work?

You can provide up to 5 place queries, which are queried with policy-compliant pacing (1.1s intervals) to place marker pins on your map.

### How are route bearing arrows calculated?

Directional arrows calculate the forward geodesic bearing for each line segment and rotate accordingly based on Mercator projection angles.

### How are POI markers categorized and styled?

Points are automatically classified and styled using standard OpenStreetMap tags such as amenity, tourism, and shop with white-halo labels.

### Is OpenStreetMap attribution included in the SVG?

Yes, compliant © OpenStreetMap contributors (ODbL) licensing metadata and text are embedded directly within the SVG file.

## Related tools

- [Audio Melody Contour Extractor](https://elysiatools.com/en/tools/audio-melody-contour-extractor): Extract a dominant melody path from audio and export MIDI, note events, a pitch contour, SVG, and JSON in one ZIP.
- [Data URI Generator](https://elysiatools.com/en/tools/data-uri-generator): Convert files into Data URIs (Base64 or percent-encoded) for inlining images, fonts, and assets directly into HTML, CSS, or Markdown
- [CSV Histogram, Scatter and Box Plot Chart Studio](https://elysiatools.com/en/tools/csv-histogram-scatter-box-plot-chart-studio): Upload or paste a CSV and chart it instantly: histograms with Sturges / Freedman-Diaconis / Scott binning, scatter plots with Pearson r and a least-squares fit, and Tukey box plots — every chart downloadable as PNG and SVG.
- [ECharts Theme Token Extractor](https://elysiatools.com/en/tools/echarts-theme-token-extractor): Extract design tokens — colors, numbers, font sizes and strings — from an ECharts theme JSON and export them straight into your design system. Paste a theme object (the kind registered via echarts.init(dom, themeName)) and the tool walks every leaf, tagging each color (with optional named/rgb → hex normalization), spacing number, font size and string, then emits clean CSS variables, a Tailwind theme.extend config, Style Dictionary tokens.json, or SCSS variables. Bridges the gap between an ECharts visualization theme and Figma/CSS/Tailwind design tokens without copying each value by hand.
- [OCR PDF to Structured JSON Bridge](https://elysiatools.com/en/tools/ocr-pdf-to-structured-json-bridge): Extract the PDF text layer with geometry (lines by y-position, tables by column gaps, headings by font size, colon key-value pairs), then fill a user-supplied JSON Schema field by field — labels matched by normalized keys, values coerced to declared types and validated with ajv.
- [Pictograph Generator](https://elysiatools.com/en/tools/pictograph-generator): Create pictographs using icons/symbols to represent quantities with customizable icons, colors, and layouts
- [Podcast Chapter Marker Builder](https://elysiatools.com/en/tools/podcast-chapter-marker-builder): Build every podcast chapter format from one timecoded list: Podcasting 2.0 JSON + RSS tag, ID3v2.4 CHAP+CTOC burned into an MP3, Vorbis comments, mp4chaps, YouTube timestamps and SRT, with a per-player support matrix.
- [SQL Explain Plan Visualizer](https://elysiatools.com/en/tools/sql-explain-plan-visualizer): Parse EXPLAIN / EXPLAIN ANALYZE output (PostgreSQL/MySQL/SQLite) into a cost tree, flag estimated-vs-actual row divergence, and suggest indexes

## Samples

- [D3.js Data Visualization Samples](https://elysiatools.com/en/samples/d3js-data-visualization): Comprehensive D3.js data visualization examples including charts, maps, animations, and interactive visualizations
- [SVG Samples](https://elysiatools.com/en/samples/svg-samples): Scalable Vector Graphics (SVG) samples demonstrating various SVG features and techniques
- [SVG Viewer Samples](https://elysiatools.com/en/samples/svg-viewer-samples): Sample SVG vector graphics (scene, icon set, diagram) for the in-browser SVG Viewer
- [GeoJSON Viewer Samples](https://elysiatools.com/en/samples/geojson-viewer-samples): A GeoJSON sample for in-browser preview