The type of the top feature being interacted with
The primary target feature for the event, 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 and de-duplicated (a feature drawn across multiple layers or tiles appears once). Entries from GeoJSON-backed modules (places, routes, geometries) are the original typed Feature you passed to show(), with un-stringified properties (nested objects, Dates, arrays); entries from vector-tile modules (POIs, traffic) are the underlying MapGeoJSONFeature (which extends Feature). The first entry is the same feature as topFeature — though for modules with a mapping callback, topFeature is the mapped shape while this entry stays raw. To inspect every feature at the point across all modules — including the base map, with .source/.layer intact — query MapLibre directly (note lngLat is geographic, so project it to a pixel first): const p = map.mapLibreMap.project(lngLat); const all = map.mapLibreMap.queryRenderedFeatures([[p.x - 5, p.y + 5], [p.x + 5, p.y - 5]]);
The source and layer configuration to which the topFeature belongs
Called when a user interacts with features on the map (e.g., click, hover). Provides detailed information about the interacted feature, its location, and all features at the event coordinates.
Feature Type Mapping:
topFeature is the original feature passed to the show() methodtopFeature is derived from MapLibre's internal feature representationEvent Precision:
lngLat coordinates may be near but not exactly on the feature, depending on the precision modeMapEventsConfig.precisionModeClick handler for route features:
routingModule.on('click', (route, lngLat, allFeatures, source) => {
console.log('Clicked route:', route.properties.id);
console.log('At coordinates:', lngLat);
console.log('Total features at location:', allFeatures.length);
});
Hover handler for places with feature inspection:
placesModule.on('mousemove', (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.