2.1 Features

Settings

All configurable features can be accessed by pressing the gear icon in the bottom left. They are:

Input Fields

• Search Radius: The circular radius in which the next target may be generated
• Speed (ms): The time between each step
• Search Direction: Allows you to make the car drive strictly in a specific direction. The options consist of 'All' (any direction) and the 8 compass directions
• Routing Profile: Allows you to specify the routing profile



Navigation Options

• Show route path: Shows the route to the next target with a blue line
• Show alternative routes: Shows alternative routes to the next target with gray lines (if available)
• Hide Trail: Hide the red trail line from the map


• Follow car: Pan the map to the car's location while moving
• Smooth Movement: Makes the car marker and trail move smoothly instead of jumping to new step coordinate instantly
• Map Rotation: Rotate the map based on the car's heading
• Map Tilt: Set the map pitch to 60 degrees
• Zoom to car: Fix the camera close-up to the car
• Smooth Bearing: Eased rotation animations


• Show ETA to next target: Shows the ETA to reach the next target (in travel time, distance left & arrival time)
• Show turn-by-turn instructions: Shows a navigation guidance box that displays the next turn step along the route
• Show Local Time: Shows the current local time of the car, based on it's coordinates
• Show Odometer: Shows an odometer attached to the radio or standalone in the bottom right. Rounded to full kilometers and animated like a real odometer
• Show km/h: Shows a speedometer, available when Smooth Movement is on


• Limit trail length: Limit the length of the trail
• Limit route path length: Limit the length of the route path
• Optimize route line: Optimizes performance by not constantly trimming the route line. Instead, just shows the static full line



Radio Options

• Enable Radio: Enable the Radio box in the top-right
• Show Active Radio Station: Show the location of the currently playing radio station on the map (dark gray marker)
• Show Radio Range: Show the radio's 100km range with a dark gray circle
• Disable Radio Range: Disable radio's 100km range. If enabled, the radio station will never change automatically
• Hide Radio: If enabled, hides the radio on the screen. The radio still remains enabled and functional, just not visible
• Radio Position: Choose where the radio should be positioned. Options are 'Bottom Right' and 'Top Right'



Street View Options

• Show Street View: Show a Google Street View image from the car's current location and bearing
• Split View: 50/50 split between the map and Street View (offers bigger Street View)
• Full View + Minimap: Show the Street View on the full width and height of the page, with a small version of the map
• Minimap Size: Choose the size of the minimap, available in 'Full View + Minimap' mode. Options are 'Small' (250x170), 'Medium' (350x225) and 'Large' (450x300)
• Allow Street View interaction: By default, the Street View embeds block all pointer events. If enabled, this block is lifted and you can interact with the Street View



Traffic Options

• Enable Traffic: Enable traffic throughout the drive
• Traffic Volume: Set the congestion intensity
• Traffic Engine: Ability to choose which traffic generator to use. V2 is recommended for realism
• Regenerate Traffic: When clicked, generates new random traffic windows
• Regenerate traffic every: When enabled, regenerates traffic automatically on a set interval
• Regeneration mode: Set the regeneration mode used for automatic regeneration. Either 'Realistic' or 'Full'



Routing Options

• Route Builder: Opens the Route Builder, allowing you to create a route for the car to drive
• Route Presets: Opens the Route Presets popup, a selection of prebuilt routes
• Click To Move: If enabled, clicking on the map routes the car to that location
• Click to move mode: Choose what happens when the car reaches its destination set by click-to-move. Either 'Clear target', 'Keep target' or 'Stop car'
• Queue Next Target (on map click): Allows you to manually set the next target by clicking on the map, indicated by a green marker
• Cancel Next Target: Cancels the next target and generates a new one



Fuel Options

• Enable Fuel: Enables the fuel system
• Fuel capacity: Configure the amount of fuel your car can hold in liters (1-999)
• Fuel consumption: Configure how much fuel your car uses, in liters per 100 kilometers (1-500)
• Auto refuel: Automatically refuel the car when fuel runs out
• Hide Fuel bar: Hide the fuel indicator



Data Options

• Export: Export the full trip data (coordinates) to JSON, CSV or KML
• Import: Import a trip using an exported JSON file
• Reset Data: Clear the data that has been collected during the session



More Options

• Custom Starting Location: Ability to enter any lat/lng and starting from there instead



Theme Options

• Map Style: Set the map style
• Line Style: Customize the route lines
• Trail Style: Customize the trail style further
• Car Icon: Customize the car's icon
• ETA Display: Customize the ETA display
• Guidance Style: Customize the guidance display



Other Options

• Odometer: A simple odometer with 2 decimal places. Is different from the regular odometer enabled using 'Show Odometer'
• Show target point: Shows the next target using a blue marker
• Briefly show next target point: Shows the next target for ~2 seconds with a blue marker
• Show search radius: Show the Search Radius with a blue circle
• Stuck Behaviour: Choose what happens if the car gets stuck when moving in a strict Search Direction
• Randomize search direction after: If Search Direction is not All, this allows you to automatically change the Search Direction every x seconds
• Line thickness: Set width of lines between 1 and 15
• Search new alternative routes: Check for new alternative routes as you drive. Accompanied by an input field to configure the interval
• Big car icon: Increase the size of the car marker
• Fullscreen: Toggle fullscreen
• Show dev overlay: Shows a debug display in the top-right

Smooth Movement

With smooth movement enabled, the OSRM route is converted to a much more detailed route (1m precision). Together with interpolation, this makes the car move along the route smoothly, instead of jumping from point to point.

Note: At speeds below 40, the trail and route lines may not be able to keep up with the current car position accurately. The minimum speed for smooth trimming is 40, while 100 is recommended. The route may still lag slightly behind the car depending on the performance of your device.

Radio

When 'Enable Radio' is enabled, a Radio box will appear in the top right (bottom right if Split View is enabled).

The Radio box shows the currently playing station name, the country code of the currently playing station, along a button to play/pause.

The Radio box also includes a Seek button, which will pick a new random station from the available list.

The available radio stations are all stations from the radio-browser.info API within 100 kilometers of the car's current location.

Every 30 seconds, the page checks if the current station is still within 100 kilometers of the car's location. If not, it requests a new list and picks a new station.

The range check can be disabled by checking the 'Disable Radio Range' option. Additionally, you can visualize the 100km range by enabling 'Show Radio Range'.

Street View

When 'Show Street View' is enabled, a Street View box will appear on the next step. This box shows an embedded Street View panorama based on the car's current location and bearing.

If the current location has no Street View imagery, a placeholder will be shown.

To avoid excessive API requests and ensure a usable viewing experience, Street View updates are limited to once every 3 seconds when the driving speed is set below 3000 milliseconds. This limitation exists for two main reasons:

• Performance & visibility: Refreshing the Street View every few milliseconds (e.g., at 10ms intervals) would overload the interface and render the imagery unviewable due to constant flickering and loading delays.
• API efficiency: Each Street View update requires a call to the Google Maps API. Throttling updates to one every 3 seconds helps reduce unnecessary network requests and avoids hitting rate limits.

At speeds 3000ms and above, Street View is updated with every step, since the frequency aligns or is above the 3-second minimum interval.

Split View

Available if 'Show Street View' is enabled, Split View introduces a bigger focus on the Street View imagery as you drive. The page becomes split in two 50/50 sections. The map is displayed on the left, while the Street View imagery is shown on the right.

Full View + Minimap

Available if 'Show Street View' is enabled, Full View shows the Street View panorama on the entirety of the page. Other components such as the map, radio, ETA and odometer are shown ontop of it.

Traffic

Traffic can be simulated along your routes by enabling the 'Enable Traffic' checkbox under the 'Traffic' collapsible.

When traffic is enabled, random traffic windows (congested segments) are generated along your route. These windows are recalculated whenever you:

• Toggle the traffic option
• Change the Traffic Volume or Engine
• Switch between smooth and non-smooth movement
• Click "Regenerate Traffic"

Traffic Volume controls how severe and frequent congestion is:

• Low: fewer and shorter traffic segments, mostly light congestion
• Medium: a balanced mix of light and moderate traffic
• High: more frequent and longer congested segments, often heavier intensity
• Very High: dense, large-scale congestion across much of the route

Route length also affects results — short routes get smaller and fewer congestion zones, while longer routes receive proportionally larger and more spread-out windows, keeping traffic feeling realistic at any scale.

Each traffic window slows the vehicle depending on congestion severity:

• Low intensity: 2.5× speed reduction
• Medium intensity: 5× speed reduction
• High intensity: 10× speed reduction

Traffic Engines

Three traffic generation engines are available, selectable from the Traffic Engine dropdown:

• V3 (Recommended): A realistic shockwave model. Each traffic event consists of layered components — a high-intensity bottleneck core, an optional queue of vehicles stacking behind it, and an optional low-severity tail representing drivers beginning to brake. Component sizes scale proportionally with route length, and placement is biased toward urban areas at the start and end of a route to simulate city ingress and egress. This produces natural-looking jams rather than randomly scattered segments.
• V2: Generates traffic by calculating actual route distances and placing windows based on desired coverage fractions. Accounts for congestion patterns and avoids unnatural overlaps, making it more realistic than V1.
• V1: A simple random point-based approach. Can produce uneven or chaotic traffic placement, especially on longer routes.

Auto-Regeneration

Traffic can be automatically regenerated on a timer using the "Regenerate traffic every N sec" option. Two regeneration modes are available:

• Realistic: Gradually evolves existing traffic — windows may clear, shift position, change intensity, or spread slightly. New small congestion events can also appear organically. This mode maintains continuity and simulates live traffic changing over time.
• Full: Completely replaces all traffic windows with a freshly generated set, as if regenerating from scratch.

Guidance

When 'Show turn-by-turn instructions' is enabled, a guidance bar will appear in the top-left (or full width on mobile). This bar displays the upcoming turn or instruction based on OSRM data.

The guidance bar consists of an icon to visually show the next step, the distance to the next step and, if available, the (street) name of the next turn.

Alternative Routes

When 'Show alternative routes' is enabled, alternative routes will be shown on the map. These are represented by gray lines (regardless of line style). The presence of alternative routes depends on your route and what OSRM returns.

Alternative route lines are accompanied by labels. These shows the impact on your travel time (e.g. '18 min slower', '4 min faster' or 'Same time')

You can switch to driving alternative routes by clicking on them. Everything will then switch over to that route. The old route becomes an alternative. The click is handled by a seperate Maplibre layer which is wider than the line itself, to make it easier to switch.

Alternative routes disappear after passing the point they seperate from the route you are actively on.

The amount of alternative routes currently available is shown next to the 'Show alternative routes' label in the settings menu. This is only shown when the option is on.

Under the 'Other' collapsible, you can find an additional option named 'Search new alternative routes', which when enabled, will check for new alternative routes as you drive. This is done by making an OSRM request from your car location to the destination. The option in the settings menu is accompanied by a configurable interval in seconds (default 30, minimum 10).

Custom Starting Location

The default starting location is picked from a list of cities all around the world. To start from a custom location, pop open the 'Custom Starting Location' collapsible in the Settings menu, or pass it directly as a URL parameter like so: https://kiyantk.nl/dev/fun/driver/?customstart=40.72089,-74.06735

Routing Profiles

Driver supports three OSRM routing profiles, each optimized for a specific mode of transportation:

• Car: Prioritizes drivable roads, including highways and major roads. Ideal for simulating vehicle navigation and travel times.
• Bike: Uses cycle-friendly paths where available, avoiding highways and roads that are unsafe or restricted for cyclists.
• Foot: Follows pedestrian-friendly routes such as sidewalks, walking trails, and footpaths. Avoids roads without pedestrian access.

When you change the routing profile, the next target will be cancelled and a new one will be generated, using the new routing profile. This does not happen if you have a queued target; in that case the queued target will stay, and a new route will be calculated to it. Beware: When driving a route from the Route Builder, it will also be cancelled if you change the routing profile. Choose the correct routing profile while making the custom route.

The Route Builder also supports these routing profiles. When you select a different routing profile, the route is updated accordingly.

The default routing profile is Car.

Exporting

Your full route can be exported in the following formats:

• JSON: A JSON export of route data. Can later be imported to view the driven route or drive it again.
• CSV: A headerless 'comma-seperated values' file, with the following data: [lat],[lng]
• KML: The full route as a KML file

The JSON export contains the following data:

• route: The full route driven by the car. An array consisting of JSON objects containing 'lat', 'lng', and 'timestamp'
• radioStations: All radio stations you have listened to
• trafficEncounters: All traffic windows encountered during your drive
• stats: Various stats about your drive, like odometer kilometers, total fuel consumption, etc

Importing

You can import trips that have previously been exported as JSON. After importing, the full trip route will be shown on the map. Key statistics are shown in the bottom left. In the bottom right, you will find buttons to exit the preview, or 'Drive', to drive the route again. You can also continue from the end of the route. If you do this, the data stored in the JSON is set again, so another export will not be a full reset. This makes it possible to essentially 'save' your trips and continue them later.

Search Radius

The search radius is the circular range in which the next target may be selected.

A target is selected by generating random coordinates.

The radius is a multiplier where 1 means 100 kilometers. So 0.1 would be 10 km, 0.05 is 5 km, and so on. It's essentially a fractional distance measured in hundreds of kilometers.

Stuck Behaviour

Only available when Search Direction is not set to 'All'.

This setting, found in the 'Other' collapsible, allows you to choose what happens if the car gets stuck searching in a specific direction.

The car is considered 'stuck' if the past 5 target generations resulted in the same coordinates at the end of the returned route. This works because OSRM automatically snaps to the closest valid spot.

An example of getting stuck can be found here by setting Search Direction to 'East'.

Below is an overview of the choices and what they do:

In rare cases, you may still get stuck if it selects different points but in a loop. While 'Change Direction' is the safest option, it may still occur. One example is Tin City, Alaska and setting Search Direction to 'East'. Even with 'Change Direction', this spot can be a dead end, unless you have a big enough radius.

To counteract infinite loops due to slightly differing end coordinates being returned by OSRM, we apply a tolerance of 0.0002.

Since this feature is slightly experimental, all 'stuck' events are logged in the console if you open up Devtools. You may see:

• Stuck in direction "N". Increasing radius to 0.210.
• Max radius reached. Switching to 'Change Direction' and resetting radius.
• Stuck in direction "N". Trying new direction: S
• All directions tried. Switching to searching all directions.

Starting locations

There are many possible starting locations all around the world. One of these is selected upon startup. They are:

URL Parameters

The following URL parameters are available. These can be specified in the URL to start with specific setting choices.

Example: https://kiyantk.nl/dev/fun/driver/?speed=2500&search_radius=1.20&search_direction=NE&show_eta=true&thicker_lines=1&customstart=46.08899,-64.77568

Setups

You can use the setup URL parameter to instantly select various settings. When using the setup URL parameter, use the ID of one of the following setups:

Line Styles

You can customize the look of the trail and route. The following options are available:

Trail Styles

You can customize the look of the trail further by choosing one of these styles. The following options are available:

Car Icons

You can customize the look of the car blip. The following options are available:

Icon	Name	Introduced in
	Direction	v2
	Navigation Arrow	v10

Route Builder

This special mode can be accessed by clicking on the 'Route Builder' button under the Routing collapsible.

Entering this mode automatically stops the car. The UI is replaced by a window in the top left showing two tabs: Route and Traffic.

The Route tab is used to create the route. This tab consists of the following features:

• Settings:
Don't start from car location; teleport instead: If enabled, the first point in the route is not the car's current location, meaning you will be teleported to the first point upon starting. If disabled, simply uses the car's current location as the fixed 1st point. This setting is enabled by default
Clear trail on start: Clears your route driven so far. Recommended if 'teleport instead' is enabled. This setting is enabled by default
Routing Profile: Select which routing profile to use. Either 'Car', 'Bike' or 'Foot'
• Route Overview: A list that shows you the order of all stops and gives you the ability to remove stops
• Export Route: This button exports your route as JSON. This export also includes Traffic created in the Traffic tab
• Import Route: This button allows you to import Route Builder JSON exports. The settings, stops and traffic will be applied

You can add stops by clicking on the map, which will show a numbered marker. If you have 1 or more stops, the route between the stops will also be shown with a blue line.

Markers can be dragged to change the location of a stop.

The Traffic tab is used to define custom traffic windows along the route. This tab consists of the following features:

• Instruction: A small instructional text that explains what to do
• Traffic Overview: A list that shows you the order of all traffic windows, alongside their intensity, length and added time. It also allows you to change the intensity or remove windows
• Clear all windows: This button clears all traffic windows

You can add traffic by clicking on the route. The first click will set the start position and the second click sets the end position.

Traffic windows may not overlap. The indicator will be grayed out, and any clicks will be ignored.

To cancel a window mid-create, simply press the right mouse button.

At the bottom of the screen, you will find two displays:

• ETA (left): Shows the ETA, duration and distance of the route. Also consists of a settings button to configure the ETA and traffic calculations
• Controls (right): Consists of three buttons: 'Exit' (exits the Route Builder), 'Clear' (clears all stops) and 'Drive' (start driving the route)

When starting a custom route, the car will forget about it's original next target and drive that route.

2.2 Changelog

v12

• Added Classic Mode and Trip Mode
• Added Start Menu
• Added Fuel system: fuel display decreases based on speed, refuel button when low, fuel at 0 disables driving
• Added Traffic Builder tool in Route Builder with custom traffic windows and JSON export support
• Added Show Alternative Routes option with clickable gray route lines
• ETA now factors in traffic when traffic is enabled
• Revamped Route Builder with better UI, improved estimates, Smooth Movement estimate option, and fit-to-bounds on import
• Added Guidance Style to Themes
• Added button to open as DocumentPictureInPicture, shown next to Live Connect if supported
• Improved Smooth Bearing for map bearing and car marker rotation
• Added option to start from end of imported route
• Added option to import a different file while in import viewer
• Added 'Big car icon' option
• Regenerate Traffic now generates instantly in smooth movement
• Fixed guidance-ref alignment issue on Safari
• Fixed bug where 'line_style' URL parameter broke the app
• Fixed bug where guidance box was not shown with URL parameter 'guidance'
• Fixed bug where Regenerate Traffic button was not disabled after reload with traffic enabled
• Fixed missing coordinates in JSON export during Smooth Movement
• Show 'Follow Route' when following imported route instead of leftover step
• Updated Live Connect to support new features
• Increased speed penalty for traffic
• Renamed 'Show target point continuously' to 'Show target point'
• Renamed 'Briefly show next target point' to 'Briefly show target point'
• Fixed imported route Duration always showing minutes
• Added URL parameters 'mode', 'guidance_style', 'big_car_icon', 'trip_route'
• Added new ETA style 'Trip'
• Switched all typography to Roboto with Sans-serif fallback
• Fixed Route Builder errors when route is impossible
• Negative step distance below -100 now defaults to 'Follow route'
• Fixed route line width resetting after new segment
• Fixed duplicate map source error when using route_to_target=true
• Increased maximum route line width from 8 to 15
• Added support for modifying line width for all line styles
• Fixed Limit route path length checkbox staying disabled with route_to_target=true
• Fixed black route path issue with route_to_target=true
• Line width resets to default when changing line style
• Fixed traffic line width not applying correctly after regeneration
• Expanded JSON export with stats: odometerKM, totalFuelConsumed, totalRefuels
• Improved bottom bar with multi-row layout and better overflow handling
• Fallback to 'Follow route' if routeToNextTargetSteps is null or empty
• Car location included in Route Builder export; teleport field now always set to true on import
• Removed KIYFUN logo from Settings
• Hide irrelevant UI in Route Builder and Import mode
• Renamed Route Planner to Route Builder
• Entering Picture-in-Picture stops driving and shows full-page notice with return prompt
• Added developer display to show FPS and JSON data size

v11

• Migrated from Leaflet to MapLibre GL JS
• Replaced old map styles with: Bright, OpenStreetMap, Satellite, Streets, Topo, Positron, Dark Matter, MapTiler 3D, OSM Liberty, Fiord Color
• Added guidance navigation box with turn-by-turn instructions
• Added Traffic: enable with checkbox and set Traffic Volume (low, medium, high). Traffic affects route colors and vehicle speed
• Trail customization: new options for trail style beyond line style, including dashed lines and transparency
• Added 13 new line styles
• Introduced Glass UI look
• Added Map Tilt option, sets to map to 60° pitch
• Added ETA style: Compact or Wide (default Wide)
• Fixed vertical alignment of ETA text on iOS
• Added Zoom to car checkbox for fixed zoom during movement
• Mobile adjustments: ETA + Local Time + KM/H now move to top if enabled to prevent overflow
• Removed icon from ETA bar
• New parameters: 'setup' (numeric setup ID), 'tilt', 'smooth_bearing', 'zoom_to_car', 'limit_trail', 'limit_route', 'speedometer', 'map_style', 'skip_splash', 'trail_style' and 'guidance'
• Added short splash screen, skippable with skip_splash
• Revamped importing: Instead of beginning to drive the imported route immediately, it now shows the full driven route on the map, displays some key stats, and allows you to either exit the viewer or start driving
• Introduced random starting locations instead of always Amsterdam. You will now spawn in one of 23 cities all around the globe
• Removed Optimize Route Lines in favor of improved Smooth Movement performance, Limit Trail Line and Limit Route Line
• Merged the 'Export' and 'Import' collapsibles into a single 'Data' collapsible
• Added ability to clear data that has been logged during the route (used for JSON export)
• Added ability to reset map pitch and bearing by double right-clicking on the map
• Fixed crash when emptying input fields on mobile (e.g., adjusting speed from 100 to 50)

v10

• Improved Smooth Movement: Now maintains a constant speed instead of changing speed depending on coordinate proximity
• Massive performance improvements with Smooth Movement and long routes
• Improved odometer: Now expands based on mileage. Instead of capping out at 9999, digits get added when needed
• Added option to change line style (default or Google Maps style for trail & route)
• Added option to change car icon (direction or navigation arrow)
• Replaced 'Thicker Lines' option with 'Line Thickness'. More flexible line thickness customization (1-8 instead of true/false)
• Added option to limit trail length (improves performance on long routes)
• Added option to limit route path length (improves performance on long routes)
• Added option 'Optimize Route Lines' (simplifies parts of the route farther away, improves performance on long routes)
• Added ability to enter fullscreen
• Added km/h indicator
• Added URL parameters 'route_to_target', 'car_icon' and 'line_style'
• Improved “Cancel Next Target” button: No longer cancels the queued target
• Improved distance display: No longer shows negative values
• Fixed issue where odometer digits were misaligned for iOS devices
• Reorganized Settings panel
• Properly centered Settings icon
• Stop browser from restoring Settings checkboxes and selection list values on reload (always start on default)

v9

• Live Connect
• Added ability to copy full route coords to clipboard in Route Planner
• Mobile improvements: Handle Odometer placement if both bottombar items are active to avoid overlapping
• Radio improvements: Upon seeking, stop current audio
• Mobile improvements: Settings menu z-index is lower than odometer
• Mobile improvements: Odometer placed too high on mobile street view regular
• Fixed radio first appearing in top right instead of default bottom right
• Fixed a bug that caused the game to be softlocked when reaching a queued target (infinite loop of OSRM requests)
• Fixed radio station name overflowing
• Minor ETA changes ('3h 21min instead of 3h, 21min' and 'rounding KMs left based on amount, like Google Maps')

v8

• Radio improvements: If no stations are available, show 'No Signal'
• Radio improvements: While seeking, show 'Scanning...'
• Expanded URL query parameters to support more options
• Added button to cancel next target; removes that target and generates a new one
• Street View now updates every 3 seconds even below 3000ms delay (previously disabled)
• Added ability to select a Routing Profile
• Fixed issue where Queue Next Target stayed enabled when entering Route Planner
• Added option to allow interaction with the Street View embed

v7

• Added 'Smooth Movement' option. Offers smoother car movement instead of hard jumps
• Added 'Map Rotation' option, rotates the map based on where the car is facing
• Added 'Route Planner'; allows you to create a route by placing points on the map
• Moved 'Queue Next Target (on map click)' to new 'Routing' collapsible
• Changed radio buttons from text to icons
• Improved radio: First check if stream URL is reachable and not blocked by CORS
• Added 'Show Route to Next Target', draws a blue line to the next target
• Added option to select random search direction automatically after certain amount of seconds
• Added 'Show Local Time', shows the current time based on the car's location
• Expanded JSON exports: Log UNIX timestamp alongside coordinates and radio stations listened to
• Added Route Presets: Prebuilt routes to drive
• Added Import functionality, uses JSON export to re-run a trip
• Mobile styling improvements related to Street View
• Add 'Minimap Size' option, available if Street View is in Full mode
• Radio fixes: Don't trigger Seek when out of range if radio is toggled off & auto-check range when toggling radio on
• Added 'Thicker lines' option, makes trail and route to next target lines wider
• Added distance left in trip info bar (ETA bar)
• Added new google streetview 'No Imagery' placeholder

v6

• Added Street View
• Added Split View
• Added proximity-based radio
• Added 'Show Active Radio Station' option, shows the location of the currently playing radio station with a dark gray marker
• Changed Themes to select list instead of buttons (more space-efficient)
• Added 'Streets' map style
• Added ETA (shown in time left & arrival time)
• Avoiding Settings menu overflowing from page; added scroll if it gets too large
• Added 'Hide Radio' option
• Added 'Radio Position' option, with options 'Bottom Right' (default) and 'Top Right'
• Added link to documentation at the bottom of Settings menu
• Moved version number to bottom of Settings menu, beside link to Docs
• Improved 'Show target point continuously' by showing the marker immediately on enabling, instead of having to wait for the next target generation
• Implemented KML export fully
• Added 'Show Odometer', shows an on-screen odometer (not the odometer available in Settings) located at the radio/bottom right.
• Added 'Stuck Behaviour' option to choose what happens if the car gets 'stuck' when a specific Search Direction is enabled

v5

• Added 'Search Direction' option to travel in a specific direction

v4

• Added 'Queue Next Target' option to manually set next target
• Added ability to set custom starting location through Settings or 'customstart' URL parameter
• Added 'Hide Trail' option
• Added collapsibles in Settings menu
• Added ability to change map style with the following styles: 'Normal', 'Light' and 'Dark'
• Improved car indicator (puck) position to be properly aligned with the current end of the trail

v3

• Improved Settings button
• Added ability to disable automatic panning to (following) the car
• Added 'Show target point continuously' option
• Added ability to export to JSON, CSV and KML
• Improved button styling
• Added odometer using haversine distance calculation
• Fixed 'Search Radius' circle interfering with mobile touch actions
• Increased maximum Speed from 1 second (1000 ms) to 10 seconds (10000 ms)
• Increased maximum Search Radius from 0.05 to 1.50
• Added rotation of car icon (puck) to show bearing (where the car is facing, based on current -> next point)
• Added fallback value for Search Radius incase input field is empty

v2

• Added Settings button & menu
• Added 'Briefly show next target point' option
• Added 'Show search radius' option
• Added ability to adjust 'Random Point Radius' and 'Speed'
• Added Stop/Start button
• Introduced new car indicator, puck with field of view instead of a simple car emoji

v1

• Added base functionality (random routing)

Version Overview

2.3 Performance

While Driver is not that heavy, and has been tested to run good even on less powerful devices, the following factors or optional settings may impact performance on very weak devices:

• Speed: Faster car speeds may slightly cause performance issues on very low-end devices, as each step occurs more frequently
• Smooth Movement: Requires slightly more power as we calculate the next interpolated coordinate each animation frame. For this reason, this feature is optional and off by default. Most devices should not experience any noticeable performance issues however.
• Map Rotation: Requires slightly more power. May require extra GPU usage. A slight optimization is applied to only change the map bearing every 10 milliseconds instead of every animation frame, keeping the rotation smooth while cutting down on the required updates.
• Network Speed: The speed of your WiFi or mobile data may impact your experience. While it doesn't slow the entire page down, certain events may take longer depending on your internet speeds. Examples include: Fetching the next route when you have reached the target, switching radio stations or loading Street View panorama's.
• Themes: Certain map styles, such as 'Streets', may require slightly more power due to their higher level of detail or 3D effects at specific zoom levels. The impact should be insignificant, and most map styles run without any issues.

2.4 Live Connect

Introduced in v9, Live Connect makes it possible to run Driver from a server, and seeing the route live on https://kiyantk.nl/dev/fun/driver/live/

If you have a specific URL, you can pass it in a URL parameter like so: https://kiyantk.nl/dev/fun/driver/live/?url=ws://example.com/

Connecting to an existing server

When visiting /live, you will be prompted to enter a ws:// or wss:// URL. Driver uses Websockets to receive and send the neccesary data.

When using Live Connect through kiyantk.nl, your unsecure ws:// URLs are automatically proxied through our proxy.

When using Live Connect locally or elsewhere, ws:// URLs must be handled by you. wss:// connections always work through HTTPS or locally.

Hosting your own server

To host your own server, follow these instructions:

Step 1: Download the script

The backend for Driver's Live Connect is built in Python, and you can run this yourself.

Download live-connect-v2.py

Requirements

• Python 3.7+
• pip install websockets aiohttp

When you run the Python script, the server is now started locally on port 8765. It is already doing it's magic, but you still need to make it available from the internet.

Step 2: Expose your server to the world

We suggest you use ngrok, an easy way to expose your local server to the internet. When using ngrok, you can access your local WebSocket server securely via wss:// - no need for extra configuration.

First, run the following:

npm install -g ngrok

To use ngrok, you will need to create an account. Don't worry, their Free tier allows 1 agent. When you create an account, you will be presented with a setup guide. Here you will find your authtoken. Now, run this:

ngrok config add-authtoken [YOUR AUTHTOKEN]

You have succesfully setup ngrok! To use ngrok, run:

ngrok http 8765

Your Driver script is now exposed to the world! In the command prompt, you will find a URL along the lines of https://6e7b-217-103-48-230.ngrok-free.app/

Since ngrok provides a valid TLS/SSL certificate for your tunnel URLs, you can simply enter wss://6e7b-217-103-48-230.ngrok-free.app/ on the /live page.

Technical Documentation

Configuration Parameters

These global parameters can be configured:

Database

All steps are logged to a local database route.db in the table route_steps. The database is created when you open the script.

Websocket Messages

Sent to Clients

Received from Clients

These will be ignored if allowChanges is set to false.

Message Examples

initial

Sent from server to client on connection so the client can catch-up on the route.

{
  "type": "initial",
  "data": {
    "route": [[44.487395, -65.239234]],
    "config": {
      "speed": 1000,
      "radius": 1,
      "direction": "RAND",
      "allowChanges": true
    },
    "target": {
       "coords": [[44.4904, -65.2678],[44.4903, -65.2578],[44.4902, -65.2378]],
       "end": [44.4902, -65.2378]
    },
    "distance": 752.14
  }
}

add

Sent from server to clients during route stepping. Includes the new coordinate and car bearing.

{
  "type": "add",
  "data": {
    "coords": [44.4881, -65.2391],
    "bearing": 90.0,
    "distance": 122
  }
}

new-target

Sent from server to clients when a new target is set or generated.

{
  "type": "new-target",
  "data": {
       "coords": [[44.4904, -65.2678],[44.4903, -65.2578],[44.4902, -65.2378]],
       "end": [44.4902, -65.2378]
  }
}

set-config

Echoed back from server to confirm a config change.

{
  "type": "set-config",
  "data": {
    "field": "speed",
    "value": 800
  }
}

set-target

Sent from client to server to set a new target manually.

{
  "type": "set-target",
  "data": [44.4910, -65.2350]
}

set-route

Sent from client to server to define a full custom route (overwrites current one).

{
  "type": "set-route",
  "data": [
    [44.4874, -65.2392],
    [44.4875, -65.2390],
    [44.4876, -65.2388]
  ]
}

set-config

Client sends this to update configuration settings like speed, radius, or direction.

{
  "type": "set-config",
  "data": {
    "field": "radius",
    "value": 1.2
  }
}

clear-route

Client sends this to clear route history and database. Car restarts from start of current route.

{
  "type": "clear-route"
}

/live/ Frontend

Once you are connected to a server, the location blip and route will start updating.

The Settings menu is different from the regular Driver settings menu:

Live Connect

Server Info

• Connected To: Shows the WebSocket you are connected to
• Current Speed: Reflects the server's configured speed
• Current Search Radius: Reflects the server's configured search radius
• Current Search Direction: Reflects the server's configured search direction
• Changes Allowed: Reflects the server's setting on whether changes (messages) are allowed

Send Messages

• Set Target: Enter coordinate array to set the next target location (ex. [44.4910, -65.2350])
• Set Route: Enter coordinate arrays to set a specific route to follow (ex. [44.4874, -65.2392], [44.4875, -65.2390])
• Set Config: Change a config option by selecting one of three (speed, radius, direction) and entering its new value

Other Actions

• Clear Route: Clear the route



Local Settings

• Show target point: Shows the next target, but does not disappear
• Show route path: Shows the route to the next target with a blue line
• Show ETA to next target: Shows the ETA to reach the next target (in travel time, distance left & arrival time)
• Show search radius: Show the Search Radius with a blue circle
• Follow car: Pan the map to the car's location while moving
• Map Rotation: Rotate the map based on the car's heading
• Map Tilt: Set the map pitch to 60 degrees
• Zoom to car: Fix the camera close-up to the car
• Smooth Bearing: Eased rotation animations
• Hide Trail: Hide the red trail line from the map
• Show Local Time: Shows the current local time of the car, based on it's coordinates
• Show Odometer: Shows an odometer attached to the radio or standalone in the bottom right. Rounded to full kilometers and animated like a real odometer
• Line thickness: Set width of lines between 1 and 8
• Smooth Panning: Make the map pan smoothly on location updates



Radio Options

• Enable Radio: Enable the Radio box in the top-right
• Show Active Radio Station: Show the location of the currently playing radio station on the map (dark gray marker)
• Show Radio Range: Show the radio's 100km range with a dark gray circle
• Disable Radio Range: Disable radio's 100km range. If enabled, the radio station will never change automatically
• Hide Radio: If enabled, hides the radio on the screen. The radio still remains enabled and functional, just not visible
• Radio Position: Choose where the radio should be positioned. Options are 'Bottom Right' and 'Top Right'



Street View Options

• Show Street View: Show a Google Street View image from the car's current location and bearing
• Split View: 50/50 split between the map and Street View (offers bigger Street View)
• Full View + Minimap: Show the Street View on the full width and height of the page, with a small version of the map
• Minimap Size: Choose the size of the minimap, available in 'Full View + Minimap' mode. Options are 'Small' (250x170), 'Medium' (350x225) and 'Large' (450x300)
• Allow Street View interaction: By default, the Street View embeds block all pointer events. If enabled, this block is lifted and you can interact with the Street View



Export Options

• Export: Export the full trip data (coordinates) to JSON, CSV or KML



Theme Options

• Map Style: Set the map style
• Line Style: Customize the route lines
• Trail Style: Customize the trail style further
• Car Icon: Customize the car's icon
• ETA Display: Customize the ETA display



Other Options

• Odometer: A simple odometer with 2 decimal places. Is different from the regular odometer enabled using 'Show Odometer'
• Fullscreen: Toggle fullscreen


• Disconnect: Disconnect from the server

Notes

Routes are retrieved from the OpenStreetMap public API (https://routing.openstreetmap.de).

Server is fully asynchronous using asyncio.

Uses GeoJSON route decoding and sends real-time step updates via WebSocket.

When the script is re-opened, it will load the route from the database if it exists, so you don't start over. If you want to start over, simply delete the database before running the script.

2.5 Attribution

This project is made possible thanks to:

• Leaflet (v1-v10) and MapLibre (v11+): The map
• Project OSRM: Routing (specifically routing.openstreetmap.de)
• Google (v6+): Street View imagery
• RadioBrowser (v6+): Radio stations
• OpenStreetMap (v12+): Address lookup via Nominatim Reverse
• Carto (v4-v10): Map styles 'Light' and 'Dark'
• Maptiler (v6+) and OpenMapTiles (v11+): Map style 'Streets'

Inspired by: Driver draws inspiration from Neal Agarwal’s Internet Roadtrip, a fun community-driven experience that sparked the idea of a more personal, offline journey.

3.1 Features

3.2 Changelog

v1

• Added base functionality

Version Overview

4.1 Features

4.2 Changelog

v1

• Added base functionality

Version Overview

5.1 Features

5.2 Changelog

v2

• Switched to new firework engine, resulting in better looking fireworks
• UI overhaul

v1.2

• New settings for fireworks: 'Pulse', 'Color Shift', 'Twirl', 'Particle Trail', 'Launch Trail', 'No Fade', 'Varied particle sizes', 'Effect', 'Burst Type' and 'Particle Size'
• Improved mobile UI
• Increased standard fireworks from 30 to 50
• Adjust burst size relative to screen size
• Expanded Import/Export JSON to use entire item object instead of only a few fields

v1.1

• Added 'Display Settings' in the Settings menu to adjust saturation, blur, brightness and contrast
• Added more standard fireworks (from 5 to 30)
• Fixed particles leaving behind a permanent mark on the sky
• New 'Sparkle' setting for fireworks
• Fixed 'Burst Radius' to actually affect size of the explosion rather than just blurring particles
• Added max height to Edit Firework box to avoid the box becoming too small
• Improved the handling of invalid firework imports. Now shows an error message instead of just creating a blank firework
• Removed pointer events on splash screen
• Scroll fireworks list to bottom when a new firework is created since it appears at the bottom initially
• Hide stats overlay by default and added option to enable it in settings
• Added a firework count in the Manage tab
• Improved mobile experience in Manage tab

v1

• Added base functionality

Version Overview

6.1 Features

6.2 Changelog

v1

• Added base functionality

Version Overview

7.1 Logos & Banners

Driver

v1-v11

v12+

v1-v11

v12+