121.在 Vue3 中使用 OpenLayers 实现去掉鼠标右键默认菜单并显示 Feature 信息

🎯 实现效果

👇 本文最终实现的效果如下：

• ✅ 地图初始化时绘制一个多边形；

• ✅ 鼠标 右键点击地图任意位置；

• ✅ 若命中 Feature，则弹出该图形的详细信息；

• ✅ 移除浏览器默认的右键菜单，保留地图交互的完整控制。

💡 整个功能基于 Vue3 + OpenLayers 完成，采用 Composition API 编写，代码清晰易维护。

✨ 前言

在开发 Web GIS 项目时，我们常常希望用户右键地图时执行自定义操作，而不是触发浏览器默认的右键菜单。本篇文章将手把手教你如何用 Vue3 + OpenLayers：

• 禁用默认右键菜单；

• 获取右键点击位置；

• 判断是否点击到了地图上的某个图形（Feature）࿱