Search code examples
here-api

What events can be used in Here Maps JS?

I look for documentation for here maps js, which is poor, but I can't find any pieces of information which events can be used for which "object". I faced two problems when I want to add an events listeners on DomIcon and others on cluster provider (H.clustering.Provider).

There are events which I used (element can be H.map.DomIcon or H.clustering.Provider):

element.addEventListener('pointermove', this.invokeEvent); <-- working for cluster Provider
element.addEventListener('pointerdown', this.invokeEvent);
element.addEventListener('mousedown', this.invokeEvent);
element.addEventListener('touchstart', this.invokeEvent);
element.addEventListener('mouseup', this.invokeEvent);
element.addEventListener('touchend', this.invokeEvent);
element.addEventListener('pointerup', this.invokeEvent);
element.addEventListener('mouseenter', this.invokeEvent);
element.addEventListener('touchenter', this.invokeEvent);
element.addEventListener('pointerenter', this.invokeEvent);
element.addEventListener('mouseleave', this.invokeEvent);
element.addEventListener('touchleave', this.invokeEvent);
element.addEventListener('pointerleave', this.invokeEvent);
element.addEventListener('pointercancel', this.invokeEvent);
element.addEventListener('touchcancel', this.invokeEvent);
element.addEventListener('mouseover', this.invokeEvent); <-- working for dom icon 
element.addEventListener('mouseout', this.invokeEvent); <-- working for dom icon 
element.addEventListener('tap', this.invokeEvent); <-- working for dom icon and cluster provider

I don't know where to look for docs or probably I'm doing something wrong? The most important for me is to find event which listen to mouseover and mouseout for H.clustering.Provider

Solution

  • Read please documentation for map object events :

    MapEvents enables the events functionality on the map and on map objects. The class makes it possible to listen to events on map objects such as markers, polylines, polygons, circles and on the map object itself. Events are triggered by user interaction, for example clicking or tapping on the map. Please check the Events Summary section for the list of events fired by this class and by the map objects.

    The events what you looking for are pointerenter and pointerleave

    Example:

    // prerequisites: mapInstance and marker is initialized
mapInstance.addObject(marker);
var mapevts = new H.mapevents.MapEvents(mapInstance);
// add listener to map
mapInstance.addEventListener('pointermove', function(e) {...});
// add listener to the marker
marker.addEventListener('pointerenter', function(e) {...});
marker.addEventListener('pointerleave', function(e) {...});

    Please add listener to Marker, DomMarker and etc., don't to Icon or DomIcon. Sometimes is useful to add map objects to some H.map.Goup and after that add listener only for this Group once then it should work for all map objects in this group.

    You are right it is possible to add the same events listeners also to objects that based on H.map.provider e.g. cluster Provider, but it seems this possibility was not documented yet.