Skip to content

Cookie preferences

We use cookies for our own analytics, to see how our campaigns perform and, if you allow it, to load content from other services such as the Google site search. We never sell your data. Necessary cookies keep the site working and cannot be switched off. See our Cookie Policy for details and our Privacy Policy for how we handle personal data.

Security, load balancing and remembering your cookie choice.

Show us which pages people read and how they find the site, so we can improve it (Google Analytics).

Show us which of our ad campaigns bring visitors to the site and remember the campaign or partner link you arrived from (Google Ads, partner program). We do not use these cookies to build advertising profiles.

Load the site search from Google when you use it. Google sets its own cookies and shows ads in the search results.

© 2026 The ThingsBoard Authors
Try for free

ThingsBoard Cloud

Choose your data region

Your data stays in the region you choose, for residency and compliance. No credit card required.

Rather run it yourself? Install on your own servers

Trip Map

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

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.