Cesium07-事件处理之键盘事件

最新推荐文章于 2025-07-29 01:46:31 发布

原创最新推荐文章于 2025-07-29 01:46:31 发布 · 751 阅读

11 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #开发语言

本文详细介绍了如何在Cesium库中使用ScreenSpaceEventHandler处理Shift、Ctrl和Alt键的键盘事件，包括事件监听、事件触发和延迟删除事件的示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一：基本概念

键盘事件属于屏幕空间事件处理程序的一种，其不能单独使用，需要配合鼠标事件一起使用。

二：shift事件

        /* shift事件 */
        var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        handler.setInputAction((event) => {
            console.log(event, '--event');
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.SHIFT)
        /*        
                输出结果
                    {
                        "position": {
                            "x": 303.20001220703125,
                            "y": 295.8000183105469
                    }
                } 
        */
        /* 删除 shift事件 2s后删除事件*/
        setTimeout(() => {
            handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.SHIFT)
        }, 2000)

三：CTRL事件

        /* ctrl事件 */
        var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        handler.setInputAction((event) => {
            console.log(event, '--event');
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.CTRL)
        //输出结果之一
        const result = {
            "position": {
                "x": 332,
                "y": 322.20001220703125
            }
        }
        /* 删除 ctrl事件 2s后删除事件*/
        setTimeout(() => {
            handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.CTRL)
        }, 2000)

四：ALT事件

        /* alt事件 */
        var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        handler.setInputAction((event) => {
            console.log(event, '--event');
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.ALT)
        //输出结果之一
        const result = {
            "position": {
                "x": 315.20001220703125,
                "y": 304.6000061035156
            }
        }
        /* 删除 alt事件 2s后删除事件*/
        setTimeout(() => {
            handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK, Cesium.KeyboardEventModifier.ALT)
        }, 2000)