Skip to content
Stand with Ukraine flag

Trip Map

  • Widget
  • v1.0.0
  • Sep 1, 2026
  • MIT license
  • v4.2+ | Built-in
Trip Map

Displays an entity’s trip on various map providers, allowing scrolling and animated movement. Supports custom markers, marker tooltips, widget actions, polygons, and circles for enhanced spatial representation.

Widget Type
  • Timeseries
Category
  • Maps & Location
Use Cases
  • Fleet Tracking
  • Asset Tracking
  • Cold Chain

Who it’s for

Anyone reconstructing a journey — a delivery route that took longer than it should have, a service vehicle’s day, an asset’s movement between sites. The reader is not asking where it is now but where it went, and the playback control is what turns a static path into an account of the trip.

What it does

The Trip Map draws an entity’s path over the dashboard’s time window and animates a marker along it under a timeline control. The marker rotates to face its direction of travel, the timeline can be scrubbed or played at speeds from 1× to 25×, and a timestamp shows the moment being replayed.

  • Playback, not just a path — the timeline control is what lets a reader watch a journey unfold and stop at the moment something happened.
  • The marker rotates to its heading, so direction of travel is visible without arrows on the line.
  • Playback speeds from 1× to 25× cover both a close look at a manoeuvre and a whole day in a minute.
  • The path can be decorated with direction symbols and its color can follow a key, so speed or status is drawn into the line itself.
  • Individual points can be shown with their own tooltips, for reading the reported positions rather than the interpolated path.
  • A snap-to-location filter can pin the marker to real reported points rather than interpolating between them.
  • The Trip Map replays one window: comparing two journeys means two widgets, and the current position of a fleet belongs on the Map.

How to set up

Data keys

The Trip Map takes a position series per entity from the keys named in the trip layer.

KeyRoleTypeDescription
latitudeThe path’s north-south coordinate over timeTimeseriesTimeseries only — the widget plots history. The key name is configured on the trip layer.
longitudeThe path’s east-west coordinate over timeTimeseriesAs above.
Additional keysValues used in tooltips and path coloringTimeseriesAny keys the tooltip patterns or the path color function reference.

The path covers the dashboard’s time window, so the window is the trip. Set it to the journey being reviewed rather than to a rolling period, or the playback starts and ends at arbitrary points.

Timeline

SettingDefaultEffect
Show timeline controlOnDisplays the playback bar
Time step1000The granularity of playback, in milliseconds
Speed options1, 5, 10, 15, 25The playback speeds offered
Show timestampOnPrints the moment being replayed
Snap to real locationOffPins the marker to reported points rather than interpolating
Rotate markerOnTurns the marker to face its direction of travel

How to customize

  • To draw speed or status into the path — set the path stroke color to a function over an additional key, so the line itself carries the extra dimension.
  • To show direction on the line — turn on the path decorator and set its symbol, size, color and repeat spacing.
  • To show the reported positions — turn on Show points and configure their size, color and tooltip.
  • To review a slow manoeuvre — reduce the Time step, which increases playback granularity.
  • To avoid implying positions that were never reported — turn on Snap to real location, optionally with a filter function.
  • To use a vehicle image instead of a shape — set the marker type to an image and supply it, keeping Rotate marker on.
  • To open on the whole journey — leave Fit map bounds on so the map frames the entire path.

Tips

  • Turn on Show points whenever the reporting interval is coarse. The drawn path is a straight line between reported positions, and without the points a reader cannot tell a vehicle that genuinely drove that way from one that reported twice ten minutes apart.
  • Color the path by speed before reaching for any other diagnostic. A journey’s problem is almost always visible as a stretch of the line in the wrong color, and it locates the moment far faster than scrubbing the timeline does.

Share Your Widget with the Community

Built a custom widget? Export it as a JSON from ThingsBoard and publish it to the IoT Hub through a simple 4-step wizard (Upload, Listing, Readme, Review & Submit). Share it with thousands of ThingsBoard developers worldwide and get featured in the catalog.