Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I'm actually having a big issue that I cannot solve so far. Here is my problem. I actually have a map on which I'm displaying markers (WMSGetFeatureInfo) depending on some categories that I want to show or hide.

But here is the thing, I actually get those markers as a *.map file which is actually a PNG file containing all the markers.

When I'm clicking on a marker, I'm getting the position of the click and then add a popup. But the more layers I have display on the map, the more the popup is pointing far away from the related marker.

Here some code :

    var layer = new OpenLayers.Layer.WMS(
        category.label,
        "/mapserv?Map=" + category.url,
        {
            layers  : category.layer,
            format  : 'image/png',
            version : '1.3.0',
            srs     : 'ESPG:3163'
        },
        {
            isBaseLayer : false,
            singleTile  : true,
            visibility  : visibility,
        }
    );

    var info = new OpenLayers.Control.WMSGetFeatureInfo({
        title          : 'get details by clicking',
        layers         : [ layer ],
        infoFormat     : "text/plain",
        queryVisible   : true,
        eventListeners : {
            getfeatureinfo : function( event ){
                document.body.style.cursor = 'auto';

                var getId = function( text ) {
                    result = context.settings.pattern.exec( text );
                    if( result == null ) return;
                    return result[1];
                }

                var id = getId( event.text );

                request = jQuery.ajax({
                    url     : "/cartoweb/FicheTheme",
                    type    : "get",
                    data    : "idGeoEad="+id,
                    success : function(response, textStatus, jqXHR){
                        if (response == null || response['data'] == null) {
                            return;
                        }
                        context.generateAndShowPopup( event.xy, response['data']['metaData'] );
                    }
                });
            },
            beforegetfeatureinfo : function( event ){
                document.body.style.cursor = 'wait';
            },
            nogetfeatureinfo : function( event ){
                document.body.style.cursor = 'auto';
            }
        }
    });

    this.map.addControl( info );
    info.activate();


generateAndShowPopup : function( latlong, text ) {
    var lonlatfrompx = this.map.getLonLatFromViewPortPx( latlong );
    var anchor       = {
        'size'      : new OpenLayers.Size(0,0), 
        'offset'    : new OpenLayers.Pixel(-36, 6), 
        'keepInMap' : true
    };

    // Hide by default popup actually open
    if(this.popup !== undefined) {
        this.popup.hide();
    }

    // Create a new popup
    this.popup = new OpenLayers.Popup.Anchored(
        "chicken",
        lonlatfrompx,
        new OpenLayers.Size( 2000, 2000 ),
        '<div class="popupTail"></div><div class="popupContent">' + text + '</div>',
        anchor,
        false, 
        function(){}
    );

    // Popup settings
    this.popup.setBackgroundColor( 'transparent' );
    this.popup.panMapIfOutOfView         = true;
    this.popup.calculateRelativePosition = function () { return 'tr'; }

    // Add it on the map
    this.map.addPopup( this.popup );

    var that = this;
    setTimeout(function(){
        that.popup.updateSize();
    }, 50);

    this.map.setCenter( lonlatfrompx );
}

Not sure if I'm doing something wrong, but if someone already faced the same issue, that will be really helpful to know where I did something wrong.

Thanks a lot

EDIT
Ok so I've tried to reproject the latlong on the layer but it still not working. However, I'm making progress :

// Layer is the layer associated to each WMSGetFeatureInfo
// this.layer is the base layer used to display the map
lonlatfrompx.transform( layer.projection, this.layer.projection );
this.map.setCenter( lonlatfrompx );

EDIT 1
Ok so I'm making progress. I think I know where the problem comes from but I still don't see/know how I'm gonna solve it (yet).

When intanciating the info variable, I'm making an ajax call inside which will show a popup when click. The thing is that the more I add layer, the more this ajax request is trying to get information.

Let's say, I show on the map 5 differents layers (IT, design, startup, computer and desktop). Then when I'm clicking on a markers (WMSGetFeatureInfo), it actually try to make an ajax request * [number of layers visible] and then change at some point (sometimes), the position value.

In order to solve this, I will need to avoid this ajax request to be executed more than one time. Any ideas?

share|improve this question
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.