0

I'm looking for a way to suppress a map click event if some other event has already happened. The application I have created has two primary functions:

  1. Click on marker (park points) --> Brings up information about the park you clicked on OR
  2. Click on the map (outside of a marker) --> Clears the map of all information and graphics and runs a query for parks within the area and spits out a list

Here's what I've got:

var hover_toggle = false;  

...  

// Map event handlers  
click_event = map.on("click", function(evt){  
  if (hover_toggle == false) {  
     var point = evt.mapPoint;  
     var graphic = evt.graphic;  
     parkQuery(point, graphic);  
  }  
});  

// Marker event handlers  
parks.on("mouse-over", function(evt){  
    map.setMapCursor("pointer");  
    hover_toggle = true;  
});  
parks.on("mouse-out", function(evt){  
    map.setMapCursor("default");  
    hover_toggle = false; });  
parks.on("click", function(evt){  
    var park_point = evt.graphic;  
    parkZoom(park_point)  
});  

...  

This has it so that whenever a user is hovered over a marker, the hover_toggle makes it so the map.on("click") event is suppressed. However, this doesn't always work... sometimes the marker event fires (it seems to always happen first), and then the map event fires and clears the information the user brings up.

Any ideas on how to suppress or disconnect/connect the map.on("click") event if the marker event is fired at the same time?

  • This is a roundabout way but you could check if that element is visible/exists, and if it is prevent the other action from doing anything – djq Aug 31 '15 at 21:51
1

If you add your park points as a featureLayer, the behaviour you're looking for should be fairly easy to configure. You won't need to suppress any events or maintain the toggle state in a variable.

Eg, see this featureLayer sample and note that the infoWindow is shown when you click on a feature, with no further coding required - you don't need to set the click event on the featureLayer, as this is implicit. You might still want to set the mouse-over event to change the cursor when hovering on the park point.

You could then configure the map's click event without needing the hover-toggle variable, as this is now redundant.

map.on("click", function(evt){  
   var point = evt.mapPoint;  
   var graphic = evt.graphic;  
   parkQuery(point, graphic);  
});

The JS API detects the difference between a click on a park point, and a click on the map and runs the appropriate action (either opens the park's infoWindow, or runs the parkQuery function at the location clicked).

  • Stephen, I thought this issue was solved, but it turns out that I'm still getting conflicts between the map click event and the feature layer click event. The API does not seem to detect the difference between the two. Is there somewhere in the documentation that confirms this? – Duncan Rager Oct 1 '15 at 12:39
  • Hmm that's a good question. It might be worth putting together some sample code in JS Fiddle and posting a separate stand-alone question about how the map distinguishes between a click on a feature vs a click on the map. – Stephen Lead Oct 2 '15 at 4:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.