Openlayers 3 map disappears (reappears if rotating device)

Hello,
We have integrated an Openlayers 3 map in our ionic 2 application.
We have a severe problem that is present only on android device (ios not tested yet). Here follows the description.
The map is on her own page that is the root of our application.
When we navigate away from the map page, we can successfuly return back to the map using popToRoot(), and so far , so good.
The problem arises when we land on a page that has a search function (there is a ion-searchbar).
Everytime we use the search function , and we go back to the map, we find it white.
Inspecting with developer tools, we see that, as soon the ion-searchbar is touched, the canvas of the map got a “display:none” attribute.
We tried to manipulate the style of the canvas to remove the “display:none” attribute, doing so the map get shown but is irresponsive (we cannot drag it, zoom, etc.)
But we discovered however that, if we rotate the device, the map reappears and work properly.
What can cause this to happen? is there some conflict with openlayers library and ionic 2?
We are looking for a workaround, for example, how we can force the map to redraw itself, or the page to reload as it does when the device rotates?
Thank you.

1 Like

Hi, I’ve got the same exact issue. Have you got any luck fixing it?
Cheers!

Hello,
as a workaround, I call the updateSize() method on the map object. This seems to work.
I found this hint here

2 Likes