Markers

A marker is a DOM element with a link to coordinates. You can drag markers and configure their appearance using HTML layout.

const {YMap, YMapDefaultSchemeLayer, YMapDefaultFeaturesLayer, YMapMarker} = ymaps3;

// Initialize the map
const map = new YMap({...});

// Add a layer with roads and buildings
map.addChild(new YMapDefaultSchemeLayer());

// Add a layer for markers
map.addChild(new YMapDefaultFeaturesLayer());

// Create a DOM element for the marker content.
// You need to do this before initializing the marker!
// The element can be created empty. You can add HTML layout inside after initializing the marker.
const content = document.createElement('section');

// Initialize the marker
const marker = new YMapMarker(
  {
    coordinates: [25.229762, 55.289311],
    draggable: true
  },
  content
);

// Add the marker to the map
map.addChild(marker);

// Add arbitrary HTML layout inside the marker content
content.innerHTML = '<h1>You can drag this header</h1>';

The base class implementing a marker is YMapMarker.

Previous