Api

<ScriptMapLibreScaleControl>

Adds MapLibre's scale bar to the nearest parent map. MapLibre places it in the bottom-left corner by default.

<template>
  <ScriptMapLibreMap map-style="https://tiles.openfreemap.org/styles/liberty" :center="[147.33, -42.88]">
    <ScriptMapLibreScaleControl position="bottom-left" :options="{ unit: 'metric', maxWidth: 120 }" />
  </ScriptMapLibreMap>
</template>

new maplibregl.ScaleControl() reads options and position once, when it creates the control. options.unit also updates reactively through setUnit(). To apply any other change, change the component key.

positionMapLibre.ControlPosition

optionsMapLibre.ScaleControlOptions

Options passed to `new maplibregl.ScaleControl()`. `unit` also updates reactively through `setUnit()`.

Edit this page

Markdown For LLMs

useScriptMapLibre

Use useScriptMapLibre() when you need direct access to the MapLibre namespace or are building your own map component.

Adds MapLibre's geolocate button to the nearest parent map. The button asks the browser for the user's location and moves the camera there.