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

时间:2019-11-21 08:04:19

标签: javascript cesium

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

我是Java的新手。 到目前为止,隐式声明和可变吊装还不是我的杯水!

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

我的研究使我想到了Cesium.CameraEventAggregator对象,该对象包含一个名为“ currentMousePosition”的方法。

第25-27行来自演示:

string text = ((ListBoxItem)lbMozik.SelectedItem).Content.ToString();
MessageBox.Show(text2);

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

    // 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);

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

任何帮助将不胜感激,在此先感谢您为冗长的问题陈述致歉! 曼尼

1 个答案:

答案 0 :(得分: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.endPositionCesium.Cartesian2对象的实例,其中xy的值表示鼠标移动在屏幕空间中的位置。

viewer.camera.pickEllipsoid(...函数可以采用您希望考虑的任何屏幕位置的任何Cesium.Cartesian2值。例如:

var myCustomScreenLocation = new Cesium.Cartesian2(300, 200);
var cartesian = viewer.camera.pickEllipsoid(myCustomScreenLocation, scene.globe.ellipsoid);

这将从Cesium窗口的左侧向左300像素,从顶部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);