LocalStorage不能直接保存地图搜索结果，但可将用户选择的POI信息（如名称、坐标、地址等）结构化后存入，需用JSON.stringify()序列化，读取时JSON.parse()还原，并注意去重、坐标系差异及存储安全。
LocalStorage 本身不能直接保存地图搜索结果（比如高德或百度地图的 POI 数据），但你可以把用户手动选择的地点信息（如名称、坐标、地址、类型等）提取出来，再存入 LocalStorage。关键在于：不是“自动收藏地图搜索结果”，而是“在你自己的网页中，调用地图 SDK 搜索后，由你控制哪些结果被收藏”。
1. 先获取地图 SDK 的搜索结果数据
以高德地图 JS API 为例，使用 AMap.PlaceSearch 或 AMap.Autocomplete 获取搜索建议或结果：
- 用户输入关键词（如“咖啡馆”），触发搜索
- SDK 返回 JSON 格式的 POI 列表，包含
name、location（经纬度字符串，如 "116.481028,39.989643"）、address、tel等字段 - 你在前端把这些字段解析成 JS 对象（例如拆分
location得到lng和lat）
2. 设计收藏数据结构并存入 LocalStorage
推荐用数组形式存储多个收藏项，每项是结构化对象：
{
id: "amap_123456", // 可选：用高德 poiId 或自生成唯一 ID
name: "星巴克（三里屯店）",
lng: 116.4587,
lat: 39.9872,
address: "北京市朝阳区三里屯路19号",
type: "餐饮服务;咖啡厅",
source: "amap",
timestamp: 1717023456789
}
存入时注意：
立即学习“前端免费学习笔记（深入）”；
- 用
JSON.stringify()转为字符串再存，因为 LocalStorage 只支持字符串值 - 用
localStorage.setItem('mapFavorites', jsonStr) - 建议加防重逻辑：根据
name + lng + lat做简单去重，避免重复收藏
3. 读取和渲染本地收藏点到地图上
页面加载后，从 LocalStorage 读出数据，还原为数组：
- 用
JSON.parse(localStorage.getItem('mapFavorites') || '[]')获取收藏列表 - 遍历数组，对每个点创建 AMap.Marker（高德）或 BMap.Marker（百度）
- 可额外绑定 infoWindow 显示名称和地址，点击 marker 即可查看详情
- 如果想持久化图标样式或分类，可在数据中增加
icon字段（如图标 URL 或颜色标识）
4. 百度地图适配要点
百度地图（BMap）流程类似，但注意：
- 搜索用
BMap.LocalSearch或BMap.Autocomplete - 返回的坐标是
point.lng/point.lat（BMap.Point 对象），需转为数字再保存 - 百度坐标系为 BD09，高德为 GCJ02，若混合使用需转换（但收藏仅作展示时，只要前后一致即可）
- 收藏数据中建议记录
source: 'baidu'，便于后续区分或迁移
不复杂但容易忽略：LocalStorage 容量约 5–10MB，单个 key 值不宜过大；敏感信息（如用户常去地点）不建议明文长期存储；如需跨设备同步，得搭配后端或 IndexedDB + 同步机制。
