Capacitor Google Maps Android端自定义图标无法加载求助

方案1：直接引用Android资源目录图片（最稳定） #

• 将PNG图标重命名为小写字母+下划线格式（如custom_marker.png），放入Android项目的app/src/main/res/drawable目录
• 代码中使用res://drawable/图标文件名作为iconUrl，示例：

const marker = await map.addMarker({
  coordinate: { lat: 37.7749, lng: -122.4194 },
  iconUrl: 'res://drawable/custom_marker'
});

• 原理：Capacitor Google Maps插件会自动把res://开头的路径转换为Android原生资源ID，直接被Google Maps SDK识别加载，无权限和路径格式问题。

方案2：通过Assets目录加载本地图片 #

• 将PNG图标放到项目的src/assets/markers/目录（无目录则新建）
• 用Capacitor Filesystem获取Assets目录的正确URI，示例：

import { Filesystem, Directory } from '@capacitor/filesystem';

async function getMarkerIcon() {
  const uriResult = await Filesystem.getUri({
    path: 'markers/custom_marker.png',
    directory: Directory.Assets
  });
  return uriResult.uri;
}

// 添加标记时调用
const iconUri = await getMarkerIcon();
const marker = await map.addMarker({
  coordinate: { lat: 37.7749, lng: -122.4194 },
  iconUrl: iconUri
});

• 注意：Assets目录为只读，无需申请额外文件权限，返回的content://格式URI可直接被Google Maps SDK识别。

关于SVG的处理 #

Capacitor Google Maps官方插件目前在Android端原生不支持直接加载SVG图标，若想保留SVG节省空间的优势：

1. 提前将SVG转为PNG格式（用在线工具或本地脚本批量转换），再用上述方案加载
2. 如需动态转换，需编写Android原生代码：借助Glide等图片加载库将SVG转为Bitmap，再通过插件传递给Google Maps SDK（该方法需要Android原生开发能力）

版本选择建议 #

你当前使用的@capacitor/google-maps是Capacitor官方维护的包，与Capacitor 5.x版本适配性更好、功能更稳定，不建议切换到社区版@capacitor-community/google-maps，当前问题并非版本导致。

排查之前方案失效的原因 #

你之前将Base64 PNG写入Documents目录无效，大概率是因为：

• Android 10+ 限制直接访问file://路径，Google Maps SDK无法加载此类路径的文件
• 即使申请了文件读写权限，file://路径仍可能被沙箱限制
• Documents目录的URI格式不符合Google Maps SDK要求，而res://或content://格式无此问题

内容的提问来源于stack exchange，提问作者Nimrod5000