banniere

Le portail francophone de la géomatique


Toujours pas inscrit ? Mot de passe oublié ?
Nom d'utilisateur    Mot de passe              Toujours pas inscrit ?   Mot de passe oublié ?

#1 Mon 24 March 2014 13:38

drouchi
Participant occasionnel
Date d'inscription: 16 Jun 2010
Messages: 32

Jquery Autocomplete et Openlayers

Bonjour a tous,

Je suis en train de développer une carte en ligne (postgreSQL, mapnik, openlayer). Sur cette carte j'ai une couche Vector avec des marqueurs. Les marqueurs sont actifs et ouvre une popup lorsque l'on clic dessus.
Dernièrement je dois développer un champs de recherche (jquery automplete widget). Je voudrai que lorsque un de mes marqueur est sélectionné dans le champs de recherche, celui ouvre la popup correspondante.

Voici le code de ma couche Vector:
var resto = new OpenLayers.Layer.Vector("GML", {
                protocol: new OpenLayers.Protocol.HTTP({
                    url: "restaurant.php",
                    format: new OpenLayers.Format.GML(),
                   
                }),
                strategies: [new OpenLayers.Strategy.Fixed()],
                projection: map.displayProjection,
            });


Voici le code de l'autocomplete (celui-ci permet de centrer la carte sur le marqueur choisi mais n'ouvre pas la popup correspondante :

$(function() {
    $( "#searchresto" ).catcomplete({
        delay: 0,
        source: "select_resto.php",
         select: function ( event, ui )
            { map.setCenter(
                new OpenLayers.LonLat( ui.item.h_lon, ui.item.h_lat).transform(
                        new OpenLayers.Projection(Geo_pjt),
                        map.getProjectionObject()
                        ), 5 );},

         open: function () {
            $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top");
            },
         close: function () {
            $( this ).removeClass( "ui-corner-top").addClass("ui-corner-all");
            }

    });
});


Quelqu'un aurait-il quelque conseil sur la façon de procéder ou alors un bout de code smile
Merci d'avance pour votre aide.

Drouchi

Hors ligne

 

#2 Tue 08 April 2014 17:31

drouchi
Participant occasionnel
Date d'inscription: 16 Jun 2010
Messages: 32

Re: Jquery Autocomplete et Openlayers

Bonjour,

Je viens finalement de trouver la réponse a ma question.
Merci de ne pas avoir repondu car je n'aurai pas pu m’améliorer en Javascript smile


Alors, il faut d'abord ajouter un onchange dans le input

Code:

<input type="text" id="searchresto" onchange="yourfunction(this)"/>

Ensuite pour l'openlayer:

Code:

function getFeatureByHid(featureHId) {
        var feature = null;
        var found = false;
        for(var i=0, len=resto.features.length; i<len; ++i) {
            if(resto.features[i].attributes.crID == featureHId) {
                feature = resto.features[i];
                found = true;
                break;
            }
        }

        return feature;
    }

    function SelectRestoByRestoId(crID)
    {
        var feature = getFeatureByHid(crID);
        if (feature)
        {
            restoSelect.unselectAll();
            restoSelect.select(feature);
        }
        return true;
    }   

    function yourfunction(event,ui){
        return SelectRestoByRestoId(ui.item.id);
    }

Et enfin il suffit d'ajouter votre fonction lors du select dans l'autocomplete jquery

Code:

$(function() {
$( "#searchresto" ).catcomplete({
    delay: 0,
    source: "select_resto.php",
     select: yourfunction

});});

Et voila!!!!

Dernière modification par drouchi (Tue 08 April 2014 17:32)

Hors ligne

 

#3 Wed 09 April 2014 07:31

MathieuB
Membre du bureau
Lieu: Montpellier
Date d'inscription: 18 Jan 2006
Messages: 1229
Site web

Re: Jquery Autocomplete et Openlayers

Bonjour et merci pour ce retour.


Mathieu BOSSAERT
Association GeoRezo

Hors ligne

 

Pied de page des forums

Powered by FluxBB