How Do I get ScatterplotLayer to properly render above 3D buildings in interleaved mode?

[morty346]

I'm using deck.gl v8.8.27 with Google Maps in interleaved mode, but my ScatterplotLayer markers are being occluded by 3D buildings/houses, making them invisible.

script src="https://cdn.jsdelivr.net/npm/[email protected]/dist.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/@deck.gl/[email protected]/dist.min.js"></script>

map = new google.maps.Map(document.getElementById('map'), {
center: { lat: savedPos.lat, lng: savedPos.lng },
zoom: 15,
maxZoom: 25,
mapTypeId: 'roadmap',
mapId: "1234", // Vector map for rotation support
// ... other standard options
});

const layer = new deck.ScatterplotLayer({
id: 'geopoints-layer',
data: data, // ~33,000 points
pickable: true,
opacity: 0.8,
stroked: true,
filled: true,
radiusScale: 6,
radiusMinPixels: 1,
radiusMaxPixels: 100,
lineWidthMinPixels: 1,
getPosition: d => d.position, // [longitude, latitude] format
getRadius: d => Math.max(d.radius || 2, 1),
getFillColor: d => d.color, // [r, g, b, a] format
getLineColor: [255, 255, 255, 255],
onClick: (info, event) => handleClick(info.object, event)
});

deckOverlay = new GoogleMapsOverlay({
interleaved: true,
layers: []
});
deckOverlay.setMap(map);