[Bug] Non-interleaved GoogleMapsOverlay layers render above map controls for vector maps

[camden-obertop]

Description

The deck.gl GoogleMapsOverlay renders above the Google Map controls. The image below shows what happens when rendering this scatterplot layer from the documentation

This problem occurs when you are working on a Google Map with a vector map id. If you do not provide an id or the map is set to "raster" style, the layer will be behind the controls. If the map is set to be vector style, it will work when the overlay interleaved is set to true. This bug specifically occurs on a vector Google Map when interleaved is false

Flavors

• Script tag
• React
• Python/Jupyter notebook
• MapboxOverlay
• GoogleMapsOverlay
• CartoLayer
• ArcGIS

Expected Behavior

The layer should render beneath the map controls

Steps to Reproduce

Set up a Google Maps API project with a vector map id. Use that as the map you pass to overlay.setMap

...
// set up deck.gl overlay and layer
const layer = new ScatterplotLayer({
  id: 'ScatterplotLayer',
  data: 'https://raw.githubusercontent.com/visgl/deck.gl-data/master/website/bart-stations.json',
  stroked: true,
  getPosition: d => d.coordinates,
  getRadius: d => Math.sqrt(d.exits),
  getFillColor: [255, 140, 0],
  getLineColor: [0, 0, 0],
  getLineWidth: 10,
  radiusScale: 6,
  pickable: true
});

const overlay = new GoogleMapsOverlay({
  layers: [layer],
  interleaved: false,
});

// associate the deck.gl overlay with the google map
overlay.setMap(map);

Environment

• Framework version: [email protected]
• Browser: Chrome 128.0
• OS: MacBook Pro M1

Logs

No response