AI 地图
产品服务
解决方案
文档与支持
定价
更新时间: 2026/07/20 14:48

地图支持右键菜单,您可以在地图上添加自定义内容的右键菜单。

添加右键菜单

通过map.addContextMenu(menu)方法来向地图添加自定义右键菜单。

1. 创建基本地图
var map = new BMap.Map("container"); // 创建地图实例
var point = new BMap.Point(116.404, 39.915); // 设置中心点坐标
map.centerAndZoom(point, 12); // 设置地图级别
2. 定义菜单项

通过创建BMap.MenuItem实例来定义菜单项。

var menu = new BMap.ContextMenu();
var txtMenuItem = [
{
text:'放大', // 定义菜单项的显示文本
callback: function () { // 定义菜单项点击触发的回调函数
map.zoomIn();
}
},
{
text:'缩小',
callback: function () {
map.zoomOut();
}
}
];
for(var i = 0; i < txtMenuItem.length; i++){
menu.addItem(new BMap.MenuItem( // 定义菜单项实例
txtMenuItem[i].text, // 传入菜单项的显示文本
txtMenuItem[i].callback, // 传入菜单项的回调函数
{
width: 300, // 指定菜单项的宽度
id: 'menu' + i // 指定菜单项dom的id
}
));
}
3. 给地图添加右键菜单

使用 map.addContextMenu(menu) 方法给地图添加右键菜单。

map.addContextMenu(menu); // 给地图添加右键菜单
类参考

BMap.ContextMenu
BMap.MenuItem

上一篇

地图UI控件

下一篇

地图样式风格
本篇文章对您是否有帮助?