LControlZoom
A basic zoom control with two buttons (zoom in and zoom out).
Demo
vue
<LMap style="height: 350px" :zoom="8" :center="[47.21322, -1.559482]">
<LTileLayer
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
attribution="&copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors"
layer-type="base"
name="OpenStreetMap"
/>
<LControlZoom position="bottomright" />
</LMap>
Props
Prop name | Description | Type | Required | Default |
---|---|---|---|---|
zoomInText | The text set on the 'zoom in' button | String | - | '+' |
zoomInTitle | The title set on the 'zoom in' button | String | - | 'Zoom in' |
zoomOutText | The text set on the 'zoom out' button | String | - | '-' |
zoomOutTitle | The title set on the 'zoom out' button | String | - | 'Zoom out' |
Inherited props
from control.ts
Prop name | Description | Type | Required | Default |
---|---|---|---|---|
position | The position of the control (one of the map corners). Possible values are topleft , topright , bottomleft or bottomright . | String as L.ControlPosition | - | 'topright' |
from component.ts
Prop name | Description | Type | Required | Default |
---|---|---|---|---|
options | Leaflet options to pass to the component constructor | Object | - | {} |
Events
Event name | Type | Description |
---|---|---|
ready | object | Triggers when the component is ready |