How to resize infoWindow automatically based on the content?

AmaranathaNarasinghe

Hi,

I'm using infoWindow to display some text to the user. The content of the infoWindow is dynamically generated HTML formatted text. The problem here is, infoWindow shows the text by adding scroll bars.

I need to re-size the window to avoid the scroll bars. infoWindow.resize() method can't be used as the HTML text may have tables, new paragraphs or any thing.

Please help me to re-size the infoWindow automatically based on the content.
[ATTACH=CONFIG]28506[/ATTACH]
Regards,
Amnalk

infoWindow.png

MapViewDemo.zip

firefox_PT12uxywed.gif

bobcarr

The module "dojo/dom-geometry" might be helpful.  I was faced with a similar infoWindow scrollbar issue this week and it seems to be resolved after adding some code which incorporates that module.  The variance in size for me was in height-only, as I was using NWS weather observation XML and which varies in content by station and observation time.  The variance you describe seems to be in both dimensions, and probably much larger in magnitude. 

I create the div (and assign it an ID) in the function which processes the output from the XHR request, then include the dojo/dom-geometry module in the function tied to the mouse-over event.  The dom-geometry module is used against the div id to obtain its dimensions, which you can then use to calculate/set a new infoWindow size.

/* excerpt from function mkinfoWindowContent
var infocontdiv = domConstruct.create("div");
infocontdiv.id = "wthrdiv";
infocontdiv.innerHTML = content;  
r9WthrApp.map.infoWindow.setContent(infocontdiv);


/* excerpt from function which uses dojo/dom-geometry to determine height of content
require(["dojo/_base/Deferred","dojo/dom","dojo/dom-geometry"], 
          function(Deferred,dom,domGeom){
.
.
.
    var retdata = new Deferred();
    retdata = getWthrXML(forestnum); //deferred
    retdata.then(
        function(xmldoc) {
            mkInfoWindowContent(xmldoc);
            (evt) ? r9WthrApp.map.infoWindow.show(evt.screenPoint,r9WthrApp.map.getInfoWindowAnchor(evt.screenPoint)) : null; 
            var node = dom.byId("wthrdiv");
            var coords = domGeom.position(node);
            var newht = coords.h + 50;  //coords.h is height property
            r9WthrApp.map.infoWindow.resize(250,newht);
        }   
    ); //end deferred then
});