@trackunit/react-map-adapter-mapbox

Mapbox GL JS adapter for @trackunit/react-map: implements the shared adapter contract from @trackunit/react-map-adapter-shared using Mapbox GL.

Installation

npm install @trackunit/react-map @trackunit/react-map-adapter-mapbox

Public API

| Export | Role | | --- | --- | | mapboxAdapter | Factory that returns adapter config for useMap (from @trackunit/react-map) | | MapboxConfig | Configuration type (access token, theme, language, etc.) | | MapboxAdapterInstance | Low-level instance factory (advanced use) | | MapboxRenderer | Internal renderer used by the adapter (advanced or testing) |

Typical usage

Pass the adapter into useMap from @trackunit/react-map. See the JSDoc on mapboxAdapter in source for a minimal example with accessToken, theme, and language.

Important for styles: Import Mapbox GL CSS once in your app entry (for example main.tsx):

import "mapbox-gl/dist/mapbox-gl.css";

Cross-provider parity

Where Mapbox GL lacks a capability the Google Maps adapter gets natively, this adapter emulates it so consumers see identical behaviour regardless of provider. The clearest case is geodesic arcs: Google draws great-circle edges natively, while Mapbox renders Mercator straight lines, so this adapter densifies edges with densifyGeodesicFeatures from @trackunit/react-map-adapter-shared to match. Provider gaps are closed inside the adapter — never pushed up to application code.

Dependencies

Depends on @trackunit/react-map-adapter-shared and Mapbox GL–related dependencies used by the renderer. It does not import @trackunit/react-map (adapters are consumed by the map package, not the reverse).

Part of the @trackunit/react-map family

| Package | Description | | --- | --- | | @trackunit/react-map | Core provider-agnostic map library | | @trackunit/react-map-adapter-google | Google Maps adapter | | @trackunit/react-map-adapter-mapbox | Mapbox GL adapter (this package) | | @trackunit/react-map-adapter-shared | Shared adapter contracts and utilities | | @trackunit/react-map-color-utils | CSS color utilities for the map stack |

For more info and a full guide on Iris App SDK Development, please visit our Developer Hub.

Trackunit

This package was developed by Trackunit ApS. Trackunit is the leading SaaS-based IoT solution for the construction industry, offering an ecosystem of hardware, fleet management software & telematics.