Google Maps API：如何通过样式编辑器统一地图所有文本颜色？

问题描述 #

我在Cloud Platform样式编辑器中修改文本填充色与描边色后，预览显示一切正常，但将自定义样式应用到map-ID并在JavaScript中使用该map-ID时，文本颜色出现不一致：POI名称为预期颜色，但商家类型、评分等文本颜色均不同。

编辑器预览效果：

实际效果截图：

目前我仅能通过JSON数组修改这些文本颜色（而非为map-ID应用地图样式），请问是否有办法让所有文本描述颜色统一？

解决方法 #

• 检查样式编辑器的图层覆盖规则
  商家类型、评分这类文本属于独立的POI子图层（比如poi.subcategory、poi.rating），你大概率只修改了主POI图层的文本样式，没覆盖到这些子图层。进入样式编辑器，找到所有包含文本的POI相关子图层，统一设置它们的文本填充色和描边色。

• 确认map-ID的样式发布状态
  修改样式后必须点击发布按钮，并且等待1-5分钟让样式同步生效。很多时候预览正常但实际失效，都是因为样式没完成发布同步。

• 在JS代码中强制刷新缓存瓦片
  初始化地图时，添加refreshExpiredTiles: true配置，强制刷新缓存的旧地图瓦片，避免加载未更新的样式：

  const map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8,
    mapId: '你的map-ID',
    refreshExpiredTiles: true
  });
  

• 直接嵌入完整样式JSON（备选方案）
  如果map-ID同步始终有问题，从样式编辑器导出完整的样式JSON，初始化地图时通过styles参数直接传入，确保所有图层样式被精准应用：

  const customMapStyle = [
    // 粘贴导出的完整样式JSON数组
  ];
  const map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8,
    styles: customMapStyle
  });
  

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