前言

城市中存在大量"隐性浪费"：长年关闭的店铺、无人使用的公共空间、夜间彻夜明亮的高能耗广告牌、成堆无人挪动的共享单车……这些浪费分散在城市各角落，难以被统一感知和管理。

本项目尝试用 AI + 腾讯位置服务 解决这一问题：通过 POI 数据检索、热力可视化与大模型分析，自动识别四类城市浪费点位，并以交互地图的形式将其直观呈现，同时为每处点位生成可落地的改造建议。项目借助 WorkBuddy + 腾讯位置服务 Agent Skill 完成开发，全程 AI 辅助，整体研发效率大幅提升。

项目效果图

项目演示

项目地址

当前项目已经开源并上传到GitCode 有需要的同学可以自行下载体验，注意配置自己的key哦
项目地址

项目实践

本项目借助 WorkBuddy 并结合腾讯位置服务的 Agent Skill 实现，腾讯位置服务基础能力 Skill 一览表如下：

Skill 名称	定位	核心能力	下载地址
TencentMap_jsapi_skills	前端地图开发	地图初始化、3D 视图控制、覆盖物绘制、图层管理、事件系统、可视化渲染、三维模型展示	TencentMap_jsapi_skills
TencentMap_lbs_skills	LBS 综合服务	周边搜索、旅游规划、轨迹图可视化	TencentMap_lbs_skills
TencentMap_webservice_skills	WebService API 服务	地址转换、POI 搜索、路线规划、距离矩阵、IP 定位、天气查询等	TencentMap_webservice_skills

安装 Skill

在 WorkBuddy 中安装 Skill 有两种方式：

方式一：直接在技能标签栏中搜索相关 Skill 安装，如下图所示：

方式二：在任务中直接将 Skill 名称告知智能体，让其自动完成安装：

等待 Skill 安装成功后即可开始项目开发。

项目立项

本项目的核心目标是：用 AI 捕捉城市浪费轨迹，用地图激活闲置价值，让每一寸空间都发挥作用。

核心目标

公益层面：精准识别城市空间与资源浪费点位，为环保组织、城市管理部门提供数据支撑，助力可持续发展。

城市更新层面：针对闲置空间、空置店铺等，输出贴合实际的改造建议，推动城市"边角料"空间重生，打造城市更新微场景。

学生课题层面：提供轻量化数据采集、分析、可视化路径，适配学生参赛、课题研究，降低开发门槛，兼顾学术性与实践性。

技术底座

地图渲染与可视化：JavaScript API GL（实现地图底图加载、点位标记、自定义图层、浪费热力图渲染）、数据可视化 JS API（强化热力图、点位分类展示效果）。

点位检索与定位：地点检索 API（检索空置店铺、公共空间、广告牌、共享单车点位）、周边推荐 API（筛选指定范围内的浪费点位）、H5 地图定位组件（获取用户当前位置，查看周边浪费点位）、IP 定位（初始化用户城市，快速加载对应区域数据）。

数据支撑：轨迹云（记录共享单车轨迹，分析堆积点形成规律）、地点云（存储闲置点位信息，关联 POI 详情）、数据魔方（时空大数据分析平台，辅助识别长期空置、高能耗点位）。

AI 与协同：MCP 协议 + 工具调用（AI Agent 自动调度地图检索、热力渲染、路线规划能力）、大模型意图识别（理解用户查询，如"查询某区域闲置公共空间及改造建议"）。

系统架构

下图展示了本项目的整体数据与调用流程：

核心功能模块

依托腾讯位置服务的 POI 数据与 AI 大模型，本项目自动识别城市中四类典型浪费现象，以热力图形式直观呈现浪费分布与严重程度。下表是四类点位的识别逻辑与核心 API 依托：

浪费点位类型	AI 识别标准	依托腾讯位置服务能力
长期空置店铺	日均停留 < 5人、连续3个月无消费/打卡记录	地点检索 API、人群热力数据、数据魔方
闲置公共空间	日均使用人数 < 10人、AOI 热力持续低位	多边形检索 API、周边推荐 API、AOI 边界查询
高能耗广告牌	夜间22:00后亮度 > 800lux、日均耗电 > 50度	地点检索 API、时段监测、能耗估算模型
共享单车堆积	数量≥20辆、停留≥24小时、位于禁停区域	轨迹云、定位服务、批量距离计算

各点位被标注后，AI 自动按轻度/中度/重度三个等级给出差异化改造建议，覆盖空间活化、节能改造、单车调度等方向。

开始研发

到目前为止，项目前期工作已经准备就绪。接下来将需求整理完成，交给 WorkBuddy 来实现，如下图所示：

注意：当我们将需求给到 WorkBuddy 之后，由于尚未配置腾讯位置服务的 key，它会主动询问。我们直接告知 WorkBuddy 后期自行添加 key 即可，如下图所示：

项目开发完成后，WorkBuddy 实现的功能汇总如下图所示：

关键实现解析

1. 地图初始化与暗色 3D 底图

项目使用 JSAPI GL 加载暗色个性化样式（style4）并开启 3D 楼块，配合 35° 俯仰角，呈现出科技感十足的城市视觉效果：

var map = new TMap.Map('map', {
  zoom       : 12,
  pitch      : 35,          // 俯仰角，3D 效果更佳
  center     : new TMap.LatLng(23.1291, 113.2644),
  mapStyleId : 'style4',    // 暗色个性化样式
  baseMap    : { type: 'vector', features: ['base', 'building3d'] }
});

2. 浪费热力图渲染

使用 TMap.visualization.Heat 生成分级热力图，颜色由绿→黄→红对应轻度→重度浪费，同时启用 3D 峰值高度增强视觉辨识度：

var heatLayer = new TMap.visualization.Heat({
  max    : 100,
  min    : 0,
  height : 50,      // 3D 峰值高度
  radius : 40,
  opacity: 0.85,
  gradientColor: {
    0   : '#1a6b3a',   // 无浪费（深绿）
    0.3 : '#52c41a',   // 轻度浪费
    0.6 : '#ffcc00',   // 中度浪费
    1.0 : '#ff0040'    // 重度浪费（深红）
  }
}).addTo(map).setData(heatPoints);

3. 四类点位分层标记

每类浪费点位创建独立的 MultiMarker 图层，支持重/中/轻三级样式区分，点击后展开右侧详情面板与 AI 改造建议：

var layer = new TMap.MultiMarker({
  id    : 'shop-layer',
  map   : map,
  styles: {
    high: new TMap.MarkerStyle({ width: 26, height: 26, src: svgUrl }),
    mid : new TMap.MarkerStyle({ width: 22, height: 22, src: svgUrl }),
    low : new TMap.MarkerStyle({ width: 18, height: 18, src: svgUrl })
  },
  geometries: points.map(function(p) {
    return { id: p.id, styleId: p.level, position: new TMap.LatLng(p.lat, p.lng) };
  })
});
layer.on('click', function(evt) { showDetailPanel(evt.geometry.properties); });

4. 点位上报与地理编码

市民上报浪费点位时，系统调用地理编码 API 将地址转换为精确坐标，并实时渲染到地图：

// 地址 → 坐标（用于用户上报功能）
jsonpRequest('https://h5gw.map.qq.com/ws/geocoder/v1/', {
  key    : 'none',
  apptag : 'lbs_geocoder',
  address: userInputAddr,
  region : '广州'
}, function(res) {
  if (res.status === 0) {
    var loc = res.result.location; // { lat, lng }
    // 将新点位渲染至地图...
  }
});

5. 一键导航（URI API）

点击任意点位，可一键调起腾讯地图 App 进行导航，适配环保志愿者巡查、城管人员检查等场景：

function navigate(lat, lng, name) {
  var url = 'https://apis.map.qq.com/uri/v1/routeplan'
    + '?type=drive'
    + '&to=' + encodeURIComponent(name)
    + '&tocoord=' + lat + ',' + lng
    + '&referer=' + TMAP_WEBSERVICE_KEY;
  window.open(url, '_blank');
}

6. 完整 API 调用清单

下图为项目所有接口及其用途，开发时可对照使用：

交互功能亮点

项目在基础点位展示之上，还提供了以下实用功能：

• 热力图/点位图/叠加 三种显示模式一键切换
• 点位类型筛选：可单独查看某一类浪费点位
• AI 搜索：输入区域/地址关键词，快速定位并加载数据
• 点位上报：市民填写类型与地址后，经 AI 审核（约 1-2 分钟）即上图
• 一键导航：调用腾讯地图 URI API，适配现场巡查场景
• 数据导出：一键导出 CSV（含点位坐标、类型、浪费等级、AI 建议），供课题研究或存档
• 课题模式：提供六步引导（确定范围→采集→分析→可视化→导出→输出建议），帮助学生快速上手

配置与调试

项目开发完成后，前往 腾讯云位置服务控制台 申请 API Key，并在 index.html 顶部替换即可：

// JSAPI GL Key —— 用于地图渲染、热力图、可视化
var TMAP_JSAPI_KEY = 'YOUR_JSAPI_KEY';

// WebService Key —— 用于 POI 搜索、地理编码、IP 定位、路线规划
var TMAP_WEBSERVICE_KEY = 'YOUR_WEBSERVICE_KEY';

体验模式说明：未配置正式 Key 时，WebService 调用通过 h5gw.map.qq.com + JSONP 方式运行，支持 IP 定位、POI 搜索、地理编码、路线规划等主要接口；天气查询（/ws/weather/v1/）和电动车路线（/ws/direction/v1/ebicycling/）需正式 Key 开通。

总结与展望

本项目从需求分析、AI Agent 辅助开发到腾讯位置服务多接口协同的全链路实践。借助 WorkBuddy，开发者可以将精力集中在需求设计与业务逻辑上，而非繁琐的样板代码,同时腾讯位置服务的时空数据这里做的也不错， 我们直接使用其POI 数据结合ai 进行分析，来实现我们的项目。