ThinkGeo.com    |     Documentation    |     Premium Support

Can't close CloudPopup

Hi There:



We are using MVC v9.0. We found out that an unexpected Contribution image was generated with size of 944 * 560 as shown in attached files. However, we tried a sample application provided by you, we did not see such an image but just some text “ThinkGeo … OpenStreetMap Contributors…”.



if we deleted the contribution image element or changed the width of the image (to a small number eg 50px), we could close a CloudPopup by clicking the red cross button on the upper right corner of the popup window.



Further research indicated that the unexpected image was for LegendAdonment Layer.  It appears that the main issue is the z-index of this div is too high (1001) which block the Cloudpop box which has a z-index of 751 while the olPopCloseBox has a z-index of 1.  If we change the    



Please help us to solve this issue since it has been holding us for a long time to prevent us to upgrade to Version 9.0.



Thanks,



Adrian

CloudPopBox1.jpg (86.2 KB)
CloudPopBox2.jpg (73.7 KB)

Hi Adrian, 
  
 Thanks for your detailed description,It has been reproduced on my end and proved to be a bug.  It’s an issue of built-in AdornmentOverlay. I have marked it as “In Progress” and try to fix it as son as possible. 
  
 Thanks, 
 Johnny

Hi Adrian, 
  
 A workaround is that you can call client side Api MapId.GetAdornmentOverlay and chang its Z-Index or hide it temporarily, or use another background map like OpenStreetMap temporarily. 
  
 Thanks, 
 Johnny

Thank you very much Johnny for your response.



Could you give me some example to call the client side Api MapId.GetAdornmentOverlay and chang its Z-Index.  To hide it is not an option for us.  We do use OpenStreetMap as a background map.  Do yo think that loading sequence may be an issue?



Thanks,

Adrian

Hi Adrian, 
  
 I think you can do that like this: 
  
 <script language="javascript" type="text/javascript">
function mapClick(e) {
var layer = Map1.getAdornmentOverlay();
layer.div.style.zIndex = 300;
}
</script>

Please try that,and what loading sequence do you mean?

Regards,

 Don

Hi Adrian,  
  
 I think you can do that like this:  
  
 <script language="javascript" type="text/javascript">
    function mapClick(e) {        
        var layer = Map1.getAdornmentOverlay();
        layer.div.style.zIndex = 300;
    }
    </script> 
 
  
 Please try that,and what loading sequence do you mean?  
  
 Regards, 
  
 Don

Thanks Don for your reply. But the code you provided didn’t work for our case.



Please look at the images that I have provided earlier that the div is “OpenLayers_Control_Attribution_2” which has a very high z-index of 1001, as it showing in the element.style css. It block the olPopupCloseBox which has a z-index of 1. Please see the attached screenshot for more details.
Please let us know what else we need to do to fix it.
Loading sequence in my previous email means which layer is loaded after the LegenAdormentOverlay.



update 02/12/2016: We add the following two line of code to make the opoup dialog to close but the legend adornment layer disappeared.


                    var layerAttribution = document.getElementById(“OpenLayers_Control_Attribution_2”);
layerAttribution.style.zIndex = 300;
Please help.
Thanks,
Adrian 

CloudPopBox3.jpg (55.3 KB)

Hi Adrian,



Sorry for the delay as I was out of office before. Would you please let me know which concrete version of 9.0 you are using? Sorry that I made a mistake before, because in the latest version, I guess we have modified the "ThinkGeo … OpenStreetMap Contributors…"to a label hosted in  tag. just shown as following:







you see the highlighted in BLUE.  But seems like on your end looks like:







Would you please let me know how your samples looks like? is it possible to share some codes here?



Thanks,

Johnny

Thanks Johnny for your reply.



Our code is exact the same.  The zIndex for olPopCloseBox = 1. The zIndex for the legendAdornment layer is 1001 as shown in the first image file attached.  I changed to 700 and then I can click the cross on the right upper corner of the Popup box and close it. 



The version that we are using is  9.0.0.230.



Some code example:

Server side (Controller): 

map.Popups.Add(new CloudPopup("Information", map.CurrentExtent.GetCenterPoint()) { AutoSize = true, HasCloseButton = true });



Client Side (JavaScript): 



  var infoPopup = Map1.popups[0]; // pre-created popup window
  infoPopup.lonlat = e.worldXY;

        function (result) {
                // alert(result);
                var resultString = result.get_responseData().toString();
                 infoPopup.setContentHTML(resultString);
                    infoPopup.show();
                }
     



Thanks,

Adrian

Hi Adrian,
I think I have reproduced your issue with 9.0.0.230 dlls.




You cannot close the popup should because the image in the div ‘OpenLayers_Control_Attribution_2’ cover the entire map, its size looks incorrect. 



Please note the yellow area (width and height) in the image as below:







I think we will looks at into this problem and see how to solve it, our developer is working for it, any update I will let
you know.


Thanks,




Hi Adrian, 
  
 The bug has been fixed in the latest Daily Builds with version higher than 9.0.0.241(Production) or 9.0.240.0(Development). Please take it from Product Center to have a try. Please make sure clear the cache of browser at first. 
  
 Thanks, 
 Johnny

Hi Johnny:



You guys are awesome.  I will download and let you know soon.



However, I find out that the version for MVC Edition is only 9.0.0.239 in my Product Center.  I am not sure if this version has the fix that I need it?



Thanks again,

Adrian


Hi Adrian, 
  
 Now it should be available in Product Center, please get it. 
  
 Thanks, 
 Johnny

Thanks Johnny.  I got the latest version and it works now.



Thank you very much.



Cheers,

Adrian

Hi Adrian, 
  
 You’re welcome. Very glad to hear it works with you. 
  
 Thanks, 
 Peter