Skip to main content
Api

<ScriptMapLibreFullscreenControl>

Adds MapLibre's fullscreen button to the nearest parent map. The map container goes fullscreen by default. Pass options.container to make a different element fullscreen.

<template>
  <ScriptMapLibreMap map-style="https://tiles.openfreemap.org/styles/liberty" :center="[147.33, -42.88]">
    <ScriptMapLibreFullscreenControl
      position="top-right"
      @fullscreenstart="console.log('fullscreen')"
      @fullscreenend="console.log('windowed')"
    />
  </ScriptMapLibreMap>
</template>

new maplibregl.FullscreenControl() reads options and position once, when it creates the control. To apply a change, change the component key.

If the browser has no Fullscreen API, or options.pseudo is true, MapLibre expands the map with CSS instead.

positionMapLibre.ControlPosition
optionsMapLibre.FullscreenControlOptions
Was this page helpful?