Google Maps切换hybrid与roadmap模式触发TypeError错误如何解决？

• 方法调用路径错误：google.maps.Map 实例本身内置 setMapTypeId 实例方法，无需通过 map.google.maps 路径访问。你的写法中 map 对象不存在 google 属性，因此触发了读取 maps 属性时报undefined的错误。
• 重复实例化问题：每次触发 sat() 函数时都重新创建 Map 实例，会导致地图重复初始化，丢失之前的缩放层级、标记点等自定义状态，同时存在不必要的性能损耗。

首先将地图实例存储在全局作用域，避免重复初始化：

// 全局存储地图实例
let map;

// 页面加载时执行的地图初始化函数
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    // 此处保留你原有的地图初始化配置，例如中心坐标、缩放层级
    center: { lat: 39.9042, lng: 116.4074 },
    zoom: 10
  });
}

调整切换地图类型的函数写法：

// 切换为卫星混合模式
function sat() {
  map.setMapTypeId('hybrid');
}

// 切换为路线图模式的参考写法
function showRoadmap() {
  map.setMapTypeId('roadmap');
}

确保页面已经正确加载Google Maps JS API脚本，且初始化逻辑执行顺序正确，切换模式的函数触发时全局map实例已经完成初始化即可。

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