Cordova应用Google Map标记不显示，替换AdvancedMarkerElement报错求助

DevOps 小满

2026-6-26

解决方案

先解决旧Marker不显示的问题

锁定Google Maps JS SDK版本：避免使用自动更新的latest或beta版本，直接指定稳定版，比如加载链接写成：
```
<script src="https://maps.googleapis.com/maps/api/js?v=3.54&key=你的API_KEY"></script>
```
（3.54为当前稳定版，后续可根据官方更新调整版本号）

确保标记创建时机正确：把标记创建逻辑放到地图加载完成的回调里，避免地图实例未初始化就创建标记：

map.addListener('tilesloaded', function() {
  const marker = new google.maps.Marker({
    position: new google.maps.LatLng(纬度, 经度),
    map: map,
    title: '标记标题'
  });
});

检查标记参数有效性：确认position是合法的google.maps.LatLng实例；如果用本地图标，路径要使用Cordova支持的格式，比如cdvfile://localhost/persistent/imgs/marker.png，避免绝对路径导致加载失败

解决AdvancedMarkerElement报错问题

加载SDK时必须引入marker库：新的高级标记属于扩展库，不加的话google.maps.marker会是undefined，加载链接需修改为：
```
<script src="https://maps.googleapis.com/maps/api/js?v=3.54&key=你的API_KEY&libraries=marker"></script>
```
检查Cordova插件兼容性：如果使用cordova-plugin-googlemaps这类封装插件，它内部可能仍基于旧API实现，直接调用原生JS的AdvancedMarkerElement会产生冲突。要么升级插件到支持新API的最新版本，要么继续使用插件提供的addMarker方法，不要直接调用JS SDK的API
等待设备就绪后再初始化地图：Cordova必须在deviceready事件触发后再加载SDK和初始化地图，否则环境未准备好会导致API加载异常：
```
document.addEventListener("deviceready", function() {
  // 在这里加载Google Maps SDK并初始化地图
}, false);
```