Document Maps JavaScript API Reference Manual Right-click menu ContextMenu

ContextMenu

AMap.ContextMenu

Construct a right-click menu object, set the properties of the right-click menu object through OverlayOptions

new AMap.ContextMenu(opts: OverlayOptions)

Parameter

opts(OverlayOptions): Right-click menu parameters

Attribute

Type

Description

content

string | HTMLElement

Right-click menu content (for custom menus, add menu content and functionality. It can be a custom DOM node or an HTML fragment of a DOM node.)

isCustom

boolean

Whether to customize the right-click menu. When set to true, the frame and content of the right-click menu are added exactly as set by the content

Demo

// Create a right-click menu instance
var contextMenu = new AMap.ContextMenu();
// Zoom in with right-click
contextMenu.addItem(
  "Zoom in one level",
  function () {
    var zoom = map.getZoom();
    map.setZoom(++zoom);
  },
  0
);
// Open the right-click menu at a specified location on the map
contextMenu.open(map, [116.397389, 39.909466]);

Method

open(map, position)

Open the right-click menu

Parameter:

map (Map) Map objects to be displayed in the right-click menu

position (Vector2Base position of the right-click menu body display

Demo:

contextMenu.open(map, [116.397389, 39.909466]);

close()

Close the right-click menu

Demo:

contextMenu.close();

addItem(text, fn, num)

Add an item to the menu

Parameter: 

text (string)  Text displayed by the menu item

fn (EventListener)  Define the callback for menu functions

num (numberPosition of the menu item in the menu

Demo:

var increaseMapZoom = () => {
  var zoom = map.getZoom();
  map.setZoom(++zoom);
};
contextMenu.addItem("Zoom in one level", increaseMapZoom, 0);

removeItem(text, fn)

Remove an item from the menu. Note: When using this method, specify the second parameter (callback function) of the add menu method by using the function name, rather than directly calling the function or passing the result of the function call.

Parameter:

text (string)  Text of the menu item to be removed

fn (EventListenerCallback function name of the menu item to be removed

Demo:

contextMenu.removeItem("Zoom in one level", increaseMapZoom);

Event

Event Name

Description

open

Right-click menu open event

close

Right-click menu close event