Nocturnal Practitioners of Magic

    ol-marker-feature
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.2 • Public • Published

    OpenLayers Marker Feature

    This plugin provides an easy way to add markers to an OpenLayers map and associate them with popups, e.g. using ol-popup.

    A Marker is basically an ol/Feature. When it is added to a map, the plugin will create an unmanaged layer for the map's markers. It will also set up pointermove and click listeners to change the cursor when the user hovers over a marker, and to dispatch a click event on the Marker feature when it is clicked.

    Usage

    npm install ol-marker-feature
    

    Once you have installed the plugin, you can import and use it:

    import Marker from 'ol-marker-feature';
    import Popup from 'ol-popup';
    
    const marker = new Marker([16.351, 48.277]);
    marker.set('info', 'I am a marker.')
    marker.setMap(map);
    
    const popup = new Popup({offset: [0, -32]});
    map.addOverlay(popup);
    
    marker.on('click', function() {
      popup.show(marker.getLocation(), marker.get('info'));
    });

    Compatibility

    ol-marker-feature works with ol 6.x.

    API

    Table of Contents

    constructor

    import Marker from 'ol-marker-feature';

    Extends

    Fires

    • click when the marker is clicked.

    Parameters

    • coordOrGeomOrOptions (ol_coordinate_Coordinate | ol_geom_Geometry | objectWithGeometry) Coordinates of a point marker, a geometry, or an object with a geometry property. When only coordinates are provided (e.g. new Marker([16, 48])), a marker with the default style is created.

    getLocation

    Get the location of the marker feature. For points, this will be the point itself. For other geometry types, it will be a point on the geometry. Use this method e.g. for displaying a popup at the marker feature's location.

    Returns ol_coordinate_Coordinate Location of the marker in view coordinates.

    setMap

    Adds the marker to the specified map.

    Parameters

    • map (ol_Map | null) Map to add the marker to. Call with null to remove the marker from any map.

    dispose

    Clean up when this marker is no longer needed.

    style

    import style from 'ol-marker-feature/style';

    Default style for markers. A blue placemark icon with a shadow, 41x41 pixels, with the anchor at the tip of the marker ([12.5, 41] in pixel coordinates). When used with ol-popup, the recommended offset for the popup is [0, -32]. For use in custom styles, the icon is included in this package and can be imported from ol-markup-feature/assets/marker.png.

    Type: ol_style_Style

    Developing

    To develop locally, the examples are useful. A development server is available with

    npm run examples
    

    When it is running, you can access the examples that are available in the examples/ folder, by browsing e.g. to https://localhost:3000/marker.html.

    Install

    npm i ol-marker-feature

    DownloadsWeekly Downloads

    17

    Version

    2.0.2

    License

    BSD-2-Clause

    Unpacked Size

    32 kB

    Total Files

    17

    Last publish

    Collaborators

    • ahocevar