Search code examples
cesiumjs

How can I change the cesium lighting setup so the tiles appear the same zoomed in and out?


I have a sandcastle. However, a free key will be needed to make it work. The key can be obtained by going to https://www.maptiler.com/ to create a free account. Your key will then be on https://cloud.maptiler.com/account/keys/

The code is:

const osm = new Cesium.UrlTemplateImageryProvider({
   url : 'https://api.maptiler.com/maps/ch-swisstopo-lbm-dark/256/{z}/{x}/{y}.png?key=<your  key>',
});

console.log( osm.url )

const viewer = new Cesium.Viewer("cesiumContainer", {
  baseLayer: Cesium.ImageryLayer.fromProviderAsync(osm),
  baseLayerPicker: false,
  geocoder: false,
  animation: false,
  timeline: false,
  infoBox: false,
  homeButton: true,
  fullscreenButton: false,
  sceneModePicker: false,
  selectionIndicator: false,
  navigationHelpButton: false,
  terrainProvider: null,
  creditContainer: document.createElement('none'),
});                 

The image this produces when zoomed out is:

zoomed out globe

There is a light blue tint to the globe. However, if I zoom in, I see:

zoomed in globe

which matches the tile set I am using (CH swisstopo LBM Dark).

I figure there is something about the lighting that needs to be changed so zoomed out will look the same as zoomed in, but I am not sure how to do that...? (I want the dark zoomed in look, not the light blue when zoomed out)

[UPDATE 1] What has gotten me a bit closer is setting:

viewer.scene.globe.atmosphereLightIntensity = 0

which then results in the zoomed out image:

no atmosphere lighting

instead of a light blue, it is a light gray.

There is the bluish ring around the globe which needs to go away as well.


Solution

  • The answer appears to be to set:

    viewer.scene.globe.showGroundAtmosphere = false;
    viewer.scene.skyAtmosphere.show = false
    

    this produces the zoomed out image of:

    without tint or ring

    And zooming in no longer shows a distinct color shift with the drawn tiles. There is no ring.

    There is a useful demo which I had missed to play with the possible settings.

    Cesium Atmosphere Demo