Map Context Menu
The Service manages a singleton context menu over the map. The Service allows opening angular components and anchoring to the map.
my-context-menu-layer.component.ts
1
constructor(private contextMenuService: ContextMenuService,
2
private mapEventsManager: MapEventsManagerService,
3
private coordinateConverter: CoordinateConverter) {
4
}
5
6
ngOnInit() {
7
this.mapEventsManager
8
.register({ event: CesiumEvent.RIGHT_CLICK, pick: PickOptions.NO_PICK })
9
.subscribe(event => {
10
const position = this.coordinateConverter.screenToCartesian3(event.movement.endPosition);
11
if (!position) {
12
return;
13
}
14
15
this.contextMenuService.open<ContextMenuData>(
16
MyCustomContextMenuComponent,
17
position,
18
{
19
data: {
20
item: {name: 'Cool name'},
21
onActionClick: () => {
22
console.log('do action');
23
this.contextMenuService.close();
24
}
25
}
26
}
27
);
28
});
29
}
Copied!
Tip: It should be initialised withMapEventsManager.e.g: open a menu component on every right click on the map.
  • open<D>(contentComponent, position: Cartesian3, option: ContextMenuOptions<D>)
Open's an angular component and anchor it to the given position.
  • close()
Remove any opened components.
Copy link