明确声明“ movement”和“ movement.endPosition”？

Question

Cesium Sandcastle演示演示了如何使用“移动”和“ movement.endPosition”来获取鼠标移动的Cartesian2坐标。一个例子是"Picking" demo in Sandcastle：

我是Java语言的新手。到目前为止，隐式声明和可变吊装还不是我的最佳选择！

所以我的问题是：基于上面提供的Picking Sandcastle演示，出于显示鼠标悬停时经度/纬度的相同目的，我应该怎么做才能明确声明“ movement.endPosition”？我对未先明确声明的“运动”对象显示不满意。

[我的研究使我进入了Cesium.CameraEventAggregator对象，该对象包含一个名为“ currentMousePosition”的方法。

第25-27行来自演示：

    // Mouse over the globe to see the cartographic position
    handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
    handler.setInputAction(function(movement) {
        var cartesian = viewer.camera.pickEllipsoid(movement.endPosition, scene.globe.ellipsoid);

我尝试如下替换“ movement.endPosition”：

    // Mouse over the globe to see the cartographic position
    handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
    handler.setInputAction(function() {
        var mousePos = Cesium.CameraEventAggregator(scene.canvas); 
        var cartesian = viewer.camera.pickEllipsoid(mousePos.currentMousePosition, scene.globe.ellipsoid);

这将导致鼠标悬停时没有显示任何信息。

非常感谢您的帮助，在此先感谢您为冗长的问题说明致歉！曼尼

Answer 1

ScreenSpaceEventHandler侦听屏幕空间中发生的事件（即鼠标，触摸和指针事件）。当您调用.setInputAction时，您将分配一个您希望响应这些事件而调用的回调函数。

JavaScript允许将该函数声明为内联，这可能是造成混淆的一部分。在下面，我重构了此函数，以将此回调作为名为onMouseMove的真实函数进行了分解。

通过分解此函数，可以更清楚地看到movement被声明为要传递给onMouseMove回调函数的唯一参数。

// Declare entity first.
var entity = viewer.entities.add({
    label : {
        show : false,
        //...
    }
});

// Declare function "onMouseMove" that takes one argument called "movement".
// This could be declared above, but, it makes use of the entity, so for
// code readability it should appear after "entity" is declared.
function onMouseMove(movement) {
    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);

        // NOTE: Using "entity" from outer scope here.
        entity.position = cartesian;
        entity.label.show = true;
        entity.label.text = 'Lon: ' + ('   ' + longitudeString).slice(-7) + '\u00B0' + '\nLat: ' + ('   ' + latitudeString).slice(-7) + '\u00B0';
    } else {
        entity.label.show = false;
    }
}

// Construct a ScreenSpaceEventHandler.
handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);

// Finally, assign function "onMouseMove" as the callback for the event.
handler.setInputAction(onMouseMove, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
看看最后一行。如果用整个函数声明替换该行中的onMouseMove一词，则代码将与Sandcastle上的原始代码相同。

因此，movement是在ScreenSpaceEventHandler内部构造的对象，用于将事件传达给回调函数。在这种特定情况下，movement.endPosition是Cesium.Cartesian2对象的实例，其中x和y值表示鼠标移动的结果在屏幕空间中的位置。

viewer.camera.pickEllipsoid(...功能可以采用您要考虑的任何屏幕位置的任何Cesium.Cartesian2值。例如：

var myCustomScreenLocation = new Cesium.Cartesian2(300, 200);
var cartesian = viewer.camera.pickEllipsoid(myCustomScreenLocation, scene.globe.ellipsoid);
这将从Cesium窗口的左侧选择300像素，从Cesium窗口的顶部选择200像素。

---

编辑：这是another demo，显示如何显示当前的鼠标/触摸/指针坐标。

var viewer = new Cesium.Viewer('cesiumContainer');
var lastMousePosition;

var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);

handler.setInputAction(function(movement) {
    lastMousePosition = movement.endPosition;

    document.getElementById('toolbar').innerHTML =
        'Mouse X: ' + lastMousePosition.x + ' Y: ' + lastMousePosition.y;

}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);