- 博客(11)
- 收藏
- 关注
原创 [项目实训博客-TravelMind途灵] 11 支持多种出行方式以及支持更多行程点选项
解决高德API在多点规划时可能“跳过”部分途径点的问题。采用分段请求,每两个点单独请求,最终拼接最长连续可达路径,确保尽可能多的点被连通。高德API多点规划时,若点顺序不合理或某些点距离过远,API可能自动忽略部分点,导致路径断开或“漏点”。让用户可以在“智能路径规划”区域选择“驾车”或“步行”模式,前端将选择结果作为参数传递给后端。采用分段请求+最长连续可达段,确保即使部分点不可达,也能展示最多的连通路径。原始的等待交互较为简单,这里优化了等待景点加载时的界面。
2025-06-15 21:37:27
230
原创 [项目实训博客-TravelMind途灵] 10 推荐栏界面以及交互优化
2.给推荐栏提供隐藏和展开功能,避免推荐栏遮挡地图。3.优化交互效果,如添加鼠标悬停以及展开隐藏动画等。1.原本推荐栏的界面过于简单,优化其原有界面。优化推荐卡片的交互效果,添加鼠标悬停的效果。将推荐栏选项移到上方并添加悬停等优化效果。添加对应Add功能对应的添加和已添加按钮。添加推荐栏的隐藏和展开功能并添加过程动画。路线的显示和标记点标记。添加智能规划路径的界面。
2025-06-15 13:52:05
136
原创 [项目实训博客-TravelMind途灵] 9 智能路径规划功能
智能路径规划功能允许用户从推荐卡片中选择多个景点/酒店/美食,自动规划线路生成多点路线,并在地图上高亮显示所有途经点和完整路径,用户可随时增删目的地。
2025-06-15 01:02:35
370
原创 [项目实训博客-TravelMind途灵] 8 多类别智能推荐与优化详情侧栏
在本次阶段中,实现了多类别推荐(景点/住宿/美食)、推荐栏横向滑轮滚动、美观的详情侧栏等功能。本文将详细介绍这些功能的设计目的、核心代码、遇到的问题与解决方案。
2025-06-10 23:33:05
441
原创 [项目实训博客-TravelMind途灵] 7 景点智能定位与详情侧栏功能实现
点击“定位到此景点”时,前端优先用景点的详细地址请求获取经纬度。获取到经纬度后,地图自动跳转并添加自定义Marker。Marker采用自定义DOM元素。
2025-06-06 17:09:44
322
原创 [项目实训博客-TravelMind途灵] 6 优化路线绘制功能以及实现根据目的地进行景点推荐
创建一个文本标记,通过起点和终点的经纬度平均值来计算并显示格式化后的路线距离,并将其定位在起点和终点的中间位置。根据用户的输入,创建一个 Marker 实例,并设置标记悬停为起点以及终点,以标记用户的起始点和目的地。再通过调用后端接口实现景点加载,控制加载状态显示,如果无数据则会显示暂无推荐。再获取景点信息的基础上再提取出图片和评分等POI信息,以便于向用户进行推荐。接受用户输入并进行处理从中提取出起始点和目的地。创建一个函数实现获取地点附近的景点信息。在以上的基础上,优化路线的前端显示。
2025-05-23 23:29:02
197
原创 [项目实训博客-TravelMind途灵] 5 获取天气信息并封装为函数及解析用户输入绘制路线
因为用户的输入是自然语言,所以从中获取起点和终点需要首先对其进行处理,先通过deepseek将用户的自然语言处理成为格式化的语言,之后再通过正则表达式提取,从中提取出起点、终点等信息。在之前的工作中已经测试了通过彩云天气来获取天气信息,但是由于彩云天气只能获取未来三天内的天气信息,天气信息受限,所以通过结合和风天气来根据经纬度获取未来七天天气及其他天气信息。再通过高德地图提供的api将起点终点处理为经纬度的形式,之后根据经纬度在地图上标记出起点和终点,再生成线路。
2025-05-06 21:38:11
360
原创 [项目实训博客-TravelMind途灵] 4 地图界面的优化以及将通过api获取车票信息封装成函数以便于agent调用
本阶段进行的工作包括对地图界面的优化以及将通过api获取天气和车票封装成函数以便于agent调用获取信息。
2025-04-30 22:40:43
129
原创 [项目实训博客-TravelMind途灵] 3将地图接入项目聊天界面中并添加地图定位,3d地图转换,3d控制罗盘等功能
不能通过直接视角切换来更改2D/3D模式,最终通过每次切换视角重新初始化地图来解决该问题。主要通过高德地图的 JavaScript API 实现地理定位的功能。在chat_layout中在右侧添加区域,并导入mapview组件。在地图左上方生成一个按钮,并通过按钮来控制地图的视角切换。可以通过这两个组件来控制地图的比例尺和视角方向。
2025-04-18 11:35:51
377
原创 [项目实训博客-TravelMind途灵] 2初步界面实现及路径规划
map.vue主要用于集成高德地图(AMap)到前端页面,以实现可视化地图功能。确保 key 正确的前提下,网络无误,脚本加载完成后再进行重新初始化。主要基于vue+api来实现地图的可视化以及周围功能卡片的实现。App.vue作为应用的根组件,首先定义页面的基本布局。则用来保存一些具体推荐的内容信息。高度,并确保无 padding/margin.是卡片式推荐组件 ,用于展示地点的推荐信息。,主要用于展示 AI 生成的推荐内容。最终的效果如下(以北京到天安门为例)vue项目的主要结构如下。
2025-04-10 19:22:01
175
原创 [项目实训博客-TravelMind途灵]1.通过调用API获取天气信息以及车票信息
定义主查询方法,根据API文档完成API的调用,主要获取了实时温度、体感温度、风速等瞬时数据、3天预报以及6小时的温度趋势。首先完成彩云天气API的注册和申请,并根据其提供的API文档来完成代码调用获取需要的相关的天气信息。API的调用需要python中requests的库,需要在环境中事先安装requests。为了优化用户体验,还对数据进行了处理,符合用户的读取习惯。根据调用得到的天气信息,通过温度来生成用户穿衣推荐。最终输出结果如下(以北京的天气为例)增加异常处理机制,避免异常的出现。
2025-03-20 16:58:58
430
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅