AnsweredAssumed Answered

Hiding the map: problems with building a mobile application with AngularJS

Question asked by tcoopman on Apr 15, 2013
Latest reply on May 25, 2016 by csgeosol1
Hi,

I've got a question about building a mobile application with the ArcGIS JS API (3.4 compact) and AngularJS (http://angularjs.org/ - a javascript framework for building web applications).

The application we are developping is a single page app where you can switch between views. A very simple sample can be found here: http://plnkr.co/edit/LKAyLwV69EQqgLl5LzEx?p=preview.

The problem we are experiencing is that after switching between views the ArcGIS Map doesn't always render again correctly (goes blank - sometimes the zoomSlider is not visible also).

As far as we have found the problems

  • Open the map

  • Switch to an other view (map is not visible)

  • Open the mobile keyboard (div resize)

  • Switch back to the map (map is reattached to the div) -> the map doesn't render.


By catching the updateExtent event, I can see that the extent gets set to NaN, but manually calling setExtent with a correct extent doesn't work either.

The current solution use Angular ngView (like in the example). As far as I can tell this completely removes the div from the DOM. The div is still available through esri.map.container and I use this div to reattach the existing div to the DOM. I've also tried to hide the map by setting display:none to the map div but this results in simular problems.

How do I solve this problem?

Possible solutions:

  1. Add a new map every time with new esri.map (expensive to set all the state again - so I don't like this solution)

  2. Is it possible to update the div (element esri.map.id) after switching tabs?

  3. Is it possible to do something like esri.dijit.OverviewMap.hide and .show?

  4. Can I pause the map, so that I pause the map before switching away from the map, and enable it again after I have switched back (pausing would be to stop all events from propagating to the map).

  5. Other possibilities?

Outcomes