Marker Fields

This section describes the fields that can be used in code to manipulate the Marker object.

type

Contains the type of the element.

Type: String

This field can be used to recognize whether an element is an area or a marker since it equals either the 'area' or 'marker'.

Show Example:
jQuery

In this example, tooltips are enabled only for markers. The type field of a map element is used to distinguish markers from areas. Hover over any marker to see its tooltip.

<div id="mapContainer" style="height:500px; max-width:800px; margin: 0 auto"></div>
var markers = [{
    coordinates: [-121.2808, 38.3320],
    attributes: { name: 'Sacramento' }
}, {
    coordinates: [-97.75, 30.25],
    attributes: { name: 'Austin' }
}, {
    coordinates: [-73.7572, 42.6525],
    attributes: { name: 'Albany' }
}, {
    coordinates: [-84.2533, 30.455],
    attributes: { name: 'Tallahassee' }
}, {
    coordinates: [-89.65, 39.783],
    attributes: { name: 'Springfield' }
}, {
    coordinates: [-76.8756, 40.2697],
    attributes: { name: 'Harrisburg' }
}, {
    coordinates: [-82.9833, 39.9833],
    attributes: { name: 'Columbus' }
}, {
    coordinates: [-84.39, 33.755],
    attributes: { name: 'Atlanta' }
}, {
    coordinates: [-84.5467, 42.7336],
    attributes: { name: 'Lansing' }
}, {
    coordinates: [-78.6447, 35.8189],
    attributes: { name: 'Raleigh' }
}];

$(function () {
    $('#mapContainer').dxVectorMap({
        mapData: '/Content/data/vectorMap-sources/usa.txt',
        markers: markers,
        bounds: [-135, 60, -65, 20],
        zoomFactor: 1.25,
        areaSettings: { hoverEnabled: false },
        tooltip: {
            enabled: true,
            customizeTooltip: function (element) {
                if (element.type == 'marker') {
                    return {
                        text: element.attribute('name')
                    };
                }
            }
        }
    });
});