Picking near Earth sphere border returns pickIds equal to 255, 65535 which is being misinterpreted as object pick

[rutsky]

Take a look at the following example:

Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(-40, -40, 40, 40);

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

var scene = viewer.scene;
var handler;

var i;
for (i = 0; i != 255; ++i) {
    viewer.entities.add({
        id: 'obj_' + i,
        /*
        polyline: {
            positions: Cesium.Cartesian3.fromDegreesArray(
                [Math.random() * 10, Math.random() * 10, Math.random() * 10, Math.random() * 10]),
            followSurface: false,
            material: Cesium.Color.RED,
          },
        */
        point: {
            color: Cesium.Color.RED
        },
        position: Cesium.Cartesian3.fromDegrees(Math.random() * 10, Math.random() * 10)
    });
}

handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
handler.setInputAction(function(movement) {
    var pickedObject = scene.pick(movement.endPosition);
    if (Cesium.defined(pickedObject)) {
        var cartesian = viewer.camera.pickEllipsoid(movement.endPosition, scene.globe.ellipsoid);
        if (cartesian) {
            var cartographic = Cesium.Cartographic.fromCartesian(cartesian);
            var longitudeString = Cesium.Math.toDegrees(cartographic.longitude).toFixed(2);
            var latitudeString = Cesium.Math.toDegrees(cartographic.latitude).toFixed(2);
            
            console.log(pickedObject.id._id + ' ' + movement.endPosition + ' (' + longitudeString + ', ' + latitudeString + ')');
        } else {
            console.log(pickedObject.id._id + ' ' + movement.endPosition);
        }
    }
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

It displays points in [0, 10]x[0, 10] degrees square and on mouse move tries to pick entity under mouse cursor --- if there is any, outputs mouse coordinates in the log.

Since all points in [0, 10]x[0, 10] degrees square it is expected that points will be picked only in it, which is not the case --- if I move mouse near Earth sphere border I get some points selected:

(notice that last two columns in the log are selected point coordinates, and they are far outside [0, 10]x[0, 10] degrees square).

Same issue with polylines entities picking (and probably other entities types).

If I reduce number of entities to 253 or less I can't reproduce this issue.

Tested in CesiumJS 1.28 in Firefox Developer Edition 52.0a2 and Chromium 55.0.2883.87 on Ubuntu 16.04 with NVidia GTX 980 with NVidia proprietary drivers 367.57.

[rutsky]

Setting skyAtmosphere to false during Viewer construction fixes this issue, so I think it's Sky who handles picking incorrectly.

[rutsky]

I added debug logging to Context.getObjectByPickColor and see that with SkyAtmosphere enabled points near Earth sphere edge returns color 255, closer to center color 65535.
This is being interpreted as selecting object with pickId 255 (or 65535 is case of many objects on scene).

This also explains behavior in #4784 bug: hiding of mispicked item doesn't do anything and Cesium in infinite loop tries to hide object with pickId 255 and repick.

[pjcozzi]

Thanks for narrowing this down, @rutsky!

If you have the time, we would welcome a pull request with the fix (sounds like just don't render the sky atmosphere - and perhaps sky box - during the pick pass in Scene.js).

[rutsky]

@pjcozzi done, please review: #4790

[pjcozzi]

Thanks again for the fix, @rutsky. I made a small tweak to also not render the sun, moon, and sky box and merged everything in #4806 since I could not commit to your branch (could have been an issue on my end).