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

Pages: 1

 

#1 sam. 10 septembre 2011 20:31

phil008
Membre
Date d'inscription: 10 sept. 2011
Messages: 23

Openlayers: afficher attributs de plusieurs layers, comment faire?

Bonsoir,

Je bosse sur un script me permettant d'afficher deux layers GML, et d'afficher leur attributs via un popup. Ca marche, mais que pour un seul layer, Comment dois-je modifier mon code pour afficher les attributs de plusieurs layers? J'ai tout essayé mais rien ne marche et puis j'avoue que je suis pas très doué en javascript. Voila mon code:

Code:

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <link rel="stylesheet" href="../../theme/default/style.css" type="text/css" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <style type="text/css">
        #controlToggle li {
            list-style: none;
        }
        p {
            width: 512px;
        }
        #options {
            position: relative;
            width: 512px;
        }
        #output {
            float: right;
        }
    </style>
    
    <script src="../../lib/OpenLayers.js"></script>
    
    <script type="text/javascript">
    
var map, selectControl, selectedFeature;
        
<!---QUERY ATTRIBUTES---->

        function onPopupClose(evt) {

            selectControl.unselect(selectedFeature);

        }

        function onFeatureSelect(feature) {

            selectedFeature = feature;
            

            popup = new OpenLayers.Popup.FramedCloud("chicken", feature.geometry.getBounds().getCenterLonLat(),null,
            '<div>Feature: ' + feature.id +'<br />Area: ' + feature.geometry.getArea()+'<br />OWNER: ' + feature.attributes.Owner +'<br />PRICE: ' + feature.attributes.Price +'<br />PRICE: ' +'</div>',
            null, true, onPopupClose);
            
            

            feature.popup = popup;

            map.addPopup(popup);

        } 

        function onFeatureUnselect(feature) {

            map.removePopup(feature.popup);

            feature.popup.destroy();

            feature.popup = null;

        }



               function toggleControl(element) {

            for(key in drawControls) {

                var control = drawControls[key];

                if(element.value == key && element.checked) {

                    control.activate();

                } else {

                    control.deactivate();

                }

            }

        }
        
<!------>

<!----INIT PART---------------------------------------------------------->     
        
        function init() {
            
            <!---MAIN---->

        
            map = new OpenLayers.Map('map');
            
            

            var wmsLayer = new OpenLayers.Layer.WMS( "OpenLayers WMS", "http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'}); 

            

        var myvectors1 = new OpenLayers.Layer.GML("macouche1", "myvectors1.xml");

            
        var myvectors2 = new OpenLayers.Layer.GML("macouche2", "myvectors2.xml");


            var polygonLayer = new OpenLayers.Layer.Vector("Polygon Layer");

            



            map.addLayers([wmsLayer, myvectors1, myvectors2]);
            map.addControl(new OpenLayers.Control.LayerSwitcher());
            map.addControl(new OpenLayers.Control.MousePosition());
            
<!----->

<!---QUERY ATTRIBUTES---->

            

            selectControl = new OpenLayers.Control.SelectFeature(myvectors1, {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});

            drawControls = {polygon: new OpenLayers.Control.DrawFeature(polygonLayer,OpenLayers.Handler.Polygon),select: selectControl};

            

            for(var key in drawControls) {
        map.addControl(drawControls[key]);
        }   
            
<!---->

            map.setCenter(new OpenLayers.LonLat(-85, 12), 4);
            
            document.getElementById('noneToggle').checked = true;
            
        }
        
 

        
    </script>
  </head>
  <body onload="init()">
    <h1 id="title">OpenLayers Measure Example</h1>
    <div id="map" class="smallmap"></div>
    <div id="options">
        <div id="output">
        </div>
        
        <br>

                <input type="radio" name="type" value="none" id="noneToggle"onclick="btoggleControl(this);" checked="checked" />
                <label for="noneToggle">Navigate</label>
<br>


        <input type="radio" name="type" value="select" id="selectToggle" onclick="toggleControl(this);" />

        <label for="selectToggle">Query Object</label>


    </div>
  </body>
</html>

Ma reconnaissance éternelle à celui qui trouvera la modification à apporter pour que ça marche sur plusieurs layers et pas seulement sur un seul.

Hors ligne

 

#2 dim. 11 septembre 2011 09:18

Laurent Jégou
Membre
Lieu: Toulouse
Date d'inscription: 5 sept. 2005
Messages: 357
Site web

Re: Openlayers: afficher attributs de plusieurs layers, comment faire?

Vous pouvez déclarer votre OpenLayers.Control.SelectFeature sur vos deux layers à la fois.

selectControl = new OpenLayers.Control.SelectFeature([myvectors1, myvectors2], {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});

Cartographe et enseignant
UTM - Dept Géo / M2 Sigma

Hors ligne

 

#3 dim. 11 septembre 2011 11:51

phil008
Membre
Date d'inscription: 10 sept. 2011
Messages: 23

Re: Openlayers: afficher attributs de plusieurs layers, comment faire?

Bonjour,

Je viens de modifier et en effet ça marche. Maintenant mon probleme c'est  qu'il faudra que je definisse autant de popup qu'il y a de layers parceque les champs d'attributs sont differents:

Est ce qu'il moyen de faire une condition pour changer de popup selon le layer qui est interrogé, c'est à dire quelquechose comme ça? :

Code:

if [layer selected] == myvector1.xml {

popup = new OpenLayers.Popup.FramedCloud("chicken", feature.geometry.getBounds().getCenterLonLat(),null, '<div>Feature: ' + feature.id +'<br />Area: ' + feature.geometry.getArea()+'<br />OWNER: ' + feature.attributes.Owner +'<br />PRICE: ' + feature.attributes.Price +'</div>', null, true, onPopupClose);

}

if [layer selected] == myvector2.xml {

popup = new OpenLayers.Popup.FramedCloud("chicken", feature.geometry.getBounds().getCenterLonLat(),null, '<div>Feature: ' + feature.id +'<br />Area: ' + feature.geometry.getArea()+'<br />CATEGORY: ' + feature.attributes.category +'<br />POPULATION: ' + feature.attributes.population +'</div>', null, true, onPopupClose);

}

Hors ligne

 

#4 dim. 11 septembre 2011 12:26

Laurent Jégou
Membre
Lieu: Toulouse
Date d'inscription: 5 sept. 2005
Messages: 357
Site web

Re: Openlayers: afficher attributs de plusieurs layers, comment faire?

Dans l'évènement onFeatureSelect est fournie la feature qui est sélectionnée, et donc le layer qui la contient (OpenLayers.Feature.layer). Vous pouvez donc tester sur cette propriété et réagir en conséquence.

Dernière modification par Laurent Jégou (dim. 11 septembre 2011 12:26)

Cartographe et enseignant
UTM - Dept Géo / M2 Sigma

Hors ligne

 

#5 dim. 11 septembre 2011 19:21

phil008
Membre
Date d'inscription: 10 sept. 2011
Messages: 23

Re: Openlayers: afficher attributs de plusieurs layers, comment faire?

Donc qu'est ce que c'est vôtre idée concrètement? Un truc comme ça? :

Code:

function onFeatureSelect(feature) {
    

selectedFeature = feature;
        
if (OpenLayers.Feature.layer = myvectors2) {
                    

popup = new OpenLayers.Popup.FramedCloud("chicken", feature.geometry.getBounds().getCenterLonLat(),null,
'<div>Feature: ' + feature.id +'<br />Area: ' + feature.geometry.getArea()+'<br />OWNER: ' + feature.attributes.Owner +'<br />PRICE: ' + feature.attributes.Price + '</div>',
null, true, onPopupClose);
        
}
                    

feature.popup = popup;

map.addPopup(popup);

}

Parce que comme ça, ça ne marche pas (aucun popup).

Hors ligne

 

#6 lun. 12 septembre 2011 12:28

Laurent Jégou
Membre
Lieu: Toulouse
Date d'inscription: 5 sept. 2005
Messages: 357
Site web

Re: Openlayers: afficher attributs de plusieurs layers, comment faire?

En javascript, les tests logiques d'égalité se font avec l'opérateur ==, pas =. Ensuite pour trouver ce qui ne va pas, il vous faut utiliser un débogueur, comme Firebug pour Firefox ou la console de développement JS de Chrome.

Cartographe et enseignant
UTM - Dept Géo / M2 Sigma

Hors ligne

 

 

Pages: 1

Pied de page des forums

Powered by FluxBB

Partagez  |