# Dispatch Map block

> Fleet Dispatch Map with Live Routes, Van Detail Panel, Stop Reassignment and Van List

Same-day dispatch on a live street map: a simulated fleet from minivans to box trucks, a framed fleet panel, an iso and side vehicle twin with its cargo hold, remote controls, a command palette and a filterable grid. MapLibre, ReUI Frame.

- Type: Pro block
- Category: [Map](https://reui.io/blocks/solutions/map.md)
- Page: https://reui.io/blocks/solutions/map/solution-map-1
- MCP: `get_block("solution-map-1")`
- Built with: Alert, Alert Dialog, Avatar, Badge, Button, Button Group, Cascader, Chart, Collapsible, Command, Context Menu, Data Grid, Dialog, Dropdown Menu, Empty, Field, Filters, Frame, Icon Tile, Input, Input Group, Item, Kbd, Number Field, Popover, Progress, Radio Group, Select, Separator, Sheet, Skeleton, Slider, Spinner, Switch, Table, Tabs, Textarea, Timeline, Toggle Group, Tooltip
- Installs with a ReUI Pro or Ultimate license; setup: https://reui.io/docs/license-setup

## Best for

A dispatcher's live street map of a delivery fleet with route ETAs, range checks, a vehicle twin and a van grid

## Agent notes

- Needs maplibre-gl 6.15 and WebGL2; pass `mapStyles` to swap the OpenFreeMap tiles and keep their attribution visible
- `setWorkerUrl` resolves the map worker for Next and webpack, while a Vite build imports the worker URL instead
- Swap `VANS`, `STOP_SEEDS`, `DRIVERS` and `ROUTE_PATHS` for your feeds, map vehicles in `vanTypeOf`, then wire `onStopChange`, `onVanChange` and `onMessage`

## Third-party libraries

- Recharts v3: [API reference](https://recharts.github.io/en-US/api/), [docs](https://recharts.github.io/en-US/guide/getting-started/)
- TanStack Table v9: [API reference](https://tanstack.com/table/v9/docs/framework/react/reference/index), [docs](https://tanstack.com/table/v9/docs/framework/react/quick-start)
- MapLibre GL JS v6: [API reference](https://maplibre.org/maplibre-gl-js/docs/API/), [docs](https://maplibre.org/maplibre-gl-js/docs/), [llms.txt](https://maplibre.org/maplibre-gl-js/docs/llms.txt)
- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started)
- cmdk v1: [API reference](https://github.com/dip/cmdk#parts-and-styling), [docs](https://github.com/dip/cmdk), through shadcn Command

## Install

```bash
npx shadcn@latest add @reui/solution-map-1
```

## About Map blocks

### When to use

- Dispatch and fleet pages where the work happens on a real street map: vans, routes, stops and their exceptions
- Location operations that need analytics beside the map and actions on what the map shows

### When not to use

- Stock, warehouse and shipping fulfillment with no live map of vehicles or routes: use the [Inventory blocks](https://reui.io/blocks/solutions/inventory.md)
- Appointments booked by time slot and staff member: use the [Bookings blocks](https://reui.io/blocks/solutions/bookings.md)
- A 3D model of a site, a machine or a venue rather than a street map: use the [Digital Twin blocks](https://reui.io/blocks/solutions/digital-twin.md)

### Agent notes

- Blocks render with `maplibre-gl` 6 and OpenFreeMap tiles: no key, commercial use allowed, attribution stays visible on the map
- The map-prefixed files in each block are a domain-free map kit you can lift whole; pass `mapStyles` to swap the basemap
- Each block keeps the Heron Run world in its own `data.ts` with `NOW` as the frozen clock; swap the records, keep the rules

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.