Resizing a polygon on MOUSE_MOVE is laggy

1. A concise explanation of the problem you’re experiencing.

My app uses the mouse to drag and drop a selection area over a cesium map. Right now, it’s dynamically resizing an unfilled polygon every time the mouse moves, but this looks laggy in the UI unless I use setTimeout to give a 100ms dead period between resizing the box, at which point it’s less laggy but looks jittery. Is there a way to make a drag and drop selection box in cesium that’s smooth?

2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.

// Mouse is already down at this point

const color = new Cesium.ColorMaterialProperty(new Cesium.Color(1, 0, 0, 0.2));

// Instantiate the entity

this.selection = this.viewer.entities.add({

polygon: {

fill: false,

outline: true,

outlineColor: color,

material : color



// Bind this.moveSelection to mouse move

this.area_select_handler.setInputAction(this.moveSelection.bind(this), Cesium.ScreenSpaceEventType.MOUSE_MOVE);

this.ready = true;

this.moveSelection = function(movement) {

// Pick Ellipsoid

this.end_pos = Cesium.Cartographic.fromCartesian(this.pickEllipsoid(movement.endPosition), this.viewer.scene.globe.ellipsoid);

this.selection.polygon.hierarchy = new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromRadiansArray([this.start_pos.longitude, this.start_pos.latitude,

this.end_pos.longitude, this.start_pos.latitude,

this.end_pos.longitude, this.end_pos.latitude,

this.start_pos.longitude, this.end_pos.latitude]



3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

To make a smooth drag and drop box to select an area in my cesium viewer

4. The Cesium version you’re using, your operating system and browser.

Cesium 1.29. The operating system that hosts our cesium application is Linux Debian 3.16. We mostly use chrome to use the app because firefox and safari end up being too laggy for us.


Instead of modifying the underlying primitive, I would suggest using a CallbackProperty for the polygon positions. Under the hood, we create a “dynamic” rather than “static” geometry which should help your performance issues.