Google heatmaptiles

CesiumJS
1

I use this bit of code below to retrieve and display google heatmaps on a google 3d photorealistic terrain. Problem is that the imagerylayers collection is undefined and i’m not able to add the layer. Any ideas why the imagerylayers collection remains undefined?

export async function addTilesetFromGoogleAQI() {
let heatMapLayer;

const zcoord = 2;
const xcoord = 0;
const ycoord = 1;

const layers = viewer.scene.imageryLayers;

if (layers) {
let url = https://airquality.googleapis.com/v1/mapTypes/US_AQI/heatmapTiles/${zcoord}/${xcoord}/${ycoord}?key=${"xxxxxxxxxxxxxxxxxxx"};
let singleTileProvider = await Cesium.SingleTileImageryProvider.fromUrl(url, { rectangle: Cesium.Rectangle.fromDegrees(-180.0, 4.0, -90, 72.75) });
heatMapLayer = new Cesium.ImageryLayer(singleTileProvider);

layers.add(heatMapLayer);
heatMapLayer.show = true;

}
return heatMapLayer;
}

2

Hi @hilmar.retief,

I’m assuming that you are setting up the viewer with globe: false in order to use the Google 3D Tiles as “terrain”. This setting also skips setting up the imagery layers because they are currently not needed without a globe to display the imagery on.

Draping imagery on 3DTiles is actually something that CesiumJS does not currently support. Work is currently underway on that front but until it’s implemented you will only be able to display imagery on terrain providers like the default CWT.

I apologize it’s not supported for now but please follow that issue in Github for updates.

3

Exactly. Ok, thanks. That explains it. So I’m not going crazy :wink: