Class: ContextMenu

cercaliagl.ContextMenu


Javascript ES5

const contextMenu = new cercaliagl.ContextMenu.({ ... });

Class for creating a context menu. This control permits:

  • - Draw a menu in a LonLat position
  • - Add / Remove options in menu.
  • - Enable / Disable options of the menu.
  • - Show / Hide options of the menu.


Example creating a custom contexte menu (without default options):

const map = new cercaliagl.Map({
  controls: [],
  rightClickMenuOptions: [],
});
const contextMenu = new cercaliagl.ContextMenu({ map });
contextMenu.addOption('drawMarker', 'Create marker here', (position) => {
  const marker = new cercaliagl.Marker({
    position,
    simpleLabel: new cercaliagl.SimpleLabel({ text: position.toString() }),
  });
  map.addMarker(marker);
});

new ContextMenu(options)

ContextMenu.js, line 178
Name Type Description
options

Options.

Name Type Description
id string | undefined

Id option
map module:cercaliagl/Map~Map | undefined

Map
fixedPosition module:cercaliagl/LonLat~LonLat | undefined

Fixed position in map
className string

Context menu class name

Methods

addOption(id, name, callback, position, className)

ContextMenu.js, line 276

Add a new option in the context menu at the end or in a specific position. Returns options identifier. If the id options exist removes previous option.

Name Type Description
id string

Option's identifier.
name string

Text will be displayed in option.
callback function

Function will be fired when users click the option.
position number

The position where option will be added.
className string

Classname for option.

addSubMenu(id, name, optionList)

ContextMenu.js, line 297

Add submenu. A submenu contains one or more options

Name Type Description
id string

Specify internal Id element
name string

Label of submenu.
optionList Array.<module:cercaliagl/ContextMenu~ContextMenuSubmenuOption>

Option list. Example: {[{id:'btn1', label:'Button1', callback: 'callbackFn1'}, {id:'btn2', label:'Button2', callback: 'callbackFn1'}]}.

close()

ContextMenu.js, line 317

Close the menu.

closeSubmenu(id)

ContextMenu.js, line 396

Close Submenu

Name Type Description
id string

Id.

existOption(id){boolean}

ContextMenu.js, line 328

Returns true if the option exists.

Name Type Description
id string

Option's identifier.
Returns:
True if exists.

hideOption(id)

ContextMenu.js, line 378

Hide menu option.

Name Type Description
id string

Id.

isVisible(){boolean}

ContextMenu.js, line 262

Returns true if the context menu is visible.

Returns:
Returns true if is visible.

open(lonLat)

ContextMenu.js, line 337

Open the menu. If menu isn't position fixed needs a position to be displayed.

Name Type Description
lonLat module:maplibre-gl~LngLat | module:cercaliagl/LonLat~LonLat

If menu isn't position fixed, menu will be displayed in ths position.

openSubmenu(id)

ContextMenu.js, line 387

Open Submenu

Name Type Description
id string

Id.

removeAllOptions()

ContextMenu.js, line 351

Remove all options in context menu.

removeOption(id)

ContextMenu.js, line 360

Remove an option from the context menu.

Name Type Description
id string

Option's identifier.

showOption(id)

ContextMenu.js, line 369

Show menu option.

Name Type Description
id string

Id.