cesiumjs-interaction

Handle clicks, hovers, and drags on CesiumJS scenes via ScreenSpaceEventHandler and picking APIs.

112|16|Updated Mar 31, 2026
One-click install
npx skills add https://github.com/CesiumGS/cesiumjs-skills --skill cesiumjs-interaction
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cesiumjs-interaction
Source: https://github.com/CesiumGS/cesiumjs-skills/tree/main/skills/cesiumjs-interaction
Command: npx skills add https://github.com/CesiumGS/cesiumjs-skills --skill cesiumjs-interaction

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Enable interactive user input handling on CesiumJS scenes, including clicking, hovering, and dragging to select or manipulate entities and 3D tiles.

Core Features & Use Cases

  • ScreenSpaceEventHandler integration for mouse, touch, and pointer events on the Cesium canvas.
  • Scene picking capabilities (pick, pickAsync, drillPick, pickPosition) to identify entities, tiles, and primitives, with hover and selection patterns.
  • Drag-based interactions and interactive feedback to build responsive, map-based user interfaces.

Quick Start

Instantiate a ScreenSpaceEventHandler on the viewer canvas and register a LEFT_CLICK action to log the clicked position.

Frequently Asked Questions about cesiumjs-interaction

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle mouse clicks and hovers on a CesiumJS scene?

Handle mouse clicks and hovers on a CesiumJS scene by using ScreenSpaceEventHandler to register input events on the viewer canvas, combined with scene picking APIs to identify interacted entities.

What is the difference between pick, drillPick, and pickPosition in CesiumJS?

In CesiumJS, pick identifies the topmost object at a screen position, drillPick retrieves all objects at that position, and pickPosition converts the screen coordinates to exact world coordinates for precise interaction.

How do I select and drag 3D Tiles and entities in CesiumJS?

To select and drag 3D Tiles and entities in CesiumJS, attach a ScreenSpaceEventHandler to monitor mouse movement and click events, then apply drag-based interaction patterns using the picking APIs to manipulate the selected objects.

Does CesiumJS ScreenSpaceEventHandler support touch and pointer events for mobile scenes?

Yes, ScreenSpaceEventHandler supports touch and pointer events on the Cesium canvas, enabling interactive user input for mobile scenes. It integrates with picking APIs to identify entities, terrain, and 3D Tiles during mobile interactions.

Can I use pickAsync to identify terrain and 3D Tiles in CesiumJS v1.139?

Yes, you can use pickAsync in CesiumJS v1.139 ES module workflows to asynchronously identify terrain and 3D Tiles. It works alongside pick, drillPick, and pickPosition for responsive scene interaction and feature inspection.

Why is my CesiumJS scene picking returning undefined during hover events?

Scene picking returns undefined during hover events when no entity or tile exists at the picked screen position. Ensure the ScreenSpaceEventHandler is attached to the viewer canvas and the picking API correctly targets the interacted scene objects.