Skip to main content

ZoomControl

Add + and - zoom buttons.

Example

Pigeon | © OpenStreetMap contributors

Code

import React from "react";
import { Map, ZoomControl } from "pigeon-maps";

export function MyMap() {
return (
<Map height={300} defaultCenter={[50.879, 4.6997]} defaultZoom={11}>
<ZoomControl />
</Map>
);
}

Options

style

Add extra style attributes to the container div. For example: { right: 10, top: 10, zIndex: 100 } to change its position.

buttonStyle

Override the style of the buttons themselves. For example: { background: 'black', color: 'white' } to invert its colors.