Zoom, orientation, fullscreen, and optional location controls.
import { MapControls } from '@vrum/ui';
import { MapView } from '@vrum/ui';
<MapView center={[2.3522, 48.8566]} zoom={4} styleUrl="https://demotiles.maplibre.org/style.json" showControls={false}>
<MapControls
position={"bottom-right"}
showZoom={true}
showCompass={true}
showFullscreen={true}
showLocate={false}
locateMinZoom={14}
/>
</MapView>Copy code| Prop | Type | Default | Description |
|---|---|---|---|
position | MapPosition | "bottom-right" | position configuration. |
showZoom | boolean | true | show zoom configuration. |
showCompass | boolean | true | show compass configuration. |
showFullscreen | boolean | true | show fullscreen configuration. |
showLocate | boolean | false | show locate configuration. |
locateMinZoom | number | 14 | locate min zoom configuration. |
geolocationOptions | PositionOptions | none | geolocation options configuration. |
onLocateError | ((error: GeolocationPositionError | Error) => void) | none | on locate error configuration. |
extraTools | React.ReactNode | none | extra tools configuration. |