locked
stopPropagation or Deactivate panning RRS feed

  • Question

  • How do I stop event propagation to the base tile layer (the map)?  I want to draw on the map or prevent the map from listening to polygon clicks.

    Please follow these steps to setup the demo:

    1. Visit the Bing Maps V7 Interactive SDK
    2. Expand the Attach Map Events and run the Event click example
    3. Then run this custom code in the textarea

    function StartDragHandler(e) {
     // What code will stop propagation?  I want to temporarily disable the panning when dragging inside the blue rectangle
    }
    
    map.entities.clear(); 
    latlon = map.getCenter(); 
    
    var rectangle = new Microsoft.Maps.Polygon([new Microsoft.Maps.Location(latlon.latitude-1, latlon.longitude-1), new Microsoft.Maps.Location(latlon.latitude+1, latlon.longitude-1), new Microsoft.Maps.Location(latlon.latitude+1, latlon.longitude), new Microsoft.Maps.Location(latlon.latitude-1, latlon.longitude), new Microsoft.Maps.Location(latlon.latitude-1, latlon.longitude-1)], null); 
    
    
    Microsoft.Maps.Events.addHandler(rectangle, 'dragstart', StartDragHandler);
    //Microsoft.Maps.Events.addHandler(rectangle, 'drag', DragHandler);
    //Microsoft.Maps.Events.addHandler(rectangle, 'dragend', EndDragHandler);
    
    map.setView( {zoom:6}); 
    map.entities.push(rectangle);

    • Moved by Ricky_Brundritt Friday, March 16, 2012 6:49 PM (From:Bing Maps: Map Control and Web services Development)
    Friday, March 9, 2012 9:19 PM

Answers

  • This is one way to do it. Register for mousedown on the rectangle and then disable map panning. Register for mouseup on the map and then enable map panning:

    function HandleMouseDown(e) {
    map.setOptions({disablePanning:true});
    }
    
    function HandleMouseUp(e)
    {
      map.setOptions({disablePanning:false});
    }
    
    map.entities.clear(); 
    latlon = map.getCenter(); 
    
    var rectangle = new Microsoft.Maps.Polygon([new Microsoft.Maps.Location(latlon.latitude-1, latlon.longitude-1), new Microsoft.Maps.Location(latlon.latitude+1, latlon.longitude-1), new Microsoft.Maps.Location(latlon.latitude+1, latlon.longitude), new Microsoft.Maps.Location(latlon.latitude-1, latlon.longitude), new Microsoft.Maps.Location(latlon.latitude-1, latlon.longitude-1)], null); 
    
    Microsoft.Maps.Events.addHandler(rectangle, 'mousedown', HandleMouseDown);
    Microsoft.Maps.Events.addHandler(map, 'mouseup', HandleMouseUp);
    
    map.setView( {zoom:6}); 
    map.entities.push(rectangle);

    Saturday, March 10, 2012 1:47 AM