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 177
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

Methods

addOption(id, name, callback, position)

ContextMenu.js, line 268

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.

addSubMenu(id, name, optionList)

ContextMenu.js, line 288

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 308

Close the menu.

closeSubmenu(id)

ContextMenu.js, line 387

Close Submenu

Name Type Description
id string

Id.

existOption(id){boolean}

ContextMenu.js, line 319

Returns true if the option exists.

Name Type Description
id string

Option's identifier.
Returns:
True if exists.

hideOption(id)

ContextMenu.js, line 369

Hide menu option.

Name Type Description
id string

Id.

isVisible(){boolean}

ContextMenu.js, line 255

Returns true if the context menu is visible.

Returns:
Returns true if is visible.

open(lonLat)

ContextMenu.js, line 328

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 378

Open Submenu

Name Type Description
id string

Id.

removeAllOptions()

ContextMenu.js, line 342

Remove all options in context menu.

removeOption(id)

ContextMenu.js, line 351

Remove an option from the context menu.

Name Type Description
id string

Option's identifier.

showOption(id)

ContextMenu.js, line 360

Show menu option.

Name Type Description
id string

Id.