咨询：使用Google Maps JS API的mapID如何即时切换明暗模式

当使用google.maps.marker.AdvancedMarkerElement必须依赖mapID时，无需重建地图实例，直接调用map.setMapId()方法切换预定义的亮色/暗色mapID即可，完全保留当前地图状态（缩放、中心位置、标记等）。

具体步骤： #

1. 在Google Cloud控制台创建两个mapID：
   • 一个配置为亮色地图样式
   • 另一个配置为暗色地图样式
2. 修改你的暗色模式切换监听代码：

   darkmode.addEventListener('change', ({ matches }) => {
     // 根据匹配状态切换对应的mapID
     map.setMapId(matches ? '你的暗色mapID' : '你的亮色mapID');
   });
   

关键说明： #

• setMapId()是Google Maps JavaScript API支持的官方方法，调用后会立即更新地图样式，不会触发地图重建，所有现有状态（包括已添加的AdvancedMarkerElement标记）都会保留。
• 如果你需要更灵活的自定义样式，也可以在配置mapID时，将基础样式设为亮色/暗色，再结合map.setOptions({ styles: 自定义样式数组 })做局部调整（注意mapID的优先级高于自定义styles，需留意样式叠加逻辑）。

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