Search code examples
openlayers-5

OL5 How to enable box/polygon selection by clicking inside area not just on lines?


I upgraded from OL4 to OL5 and now to select a polygon I must click exclusively on the border, whereas before I could click anywhere inside the polygon. For circles I can still click anywhere within the circle to select it. This is confusing our end users, and they think that selecting objects is no longer working. Is this intentional in the upgrade? If so, how can I make a polygon selectable by clicking anywhere inside its area?

I have not been able to find any references online to this issue yet.


Solution

  • This https://github.com/openlayers/openlayers/pull/7750 is referenced in the upgrade notes for version 5.0.0.

    If you are using a style without a fill in OL4, for example

        style: new ol.style.Style({
          stroke: new ol.style.Stroke({
            color: '#3399CC',
            width: 1.25
          })
        })
    

    you will need add a transparent fill for OL5:

        style: new ol.style.Style({
          stroke: new ol.style.Stroke({
            color: '#3399CC',
            width: 1.25
          }),
          fill: new ol.style.Fill({
            color: 'transparent'
          })
        })