Load 2D and 3D Layers in Cesium Clients – Skyline

Cesium clients can load mesh, point cloud, and imagery layers from SkylineGlobe Server using either Skyline's SGSProvider or Cesium API. Elevation layers can only be loaded via Skyline's SGSProvider.

In this article:

Loading Layers Using Skyline's SGSProvider
Loading Layers Using Cesium API

Loading Layers in Cesium Clients Using Skyline's SGSProvider

Cesium clients can load mesh, point cloud, imagery, and elevation layers from SkylineGlobe Server using Skyline's SGSProvider. SGSProvider is supported in Cesium 1.62 and above.

Mesh and point cloud layers – Exposed as 3D Tiles. Only the original data format is stored on the server.
Imagery layers – Served as WMS.
Elevation layers – Served via SGSTerrainProvider, SkylineGlobe Server's custom Cesium terrain provider.

Note: When a project is loaded, SkylineGlobe Server's custom terrain provider, “SGSTerrainProvider", overrides the Cesium terrainProvider set in the Cesium client project, and its MPT or TBP is set as the base terrain. If the loaded project also contains elevation layers or other elevation layers from a different project are loaded, the last elevation layer loaded is set as the base terrain. If you do not want a project's elevation layers to replace your base terrain, set the layerType only to layer types other than elevation, i.e., _LayerType.MESH, _LayerType.IMAGERY, or _LayerType.POINT_CLOUD or any combination of these. See below for more information.

To load your layers in a Cesium client using Skyline's SGSProvider:

Open .\SG\Resources, and copy the CesiumJS folder to your .\Cesium\Apps folder.
Add the SGSProvider.v2.js in your main HTML to start using the SGSProvider library.
```
<script src="CesiumJS/SGSProvider.v2.js" type="text/javascript"></script>
```
Connect to SGS using the SGSProvider.connect method. After the initial connection to SGS, there is no need to reconnect before loading additional layers.
```
SGSProvider.connect(URL, username, password)
```

The following connection options are available:

Connect as a guest user only to public layers, e.g.,

SGSProvider.connect("https://cloud.skylineglobe.com/SG");

Connect with a token, e.g.,

SGSProvider.connect("https://cloud.skylineglobe.com/SG/[TOKEN]”);

Connect with a user and password, e.g.,

SGSProvider.connect("https://cloud.skylineglobe.com/SG”, “Username", "Password");

Load layers in either of the following ways:
- Load all layers in a specific Cesium project -The layerType parameter can be left empty to load all supported layer types in the project, or a specific layer type can be passed to load only layers of that type. More than one layer type can be passed in a single call. The supported layer types are: _LayerType.MESH, _LayerType.POINT_CLOUD, _LayerType.IMAGERY, and _LayerType.ELEVATION.
```
SGSProvider.loadLayersFromProject(project, layerType)
```
  The following example loads all mesh and imagery layers in the SampleProject project:
  SGSProvider.loadLayersFromProject("SampleProject", [_LayerType.MESH, _LayerType.IMAGERY]);
- Load individual layers by ID, alias, or tag - Load individual layers by ID, alias, or tag. For loading by tag, set the resourceType to _ResourceType.TAG.
```
SGSProvider.loadLayers(resourceID, resourceType, layerType)
```

More about: Loading your layers in a Cesium client using Skyline's SGSProvider >

Loading Layers in Cesium Clients Using Cesium API

Cesium clients can load mesh, point cloud, and imagery layers from SkylineGlobe Server using Cesium API. SGS exposes 3DML mesh and point cloud data as 3D Tiles for access by Cesium clients, while storing only the original data format on the server. Imagery layers are served as WMS.

Loading 3DML Exposed as 3D Tiles in Cesium Clients

3D Tiles can be requested in different elevation reprojection methods and different formats.

Add a Cesium3DTileSet element:

const tileset = await Cesium.Cesium3DTileset.fromUrl(
"https://cloud.skylineglobe.com/sg/demos/b3dm/623979/tileset.json?vdatum=convert_z");

Use the following path format:

http://[ServerName]/sg/b3dm/[SGSID]/tileset.json

E.g. https://cloud.skylineglobe.com/sg/demos/b3dm/623979/tileset.json
Example:

var viewer = new Cesium.Viewer("cesiumContainer", {
  terrain: Cesium.Terrain.fromWorldTerrain(),
});
try {
  const tileset = await Cesium.Cesium3DTileset.fromUrl(
    "https://cloud.skylineglobe.com/sg/demos/b3dm/623979/tileset.json?vdatum=convert_z");
  viewer.scene.primitives.add(tileset);
  await tileset.readyPromise;
  viewer.camera.flyToBoundingSphere(tileset.boundingSphere);
} catch (error) {
  console.log(`Error loading tileset: ${error}`);
}

Note: You can also interactively browse, edit and run this code example in Cesium Sandcastle.

You can set the OGC 3D Tiles version to serve to all Cesium clients requesting 3D mesh layers exposed as 3D Tiles, by appending the 3D Tiles version (b3dmversion) query parameter to the end of your 3D Tile URL. Leave the parameter value empty to use the latest version. Use the following format:
```
b3dmversion=[version #]  
```
E.g. https://cloud.skylineglobe.com/sg/demos/b3dm/623979/tileset.json?b3dmversion=V0.2
Note: If a b3dmversion query parameter is not appended to the URL, the 3D Tiles version is determined by the Default 3D Tiles Version setting on the Settings page. More about: SkylineGlobe Server settings >
If you want to define how to handle the 3DML’s elevation values, append the vertical datum (vdatum) parameter to the end of your 3D Tile URL. The vdatum parameter can have either of the following values:
- convert_z: Reproject to ellipsoid (as required by the OGC 3D Tiles standard) for compatibility with terrain that uses true ellipsoid elevation.
- copy_z: Maintain elevation values as geoid, while declaring them as ellipsoid.
  Note: Most input coordinate systems and terrain data, including MPT, use geoid elevation values even though they are declared as ellipsoid when delivered to Cesium, and thus they are actually compatible without reprojection.

Use the following format: ?vdatum=[reprojection value: either copy_z. OR convert_z]
E.g. https://cloud.skylineglobe.com/sg/demos/b3dm/623979/tileset.json?b3dmversion=V0.2&vdatum=convert_z
OR https://cloud.skylineglobe.com/sg/demos/b3dm/Frederick/tileset.json?b3dmversion=V0.2&vdatum=convert_z
Note: You can also define the handling of 3DML's elevation values in SkylineGlobe Server Manager> Layer Properties > Description field by defining the vDatum value per layer, [vdatum=copy_z] or [vdatum=convert_z]. More about: Setting SkylineGlobe Server settings >

Loading Point Cloud Layers in Cesium Clients

To load your point cloud layer in a Cesium client using Cesium API:

Add a Cesium3DTileset element:

const tileset = await Cesium.Cesium3DTileset.fromUrl(
"https://cloud.skylineglobe.com/SG/demos/pnts/625698/tileset.json");

Use the following path format for the layer to load:
https://[ServerName]/sg/pnts/[LayerID]/tileset.json
E.g., https://cloud.skylineglobe.com/SG/demos/pnts/625698/tileset.json
Example:

var viewer = new Cesium.Viewer("cesiumContainer", {
terrain: Cesium.Terrain.fromWorldTerrain(),
});

try {
const tileset = await Cesium.Cesium3DTileset.fromUrl(
"https://cloud.skylineglobe.com/SG/demos/pnts/625698/tileset.json");
viewer.scene.primitives.add(tileset);
await tileset.readyPromise;
viewer.camera.flyToBoundingSphere(tileset.boundingSphere);
} catch (error) {
console.log(`Error loading tileset: ${error}`);
}

Note: You can also interactively browse, edit and run this code example in Cesium Sandcastle.

If you want to define how to handle the point cloud's elevation values, append the vertical datum (vdatum) parameter to the end of your 3D Tile URL. The vdatum parameter can have either of the following values:

Loading Imagery Layers in Cesium Clients

SGS serves imagery layers to Cesium viewers.

To load imagery data in a Cesium client using Cesium API:

Add a Cesium ImageryProvider

var imageryLayers = viewer.imageryLayers;
imageryLayers.addImageryProvider();

Create a new Cesium WebMapServiceImageryProvider
new Cesium.WebMapServiceImageryProvider({});
Example:

var viewer = new Cesium.Viewer("cesiumContainer");

var imageryLayers = viewer.imageryLayers;
Cesium.when(imageryLayers.addImageryProvider(
new Cesium.WebMapServiceImageryProvider({
   url: "https://cloud.skylineglobe.com/SG/Demos/Streamer.ashx",
   layers: "Caterpillar_Ortho3cm.ii.625696",
rectangle: Cesium.Rectangle.fromDegrees(34.802926, 32.00390508, 34.80433044, 32.00496881),
   parameters: {
     transparent: true,
     format: "image/png",   
},
  })), viewer.camera.flyTo({destination: new Cesium.Rectangle.fromDegrees(34.80294,32.00508, 34.80433, 32.00401)}));

Notes:

You can also interactively browse, edit and run this code example in Cesium Sandcastle.
The 3D Tiles version is determined by the Default 3D Tiles Version setting on the Settings page unless it is explicitly defined by a 3DML’s b3dmversion tag (see below). More about: Setting SkylineGlobe Server settings >
The connection to SkylineGlobe Server is a Guest connection, so only publicly shared layers, i.e., layers whose permission level was set to "Everyone", can be loaded. More about: Granting edit or view access >
Elevation layers can be loaded using Skyline's SGSProvider. More about: Loading layers in Cesium clients using Skyline's SGSProvider

More about: Loading layers in Cesium clients using Cesium API >

Loading Layers in Cesium Clients Using Skyline's SGSProvider

Loading Layers in Cesium Clients Using Cesium API

Loading 3DML Exposed as 3D Tiles in Cesium Clients

Loading Point Cloud Layers in Cesium Clients

Loading Imagery Layers in Cesium Clients

Related articles