The type of the top feature being interacted with
The event's primary target feature, positioned on top of any overlapping features.
The geographic coordinates where the event occurred
The features at the event coordinates, scoped to the module whose handler fired.
The source and layer configuration to which the topFeature belongs
The SDK calls it when a user interacts with features on the map, for example on click or hover. It receives the feature, the event location and all features at the event coordinates.
In GeoJSON modules (places, routes, geometries), topFeature is the original feature you passed
to show(). In vector tile modules (POIs, traffic), topFeature comes from MapLibre's internal
feature representation.
Depending on MapEventsConfig.precisionMode, the lngLat coordinates may be near the feature
rather than exactly on it.
allEventFeatures holds the module's features at the event coordinates, each once even when
drawn across several layers or tiles, in the same shape as topFeature, which is the first.
To inspect every feature there across all modules, including the base map, project lngLat to
a pixel and call map.mapLibreMap.queryRenderedFeatures around it.
Click handler for route features:
routingModule.events.mainLines.on('click', (route, lngLat, allFeatures, source) => {
console.log('Clicked route:', route.properties.index);
console.log('At coordinates:', lngLat);
console.log('Total features at location:', allFeatures.length);
});
Hover handler for places with feature inspection:
placesModule.events.on('hover', (place, lngLat, allFeatures, source) => {
// Show tooltip with place information
showTooltip({
title: place.properties.poi?.name,
address: place.properties.address.freeformAddress,
coordinates: lngLat
});
// Check for overlapping features
if (allFeatures.length > 1) {
console.log(`${allFeatures.length} features at this location`);
}
});
UserEvents.on - For registering event handlers
Handler function for user interaction events on map features.