用WorkBuddy开发一个智能情感地图小程序

用户输入 "找个适合发呆的老建筑"
        ↓
parseIntent() → { keyword: "古迹", orderby: "_distance" }
        ↓
qqmapsdk.search({ keyword: "古迹", location: "39.9,116.3" })
        ↓
processSearchResults() → 生成 markers[] + AI 文案
        ↓
<map> 渲染 markers + scale: 16 放大
        ↓
bindmarkertap → 底部抽屉 → 场所印象 → 导航/分享

initLocation() {
  wx.showLoading({ title: '正在获取位置...' })

  wx.getLocation({
    type: 'gcj02', // 使用国测局坐标，与地图组件一致
    success: (res) => {
      this.setData({
        latitude: res.latitude,
        longitude: res.longitude,
        userLat: res.latitude,
        userLng: res.longitude
      })
      // 保存到全局，供搜索时使用
      getApp().globalData.userLocation = {
        latitude: res.latitude,
        longitude: res.longitude
      }
      this.mapContext = wx.createMapContext('cityMap', this)
      wx.hideLoading()
    },
    fail: () => {
      wx.hideLoading()
      wx.showToast({ title: '定位失败，使用默认位置', icon: 'none' })
    }
  })
}

parseIntent(userInput) {
  const input = userInput.toLowerCase()

  // 关键词映射表：将自然语言映射为 POI 搜索关键词
  const keywordMap = {
    '咖啡': '咖啡厅', '喝咖啡': '咖啡厅',
    '发呆': '咖啡馆', '安静': '图书馆',
    '老建筑': '古迹',   '古建筑': '古迹',
    '露台': '露台餐厅', '拍照': '景点',
    '夜景': '观景台',   '猫': '猫咖',
    // ... 50+ 关键词映射
  }

  // 排序方式推断
  const orderbyMap = {
    '近': '_distance', '附近': '_distance',
    '好评': '_score',   '推荐': '_score'
  }

  // 匹配关键词和排序
  let keyword = '景点'  // 默认
  let orderby = '_distance'

  for (const [key, value] of Object.entries(keywordMap)) {
    if (input.includes(key)) { keyword = value; break }
  }
  for (const [key, value] of Object.entries(orderbyMap)) {
    if (input.includes(key)) { orderby = value; break }
  }

  return { keyword, orderby }
}

handleUserQuery(userInput) {
  this.setData({ aiThinking: true })

  const intent = this.parseIntent(userInput)
  const { userLat, userLng } = this.data
  const locationStr = userLat && userLng
    ? `${userLat},${userLng}`
    : `${this.data.latitude},${this.data.longitude}`

  qqmapsdk.search({
    keyword: intent.keyword,
    location: locationStr,
    orderby: intent.orderby,
    page_size: 20,
    page_index: 1,
    success: (res) => {
      if (res.status === 0 && res.data && res.data.length > 0) {
        this.processSearchResults(res.data, intent)
      } else {
        this.setData({ aiThinking: false })
        wx.showToast({ title: '没有找到相关地点', icon: 'none' })
      }
    }
  })
}

processSearchResults(poiList, intent) {
  const markers = poiList.map((poi, index) => {
    // 距离格式化
    let distanceText = '未知'
    if (poi._distance !== undefined) {
      distanceText = poi._distance < 1000
        ? `${Math.round(poi._distance)}m`
        : `${(poi._distance / 1000).toFixed(1)}km`
    }

    return {
      id: index,
      latitude: poi.location.lat,
      longitude: poi.location.lng,
      title: poi.title,
      iconPath: '/images/marker.svg',
      width: 40, height: 40,
      anchor: { x: 0.5, y: 1 },
      callout: {
        content: poi.title,
        color: '#1E1B4B', fontSize: 12,
        borderRadius: 12, bgColor: 'rgba(255,255,255,0.92)',
        display: 'BYCLICK', textAlign: 'center'
      },
      _poiData: {
        ...poi,
        _distanceText: distanceText,
        _aiDescription: this.generateAIDescription(poi, intent)
      }
    }
  })

  this.setData({
    markers,
    aiThinking: false,
    scale: 16  // 搜索成功后放大地图展示点位
  })

  // 缩放视野包含所有标记点
  if (markers.length > 0 && this.mapContext) {
    this.mapContext.includePoints({
      points: markers.map(m => ({
        latitude: m.latitude, longitude: m.longitude
      })),
      padding: [120, 80, 200, 80]
    })
  }
}

// Marker 配置
{
  iconPath: '/images/marker.svg',  // 自定义圆形图标
  width: 40, height: 40,
  anchor: { x: 0.5, y: 1 },      // 锚点在底部中心
  callout: {
    content: poi.title,
    color: '#1E1B4B',
    borderRadius: 12,
    bgColor: 'rgba(255,255,255,0.92)',  // 半透明背景
    borderWidth: 1,
    borderColor: 'rgba(99,102,241,0.15)',
    display: 'BYCLICK'
  }
}

onMarkerTap(e) {
  const markerId = e.detail.markerId || e.markerId
  const marker = this.data.markers[markerId]
  if (!marker || !marker._poiData) return

  this.setData({
    selectedPOI: marker._poiData,
    showDrawer: true
  })
}

generateAIDescription(poi, intent) {
  // ⚠️ 此处未来接入混元大模型 API
  const templates = [
    `${poi.title}，一个藏在城市褶皱里的温柔角落。在这里，时间慢下来，只有风和光影在低语。`,
    `${poi.title}像一首未完的诗——走进去，你会发现，城市的低语原来一直在这里。`,
    // ... 更多模板
  ]
  return templates[Math.floor(Math.random() * templates.length)]
}

onNavigate() {
  const poi = this.data.selectedPOI
  wx.openLocation({
    latitude: poi.location.lat,
    longitude: poi.location.lng,
    name: poi.title,
    address: poi.address || '',
    scale: 16
  })
}

<button class="share-btn" open-type="share">
  <image class="nav-icon share-icon" src="/images/share.svg" />
  <text class="nav-text share-text">分享给朋友</text>
</button>

onShareAppMessage() {
  const poi = this.data.selectedPOI
  if (poi) {
    const lat = poi.location ? poi.location.lat : poi.latitude
    const lng = poi.location ? poi.location.lng : poi.longitude
    return {
      title: `我在 City Whisperer 发现了一个好去处：${poi.title}`,
      path: `/pages/index/index?lat=${lat}&lng=${lng}&name=${encodeURIComponent(poi.title)}`
    }
  }
  return {
    title: 'City Whisperer - 城市低语，发现身边的美好',
    path: '/pages/index/index'
  }
}

onLoad(options) {
  if (options && options.lat && options.lng) {
    const lat = parseFloat(options.lat)
    const lng = parseFloat(options.lng)
    if (!isNaN(lat) && !isNaN(lng)) {
      this.setData({ latitude: lat, longitude: lng, scale: 16 })
    }
  }
  this.initLocation()
}

/* 搜索栏 — 浮在地图上方的毛玻璃层 */
.search-bar {
  position: absolute;
  top: 0;
  z-index: 100;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom: 1rpx solid rgba(99, 102, 241, 0.1);
}

/* 底部抽屉 — 更强模糊的毛玻璃面板 */
.bottom-sheet {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(32px);
  -webkit-backdrop-filter: blur(32px);
  border-radius: 48rpx 48rpx 0 0;
}

/* AI 印象卡片 — 紫色调毛玻璃 */
.ai-impression {
  background: rgba(99, 102, 241, 0.08);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1rpx solid rgba(99, 102, 241, 0.1);
}

/* 全局工具类 */
.flex { display: flex; }
.items-center { align-items: center; }
.glass {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(20px);
  border: 1rpx solid rgba(255, 255, 255, 0.3);
}
.shadow-md { box-shadow: 0 8rpx 24rpx rgba(99, 102, 241, 0.12); }

.share-btn {
  padding: 0;
  margin: 0;
  line-height: normal;
  border: 1rpx solid rgba(99, 102, 241, 0.15) !important;
}
.share-btn::after { border: none; } /* 去除默认边框 */