Skip to content

ym.modules.provider.DivIcon

Overview

Represents a lightweight marker symbol that uses a simple div element instead of an image.

var myIcon = ym.divIcon({ className: 'my-div-icon' });
// You can add CSS rules to .my-div-icon.

ym.marker([50.505, 30.57], { icon: myIcon }).addTo(map);

By default, there is a class called leaflet-div-icon, which is designed as a small white square with a shadow.

Initialization

Factory: ym.divIcon(options)

  • Parameter: options

  • iconSize

    • Description: Size of the icon in pixels. Can also be set via CSS.
    • Data type: Point

  • iconAnchor

    • Description: The coordinates of the top of the symbol (relative to its upper left corner). The symbol is aligned so that this point is located at the geographical position of the marker. By default, it is centered if its size is specified, but it can also be set in CSS with negative borders.
    • Data type: Point

  • popupAnchor

    • Description: The coordinates of the point from which popups are opened, relative to the icon anchor.
    • Data type: Point

  • className

    • Description: A user-defined class name to be assigned to the symbol. By default leaflet-div-icon.
    • Data type: string

  • html

    • Description: A custom HTML code to insert into the div element, empty by default.
    • Data type: string