2

I am creating a map using the following code:

map = new OpenLayers.Map({
    div: "map"
});

Then I load in a geojson polygon layer and add two controls

var highlightCtrl = new OpenLayers.Control.SelectFeature(geojson_layer, {
    hover: true,
    highlightOnly: true,       
    renderIntent: "temporary",
    eventListeners: {
                beforefeaturehighlighted: unreport,
                featurehighlighted: report,
                featureunhighlighted: unreport
            }
}); 

selectCtrl = new OpenLayers.Control.SelectFeature(geojson_layer,
    {clickout: true , 
     renderIntent: "select",
     onSelect: selected, 
     onUnselect: function(e){console.log('unselected)}
});    

map.addControl(highlightCtrl);
map.addControl(selectCtrl);    

highlightCtrl.activate();
selectCtrl.activate();  

This layer covers the entire map div, and now I can no longer pan the map. Is there a way that I can enable panning when I have a layer with controls that cover the basemap?

2

Andreas Hocevar has created an OpenLayers branch (currently in the pull-request queue) that solves this problem.

Rather than using the SelectFeature control, the branch enables the employment of event listeners that do not get in the way of other event intentions such as panning the map while inside one of your vector layers.

Your code may look something more like the following:

map = new OpenLayers.Map({
  div: "map",
  eventListeners: {
    featureover: function(e) {
      //behavior for hover events
    },
    featureout: function(e) {
      //behavior for mouse out events
    },                    
    featureclick: function(e) {
      //behavior for click events
    }
  }
});

var layer_style = new OpenLayers.StyleMap( {
  'default': OpenLayers.Util.applyDefaults(
    { fillColor: '#993333' } //normal (un-selected) appearance
  ),
  'select': OpenLayers.Util.applyDefaults(
    { fillColor: '#cc3333' } //hover/click appearance
  )
});

var geojson_layer = new OpenLayers.Layer.Vector(
  "my_vector_layer", 
  {
    isBaseLayer: false, 
    styleMap: layer_style
    //additional settings you are using to create your geojson layer...
  }
);

map.addLayers([geojson_layer]);

I've also created an example recently that demonstrates the use of this branch/strategy.

Hope that helps.

  • Thanks for the idea. It does help, but I was not able to get the branch version working with the other parts of the library. – djq Nov 13 '12 at 14:47

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.