How can I change the color of a polygon on mouse hover in Cesium?

I need to make a polygon highlight on mouse hover and restore its color and appearance once the mouse is moved out of the polygon.

I tried this with ScreenSpaceEventType.MOUSE_MOVE event handler but I am not able to restore the appearance when mouse is moved out of polygon in this case.

I tried https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Apps/Sandcastle/gallery/Polygons.html (http://cesiumjs.org/Cesium/Apps/Sandcastle/gallery/polygons.html)

This file in Sancastle. It has inline comments like // For highlighting on mouseover in Sandcastle.

But it is not working as expected.

Is there any way in cesium to achieve this? or am I missing something?

Solution

Take a look at the "Picking" example in Sandcastle, and click on the button that says "Drill-down picking."

There are different ways to accomplish what you describe, but the above demo makes use of a Cesium CallbackProperty and provides a callback that will return either the polygon's normal color or the highlight color, depending on the "picked" status. Note that multiple overlapping polygons can be picked at the same time with this method.

The mouse move handler then just controls membership of the pickedEntities list, and the polygons choose appropriate colors for themselves based on their membership in that list.