我目前正在使用谷歌Map3.54（最新版本）进行vue2项目，由于advancedMarkers，需要使用此版本。

https://maps.googleapis.com/maps/api/js?key=${this.mapKey}&callback=isMapLoad&libraries=marker&v=3.54

我阅读了所有关于样式化Map的文档，我以前在其他版本上做过。但我找不到路。
我尝试在init上设置一个样式：

this.map = new google.maps.Map(document.getElementById('map'), {
  mapId: 'GMAP_ID',
  language: this.$i18n.locale,
  center: this.defaultCoords,
  zoom: this.zoom,
  styles: [
  {
    featureType: 'water',
    elementType: 'all',
    stylers: [
     {
       color: '#f40000',
     },
     {
       visibility: 'on',
     },
    ],
  }
 ]
})

或者在初始化后使用：

const styledMapType = new google.maps.StyledMapType(
 [
  {
    featureType: 'water',
    elementType: 'all',
    stylers: [
     {
       color: '#f40000',
     },
     {
       visibility: 'on',
     },
    ],
  }
 ]
)
this.map.mapTypes.set('styled_map', styledMapType)
this.map.setMapTypeId('styled_map')

// i have added to my script url the libraries maps to have StyledMapType

我没有错误，但两种情况都没有变化。我能尝试什么？

更新

有一个工作的例子的麻烦：https://jsfiddle.net/981w4zxb/1/
如果像示例中那样删除mapId，则样式为apply，但在这种情况下，标记不再起作用。
如果添加mapid，则显示高级标记，但styles不适用。
我都想要，这是强制性的太使用先进的标记和风格没有云，但遗留styles。