首次体验 MCP 的使用:借助 Cursor 和高德 MCP 实现路线查询

本文分享了我首次体验高德MCP(Map Control Platform)服务的过程,结合Cursor平台,实现了流畅的地图路线查询功能。

一、申请高德账号并创建应用,获取Key

首先,需要在高德开放平台官网申请账号,完成实名认证后进入控制台创建新的应用,并申请相应的API Key。具体步骤参考高德官方文档:高德开放平台 - 创建应用并申请Key

二、将高德MCP配置到Cursor平台

Cursor平台支持以Streamable HTTP方式接入高德MCP服务。按照官方指南,将申请到的Key配置到Cursor中,完成服务对接。详细步骤参考:高德开放平台 - MCP接入指南

  • 1.1 进入 Cursor 设置界面配置 Streamable HTTP 连接

  • 1.2 添加一个新的 MCP Server 配置

获取key

{
  "mcpServers": {
    "amap-maps-streamableHTTP": {
      "url": "https://mcp.amap.com/mcp?key=您在高德官网上申请的key"
    }
  }
}
  • 1.3 返回 Cursor 设置界面查看 MCP 服务工具状态

  • 1.4 选择配置 Cursor 大模型让你拥有更好的服务体验,建议选择 claude-4-sonnet

  • 1.5 模型交互模式 :选择 Agent 方式

  • MCP配置完成后,可在Cursor后台确认MCP服务状态,确保服务已正常启动。

三、体验MCP功能,查询完整路线

配置成功后,我尝试向Cursor输入路线查询相关问题,系统自动调用高德MCP进行处理。

从执行日志中可以看到,MCP服务被成功调用:

最终,系统返回了完整且精准的路线规划结果:

总结

通过本次体验,感受到高德MCP强大的地图数据能力和Cursor平台的便捷集成,二者结合极大提升了地图服务的灵活性和响应速度。期待后续更多功能的探索与应用。

### 配置高德地图中的 MCP 文件以更改鼠标 Cursor 样式 在高德地图中实现鼠标悬停时的样式效果,可以通过自定义 CSS JavaScript 来完成。尽管 `MCP` 是一种用于模型上下文协议的技术[^1],但在前端开发场景下,通常不直接涉及此类技术来调整鼠标的外观行为。 以下是具体方法: #### 方法概述 为了修改高德地图上的鼠标指针样式,可以利用 AMap API 提供的功能以及 HTML/CSS 的能力。通过监听事件并动态改变样式的手段,能够达到所需的效果。 --- #### 实现代码示例 以下是一个完整的代码片段,展示如何在高德地图上配置鼠标悬浮时的样式变化: ```javascript // 初始化地图实例 var map = new AMap.Map('container', { zoom: 10, // 设置地图缩放级别 center: [116.397428, 39.90923], // 设置中心点坐标 }); // 定义鼠标移入移出时的不同样式 function setCursorStyle(cursorType) { document.getElementById('container').style.cursor = cursorType; } // 添加覆盖物(例如标记) var marker = new AMap.Marker({ position: [116.397428, 39.90923], map: map, title: '测试标记' }); // 绑定鼠标事件到标记上 marker.on('mouseover', function () { setCursorStyle('pointer'); // 当鼠标移到标记上方时,显示手型光标 }); marker.on('mouseout', function () { setCursorStyle('default'); // 当鼠标离开标记区域时,恢复默认光标 }); ``` 上述代码实现了当用户将鼠标移动至指定的地图标记上时,自动切换为指向手势 (`pointer`);而当鼠标移开后,则返回默认状态(`default`)。 如果需要更复杂的交互逻辑或者加载外部资源作为自定义图标,还可以进一步扩展此功能。比如引入图片文件充当特殊形状的游标等操作。 --- #### 关键知识点解析 - **AMap.Event 类型支持多种内置事件**:包括但不限于 mouseover、click、dblclick 等常用动作捕捉机制[^2]。 - **CSS 属性控制视觉表现形式**:借助标准属性如 `-webkit-cursor`, 可轻松定制各类非传统图形化指示器[^3]. 注意,在某些情况下可能还需要考虑浏览器兼容性性能优化等问题. ---
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

JEECG低代码平台

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值