Popup is not displayed correctly when map is absolute positioned on page

BjørnSandvik · ‎04-18-2012

Hi,

I have a map on page that is absolute positioned:
http://dl.dropbox.com/u/2306934/NRK/trafikk/popupbug/popup.html

#mapcontainer {
   position: absolute;
   top: 400px;
   left: 300px;
}

The problem with absolute positioned maps is that the popup placement is not working correctly; the popup is displayed outside the map window:

[ATTACH=CONFIG]13627[/ATTACH]

We need to use absolute positioned elements on our site - is it possible to fix this issue?
I presume there is a bug in the "_setPosition" function of esri.dijit.Popup:
http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/esri/dijit/Popup.xd.js

BjørnSandvik · ‎04-19-2012

The same problem occurs when the map is not absolute positioned as well:
http://dl.dropbox.com/u/2306934/NRK/trafikk/popupbug/popup3.html

On this page, the map is placed below a header div with a height of 400px.

The popup is displaced:
[ATTACH=CONFIG]13664[/ATTACH]

Any solution to this issue?

ReneRubalcava · ‎04-19-2012

I can't view your code at work because dropbox is blocked, but I can tell by your zoom bar that you don't have <body class="claro"> set. Try adding the class and see if that fixes it.

BjørnSandvik · ‎04-19-2012

I've added the class to the body tag, but it didn't fix the issue.

The HTML-file is available in the attached file (popup.zip).

Bjorn

BjørnSandvik · ‎04-20-2012

Anyone from ESRI who knows how to fix this issue?

Is it possible to get an unminified version of the esri.dijit.Popup JavaScript code?
http://serverapi.arcgisonline.com/jsapi/arcgis/2.8/js/esri/dijit/Popup.xd.js

PaulBushore · ‎04-20-2012

Hello,

I brought the source code in to Visual Web Developer and I removed the header (Which placed the map in the upper left corner) and clicked on a spot near the top of the map div and the response placed the popup below the spot I clicked, within the map. I then re-added the header div and clicked on the same point and the popup appears above the point, off the map area. I only add this as a confirmation of the observed results. I don't know if it is intentional or a bug, hopefully one of the ESRI heroes are taking a look in to it.

If I find out anything I will post back.

Best wishes,

ShreyasVakil · ‎04-20-2012

I have found this workaround. Please test and see if it works for you.

Replace your : dojo.connect(map,"onClick",function(evt)
with the code given below:

dojo.connect(map,"onClick",function(evt){
          var query = new esri.tasks.Query();
          query.geometry = pointToExtent(map,evt.mapPoint,10);
          var deferred = featureLayer.selectFeatures(query,esri.layers.FeatureLayer.SELECTION_NEW);
          map.infoWindow.setFeatures([deferred]);
    map.infoWindow.show(evt.mapPoint);
    map.infoWindow.resize(200,100);
    map.centerAt(evt.mapPoint);
        });

I am not sure thought if this was your problem! But there is no harm in trying:)

BjørnSandvik · ‎04-23-2012

Hi Shreyas,

Yes, it is a workaround to recenter the map on each click - but we would like to have the default behavior where the popup is placed according to the map window.

Any chance you'll fix this bug? This seems to work correctly with the standard InfoWindow, the problem occurs in esri.dijit.Popup.

Bjorn

ShreyasVakil · ‎04-23-2012

Hi Shreyas,

Yes, it is a workaround to recenter the map on each click - but we would like to have the default behavior where the popup is placed according to the map window.

Any chance you'll fix this bug? This seems to work correctly with the standard InfoWindow, the problem occurs in esri.dijit.Popup.

Bjorn

Hi Bjorn,
I was able to reproduce the abnormal behavior of popup, I'll dig in some resources and come back to you.

Shreyas

ShreyasVakil · ‎04-24-2012

Hi Bjørn,

A bug has been logged for this issue (NIM080359).

Thanks,
Shreyas