I need to subset terrain in Cesium and make the output exportable in any of the common formats like WRL, OBJ etc. I have found one such example here.

I have been searching the web for days but couldn't find a way to accomplish the task. I am able to draw a rectangle in cesium but how can I use that rectangle to extract 3D model as shown in the given example above. Here is my code taken from https://gist.github.com/theplatapi/0a7d789afc8028a3c20b and slightly modified.

<!DOCTYPE html>
<html lang="en">
  <!-- 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>Hello World!</title>
  <script src="../Build/Cesium/Cesium.js"></script>
      @import url(../Build/Cesium/Widgets/widgets.css);
      html, body, #cesiumContainer {
          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
  <div id="cesiumContainer"></div>
    var viewer = new Cesium.Viewer('cesiumContainer', {
      targetFrameRate: 60,
      homeButton: false,
      sceneModePicker: false,
      navigationHelpButton: false,
      baseLayerPicker: false,
      clock: new Cesium.Clock({
        startTime: Cesium.JulianDate.fromIso8601('1880-01-01'),
        currentTime: Cesium.JulianDate.fromIso8601('1880-01-01'),
        stopTime: Cesium.JulianDate.fromIso8601("2013-12-01"),
        clockRange: Cesium.ClockRange.CLAMPED,
        canAnimate: false,
        shouldAnimate: false,
        multiplier: 31622400 //Fast forward 1 year a second
      imageryProvider: new Cesium.ArcGisMapServerImageryProvider({
        url: '//services.arcgisonline.com/ArcGIS/rest/services/ESRI_Imagery_World_2D/MapServer',
        enablePickFeatures: false
      //Saves GPU memory
      scene3DOnly: true,
      automaticallyTrackDataSourceClocks: false
    var terrainProvider = new Cesium.CesiumTerrainProvider({
    url : '//assets.agi.com/stk-terrain/world'
    viewer.terrainProvider = terrainProvider;
    viewer.scene.debugShowFramesPerSecond = true;
    viewer.scene.screenSpaceCameraController.enableTranslate = false;
    viewer.scene.screenSpaceCameraController.enableTilt = true;
    viewer.scene.screenSpaceCameraController.enableLook = false;
    viewer.scene.screenSpaceCameraController.enableCollisionDetection = true;
    viewer.imageryLayers.get(0).brightness = 0.7;

    var selector;
    var rectangleSelector = new Cesium.Rectangle();
    var screenSpaceEventHandler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
    var cartesian = new Cesium.Cartesian3();
    var tempCartographic = new Cesium.Cartographic();
    var center = new Cesium.Cartographic();
    var firstPoint = new Cesium.Cartographic();
    var firstPointSet = false;
    var mouseDown = false;
    var camera = viewer.camera;

    //Draw the selector while the user drags the mouse while holding shift
    screenSpaceEventHandler.setInputAction(function drawSelector(movement) {
      if (!mouseDown) {

      cartesian = camera.pickEllipsoid(movement.endPosition, viewer.scene.globe.ellipsoid, cartesian);

      if (cartesian) {
        //mouse cartographic
        tempCartographic = Cesium.Cartographic.fromCartesian(cartesian, Cesium.Ellipsoid.WGS84, tempCartographic);

        if (!firstPointSet) {
          Cesium.Cartographic.clone(tempCartographic, firstPoint);
          firstPointSet = true;
        else {
          rectangleSelector.east = Math.max(tempCartographic.longitude, firstPoint.longitude);
          rectangleSelector.west = Math.min(tempCartographic.longitude, firstPoint.longitude);
          rectangleSelector.north = Math.max(tempCartographic.latitude, firstPoint.latitude);
          rectangleSelector.south = Math.min(tempCartographic.latitude, firstPoint.latitude);
          selector.show = true;
    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE, Cesium.KeyboardEventModifier.SHIFT);

    var getSelectorLocation = new Cesium.CallbackProperty(function getSelectorLocation(time, result) {
        return Cesium.Rectangle.clone(rectangleSelector, result);
      }, false);

      screenSpaceEventHandler.setInputAction(function startClickShift() {
        mouseDown = true;
        selector.rectangle.coordinates = getSelectorLocation;
      }, Cesium.ScreenSpaceEventType.LEFT_DOWN, Cesium.KeyboardEventModifier.SHIFT);

      screenSpaceEventHandler.setInputAction(function endClickShift() {
        mouseDown = false;
        firstPointSet = false;
        selector.rectangle.coordinates = rectangleSelector;
      }, Cesium.ScreenSpaceEventType.LEFT_UP, Cesium.KeyboardEventModifier.SHIFT);

    //Hide the selector by clicking anywhere
    screenSpaceEventHandler.setInputAction(function hideSelector() {
      selector.show = false;
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

    selector = viewer.entities.add({
      selectable: false,
      show: false,
      rectangle: {
        coordinates: getSelectorLocation,
        material: Cesium.Color.BLACK.withAlpha(0.5)

  • This question is too broad for this site, but I'll point out an additional problem: Cesium doesn't use a single 3D model for a region of terrain, as such a model would be too large to fit in memory all at once. Instead, Cesium uses a hierarchy of models of different sizes and resolutions, selecting appropriate tiles based on camera location and field of view, and streams only what it needs for that view from the server. See QuantizedMesh and 3D Tiles. – emackey Oct 9 '17 at 17:29
  • I have rephrased/changed my question. Please let me know if it's not very specific and concise even now. – Badar Munir Oct 10 '17 at 8:51
  • Thank you @emackey for your answer. I have provided a working example now for what I want to achieve. Sorry for the ambiguous question before. – Badar Munir Oct 10 '17 at 8:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.