Markers

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

const {MMap, MMapDefaultSchemeLayer, MMapDefaultFeaturesLayer, MMapMarker} = mappable;

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

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

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

// 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 MMapMarker(
  {
    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 MMapMarker.

Previous