cesium 绘制多边形并拾取
时间: 2025-06-20 12:36:06 浏览: 20
### 使用 Cesium 绘制多边形并实现拾取功能
在 Cesium 中绘制多边形可以通过 `viewer.entities.add` 方法来完成。为了使多边形支持拾取功能,可以利用 `Cesium.ScreenSpaceEventHandler` 来监听鼠标事件,并通过 `scene.pick` 函数获取选中的实体。
#### 创建多边形实体
创建一个多边形实体时,需指定其位置集合 (`hierarchy`) 和材质属性 (`material`) 等参数[^1]:
```javascript
let viewer = new Cesium.Viewer('cesiumContainer');
// 定义多边形顶点坐标数组
const positions = Cesium.Cartesian3.fromDegreesArray([
105.0, 40.0,
115.0, 40.0,
115.0, 35.0,
105.0, 35.0]);
// 添加面几何对象到场景中
viewer.entities.add({
name : '面几何对象',
polygon : {
hierarchy : new Cesium.PolygonHierarchy(positions),
material : Cesium.Color.BLUE.withAlpha(0.5), // 设置颜色透明度
perPositionHeight : true // 是否跟随地形高度变化
}
});
```
#### 实现拾取功能
要让程序能够响应用户的点击操作并对特定的多边形作出反应,则需要设置相应的事件处理器[^2]:
```javascript
// 初始化屏幕空间事件处理句柄
var handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas);
handler.setInputAction(function(movement) {
var pickedObject = viewer.scene.pick(movement.position);
if (Cesium.defined(pickedObject)) {
console.log(`Pick entity named ${pickedObject.id.name}`);
// 更改被选中物体的颜色作为反馈
pickedObject.color = Cesium.Color.RED;
} else {
console.log('No entities were picked');
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
```
上述代码片段展示了如何定义一个多边形以及怎样添加基本的交互逻辑——当用户单击某个区域内的时候会触发相应动作,在控制台打印出所选取的对象名称并将该图形变为红色表示已被激活状态。
阅读全文
相关推荐

















