0

I have performed coding to the particular html file and it contain the code to access the wms layers from the Geoserver. However, when I run the html file, I am not able to see a clock view model and the timeline. Here is my code below.

<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Use correct character set. -->
  <meta charset="utf-8">
  <!-- Tell IE to use the latest, best version. -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
  <title>Blue Marble</title>
  <script src="../Build/Cesium/Cesium.js"></script>
 <style>
      @import url(../Build/Cesium/Widgets/widgets.css);
      html, body, #cesiumContainer {
          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
      }
  </style>
</head>
</head>
<body>
  <div id="cesiumContainer"></div>
  <script>

var widget = new Cesium.CesiumWidget('cesiumContainer', {
    clock: clock
});

var clock = new Cesium.Clock({
   startTime : Cesium.JulianDate.fromIso8601("2013-12-25"),
   currentTime : Cesium.JulianDate.fromIso8601("2013-12-25"),
   stopTime : Cesium.JulianDate.fromIso8601("2013-12-26"),
   clockRange : Cesium.ClockRange.LOOP_STOP,
   clockStep : Cesium.ClockStep.SYSTEM_CLOCK_MULTIPLIER
});
var url='http://localhost:8090/geoserver/geog4/wms'; 
var layers = widget.scene.globe.imageryLayers;
    layers.removeAll();
    layers.addImageryProvider(new Cesium.WebMapServiceImageryProvider({
        url : url,        
        layers: 'geog4:geotiff_coverage'
    }));
  </script>
</body>
</html>

enter image description here

Can you help me?

1 Answer 1

1

The CesiumWidget is only a container for the scene and its globe, it does not contain any other sub-widgets like the Animation or Timeline widgets.

Replace this code:

var widget = new Cesium.CesiumWidget('cesiumContainer', {
    clock: clock
});

With the Viewer instead:

var viewer = new Cesium.Viewer('cesiumContainer', {
    clock: clock
});

The Viewer widget contains a CesiumWidget, Animation, Timeline, and several other sub-widgets, along with a Cesium.DataSourceCollection and related logic to drive it. There are Viewer constructor options to disable any subwidgets that are not wanted.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.