How can i use a static Image as a Backdrop Image

CesiumJS
1

Dear All,

Is there any way to use a image (JPEG, PNG, TIF) as a background for the
Cesium 3D viewer.

I would like to do something as Photomontage like those in 3D Studio Max Camera Match or Sketchup PhotoMatch.

Cheers
Eric Yuen

2

Hi Eric,

As far as I know there's no way to set a single background image, but you can set the viewer's skybox (https://cesiumjs.org/Cesium/Build/Documentation/SkyBox.html) using

var viewer = new Cesium.Viewer('cesiumContainer', {
  skyBox: skyBox = new Cesium.SkyBox({
    sources : {
      positiveX : 'skybox_px.png',
      negativeX : 'skybox_nx.png',
      positiveY : 'skybox_py.png',
      negativeY : 'skybox_ny.png',
      positiveZ : 'skybox_pz.png',
      negativeZ : 'skybox_nz.png'
    }
  }
}

3

There is no way to set a background image with Cesium, but you can do it with HTML. Disable the sky box and set the background color alpha to 0 and any HTML elements behind the Cesium canvas will be visible.