OpenLayers ol-overlaycontainer-stopevent div, блокирующий ввод холста

Question

Я создал очень простую c карту с OpenLayers внутри метода componentDidMount реагирующего компонента:

var tileSource = new source.XYZ({ url: "http://localhost:5000/Tiles/GetTile/{x}/{y}/{z}", minZoom:5, maxZoom: 18 });
var tileLayer = new TileLayer({ source: tileSource });

var options = { controls: [] };

//initialise and populate the map
this.Map = new Map(options);

this.Map.addLayer(tileLayer);
this.Map.setView(new View({ center: [-28.613, 25.225], zoom: 5, minZoom:5, maxZoom: 18 }));
this.Map.setTarget(this.MapDiv);

В моем событии рендеринга у меня есть целевой элемент для карты OpenLayers:

return (
        <div style={{ height: "100%" }}>
            <div className="openlayers-map" ref={(el)=> this.MapDiv = el}></div>
        </div>
    )

Это работает достаточно хорошо, и карта отображается хорошо, но ни один из входов (панорамирование, масштабирование и т. Д. c) с помощью мыши не работает, и карта зафиксирована на месте. Я немного покопался и обнаружил, что этот элемент

<div class="ol-overlaycontainer-stopevent" style="position: absolute; z-index: 0; width: 100%; height: 100%;"></div>

потребляет все события ввода мыши. Если я принудительно удаляю элемент с помощью инспектора браузера, я возвращаю себе контроль над картой, и панорамирование и масштабирование снова начинают работать.

Насколько я понимаю, он используется для наложений (полагаю, чтобы предотвратить взаимодействие с наложение, чтобы повлиять на карту). Но я не добавил на карту никаких наложений, похоже, ее там не должно быть.

Кто-нибудь знает, почему этот элемент существует и как предотвратить его влияние на мою карту?