useMapboxBeforeLoad
A composable that executes a callback function when the Mapbox map is available.
Added since: v0.1.0
Last changed:
Usage
useMapboxBeforeLoad() is a composable that helps you interact with the Mapbox map in a smart way. It takes care of executing your code at just the right time - whether the map is already loaded or still in the process of loading. This makes it perfect for setting up your map configurations and event listeners without worrying about timing issues.
The composable is particularly useful when you need to interact with the map from child components or when you want to ensure map operations only happen after the map is fully loaded.
Basic example
MapChildComponent.vue
<script setup lang="ts">
const { map } = injectMapboxMapContext();
const events = ref(["resize", "remove", "load", "render", "idle", "error"])
useMapboxBeforeLoad((map) => {
events.value.forEach((eventName) => {
map?.on(eventName, (e) => {
emit(eventName, e);
})
})
});
</script>
Type Definition
declare function useMapboxBeforeLoad(callback: (map: Map) => void): void
API Reference
Params
callback
(map: Map) => void required
The callback function to execute when the map is available.
Return Value
void
Executes the callback function when the map is available.