Rectangle Rotation

CesiumJS
1

Hello,

I'm new to Cesium and just starting to learn a few things. I have come across two cases so far that I have been unable to figure out related to heading/rotation. I apologize in advance for my noob experience.

1. How can I set the default camera angle for the home location (for when the home button is pressed)?

I have set the default location with the following code, but I would like to set a specific rotation as well.

    var extent = Cesium.Rectangle.fromDegrees(west, south, east, north);
    Cesium.Camera.DEFAULT_VIEW_RECTANGLE = extent;
    Cesium.Camera.DEFAULT_VIEW_FACTOR = 0;

2. Similarly, I have added a single tile layer from an image to cover this rectangle, but this also requires the same rotation. How can I specify a rotation for this layer?

    layers.addImageryProvider(new Cesium.SingleTileImageryProvider({
      url: '/Content/Images/overlay.jpg',
      rectangle: Cesium.Camera.DEFAULT_VIEW_RECTANGLE
    }));
  
Thank you!

2

Nobody knows how to do either of these two things? They seem like they should be trivial features, but I have not found any documentation on how to do it and it is not part of the tutorials.

3

Cesium is a high volume list, while we try and answer every question; it can take a couple of days depending on the current traffic and nature of the question. Please don’t bump posts unless 3 or 4 days have gone by, otherwise it just adds more noise to an already active list.

As for your questions, 2 is definitely not supported yet with SingleTileImageryProvider, but you can do it with an Entity.rectangle (link goes to tutorial on using entities). Of course the drawback there is that entity rectangles don’t conform to terrain yet.

1 Is something that should be supported but looks like it currently isn’t. It might be easy to add for 1.8 (coming out on March 1st) but I can’t make any promises. I submitted an issue: https://github.com/AnalyticalGraphicsInc/cesium/issues/2599 A workaround would be to just override the private view command, similar to the below. This is technically using an unsupported API, but it’s unlikely to break or change anytime soon and once we add official support you can just switch to that. Just change the below flight to be whatever your desired home view is.

viewer.homeButton.viewModel._command = Cesium.createCommand(function() {

if (viewer.scene.mode === Cesium.SceneMode.MORPHING) {

return;

}

viewer.camera.flyTo({

destination : Cesium.Rectangle.fromDegrees(1, 0, 0, 1),

endTransform : Cesium.Matrix4.IDENTITY,

orientation : {

heading : Cesium.Math.toRadians(45.0),

pitch : Cesium.Math.toRadians(-35.0),

roll : 0.0

}

});

});

4

Thanks Matthew. I was able to get the home button to work (sortof). I still cannot figure out how to rotate the ground layer image. I was able to create a rectangle Entity instead of using SingleTileImageryProvider, however, it still does not rotate at the specified angle even when providing the 'rotation' property. The rotation property changes the bounds of the rectangle in some fashion, but the underlying image does not rotate.

Here is what I tried:

    var siteLayer = viewer.entities.add({
      name: 'Site Layer',
      rectangle: {
        coordinates: Cesium.Camera.DEFAULT_VIEW_RECTANGLE,
        material: 'Overlay.jpg',
        rotation: Cesium.Math.toRadians(45)
      }
    });

5

Sorry for never replying to this. Rectangle has both stRotation (for the image) and rotation (for the geometry). We should probably default to using rotation for both if stRotation isn’t set.