AnsweredAssumed Answered

Fit the complete infoTemplate contents on your map

Question asked by schlot on Jan 26, 2015
Latest reply on Jan 29, 2015 by schlot

This is not a new problem, but I have yet to come up with a very satisfactory solution.  How do you keep your infoTemplate from getting cut off?  My content isn't very complicated.  I have used a map.infoWindow.resize to make it a little wider. I have a function to format the contents. 




I have a listener on the show event of the map.infoWindow.   The trick apparently isn't to move your infoTemplate, but instead to move your map if it detects the window is going to get cut off,  panning the map enough so the tag isn't cropped.


on(map.infoWindow, "show", adjustMapExtent);


I got this from an older thread and it seems to be working.


  function adjustMapExtent(){
      var maxPoint = new Point(map.extent.xmax, map.extent.ymax, spatialReference);  
      var centerPoint = new Point(map.extent.getCenter());  
      var mapPt = new Point(map.infoWindow.location, spatialReference);
      screenPt = map.toScreen(mapPt);
      //Convert these to screen coordinates  
      var maxPointScreen = map.toScreen(maxPoint);  
      var centerPointScreen = map.toScreen(centerPoint);  

      //Subtract the size of the infoWindow, including a buffer.  
      //This will show whether the infoWindow would spill out of the current view.  
      var xDiff = Math.abs(maxPointScreen.x - screenPt.x) - 350;  
      var yDiff = Math.abs(maxPointScreen.y - screenPt.y) - 310;  

      //If required, recalculate a new centerpoint which accounts for the infoWindow  
      if (xDiff < 0) { 
      centerPointScreen.x -= xDiff; 
      if ( yDiff < 0) { 
      centerPointScreen.y += yDiff; 

      //Pan the map to the new centerpoint (in Map coordinates)  
      centerPoint = map.toMap(centerPointScreen, spatialReference);  


Here's my problem/complaint.  This works the first time.  However, unless you've dismissed the tag, the 'show' listener doesn't get fired again, because there is still an infoWindow displayed.  The event doesn't fire for every new infoWindow, just 'when an infoWindow in visible'.  This is an important distinction.


Is there some other event I could be listening for?  I tried adding an event listener on the map click to do a 'map.infoWindow.hide()', but that seems to prevent the info tag from ever displaying.