Standard visual elements

Location

Determines the user's location by calling the browser's standard geolocation function and/or identifying the user's IP address.

Class: YMapGeolocationControl.

Example

Add the location button:

const map = new YMap(element, {
  location: {center: [25.229762, 55.289311], zoom: 14}
});

const controls = new YMapControls();
controls.addChild(new YMapGeolocationControl());

map.addChild(controls);

Zoom buttons

Change the map's zoom coefficient.

Class: YMapZoomControl.

The following parameters are used to set up the map zoom:

  • easing. Possible values: linear, ease, ease-in, ease-out, ease-in-out.
  • zoomRange. If the current zoom level is different from this setting, the zoom buttons are locked.

Example 1

Using the easing parameter:

const map = new YMap(element, {
  location: {center: [25.229762, 55.289311], zoom: 14}
});

const controls = new YMapControls();
controls.addChild(
  new YMapZoomControl({
    easing: 'linear'
  })
);

map.addChild(controls);

Example 2

Using the easing and zoomRange parameters:

const map = new YMap(element, {
  zoomRange: {min: 1, max: 5},
  location: {center: [25.229762, 55.289311], zoom: 4}
});

const controls = new YMapControls();
controls.addChild(
  new YMapZoomControl({
    easing: 'linear'
  })
);

map.addChild(controls);

Button

Used to add a standard button and set up custom behavior for it.

Class: YMapButtonControl.

Example

const button = new YMapControlButton({
  text: 'Hello',
  onClick: () => alert('Hello world!')
});