The districts

Three districts, drawn from plain GeoJSON, fading up together.
<om-step
  duration="3s" fade
  layer="regions"></om-step>

{{name}}

Population{{population}}
Area{{area_km2}} km²
Founded{{founded}}

{{name}}

Population{{population}}
Area{{area_km2}} km²
Founded{{founded}}

{{name}}

Population{{population}}
Area{{area_km2}} km²
Founded{{founded}}

Point layers too

A point layer can be populated in — each rack drops onto the map one by one.
<om-step
  duration="3s" populate
  layer="bikes" parallel></om-step>

Camera control

Name a feature and the camera frames it — no coordinates, no zoom maths.
<om-step
  action="zoom-to-feature"
  layer="regions"
  feature-id="north-beach"
  curve></om-step>

Camera angles

Tilt with `pitch`, swivel with `bearing` — positive turns east, negative west.
<om-step
  action="fly-to"
  pitch="45"
  bearing="0"></om-step>
Easing is handled for you — `curve` arcs the move out and back in.
<om-step
  duration="2500ms"
  action="zoom-to-feature"
  feature-id="mission" curve></om-step>
Easing is handled for you — `curve` arcs the move out and back in.
<om-step
  duration="2500ms"
  action="zoom-to-feature"
  feature-id="sunset" curve></om-step>
A step can hide a layer as easily as reveal one, to clear the view.
<om-step
  action="toggle-layer"
  layer="regions"
  visible="false"></om-step>
Try it today: check out OnlyMapJS on npm at @nika-js/onlymap
npm install @nika-js/onlymap
San Francisco, three districts A map story

This map needs JavaScript.
Open this file in a web browser such as Chrome, Safari, or Firefox.