Nous utilisons des cookies pour vous garantir la meilleure expérience sur notre site. Si vous continuez à utiliser ce dernier, nous considèrerons que vous acceptez l'utilisation des cookies. J'ai compris ! ou En savoir plus !.
Nom d'utilisateur    Mot de passe              Toujours pas inscrit ?   Mot de passe oublié ?

Annonce

Suite à un problème sur notre serveur une intervention a été planifiée ce  matin. La coupure, qui ne devait pas exéder 5 mn, a duré plus longtemps que prévu. L'intervention consistait à l'augmentation de l'espace disque (GeoRezo prend un peu plus de place en viellissant). Malheureusement, le serveur se faisant vieux, quelques soucis ont eu lieu.

Nous avons procédé à un gros nettoyage d'automne : augmentation de l'espace disque, mise à jour des certificats SSL pour l'utilisation des  urls en https, upgrade d'Apache et autres outils nécessaire au bon fonctionnement.

Notre volonté à long terme est de consolider la plateforme GeoRezo et nous accueillons toutes personnes intéressées pour nous aider (technologies utilisées : drupal, docker, MySQL, git, etc.) Si vous désirez contribuer à un projet dynamique et apprendre de nouvelles choses, contactez nous !

L'équipe GeoRezo

#1 mer. 26 octobre 2016 19:43

kartogravele
Membre
Date d'inscription: 13 oct. 2016
Messages: 6

Openlayers / getFeatures() ne donne rien

Bonjour,
A partir d'un fichier gpx, j'affiche une carte avec Openlayers.
Les waypoints s'affichent parfaitement avec les propriétés que j'ai indiquées.

Code:

<!DOCTYPE html>
<html>
  <head>
    <title>GPX Data</title>
    <link rel="stylesheet" href="http://openlayers.org/en/v3.18.2/css/ol.css" type="text/css">
    <script src="http://openlayers.org/en/v3.18.2/build/ol.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
    <div id="info">&nbsp;</div>
    <script>

      var raster = new ol.layer.Tile({
        source: new ol.source.OSM({
          imagerySet: 'osmfr',
          key: ''
        })
      });

      var vector = new ol.layer.Vector({
        source: new ol.source.Vector({
          url: 'fichier.gpx',
          format: new ol.format.GPX()
        }),

       style: function(feature) {

  var properties = feature.getProperties();

 var name = properties['name'];

         style = {
        'Point': new ol.style.Style({
          text: new ol.style.Text ({ text:name,font:'10px Palace Script',textAlign:'center', offsetX:0
                            ,fill: new ol.style.Fill({color: 'red'}),

              }),
          image: new ol.style.Circle({
            fill: null,
            radius: 7,
            stroke: new ol.style.Stroke({
              color: 'red',
              width: 1
            })
          })
        })
      };
        return style[feature.getGeometry().getType()]
        }
      });


      var map = new ol.Map({
        layers: [raster, vector],
        target: document.getElementById('map'),
        view: new ol.View({})
      });
var state = vector.getSource().getState(); 
document.write ("state = "+state+"<BR>");

var features = vector.getSource().getFeatures ();
document.write ("features = "+features+"<BR>");
nbfeatures=features.length;
document.write ("nbfeatures = "+nbfeatures+"<BR>");

map.getView().setCenter(ol.proj.transform([4.85, 45.75], 'EPSG:4326', 'EPSG:3857'));
map.getView().setZoom(15);

    </script>
  </body>
</html>

Voici le fichier GPX.

Code:

<gpx xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.topografix.com/GPX/1/1 http://www.topografix.com/GPX/1/1/gpx.xsd" version="1.1" creator="togpx">

<wpt lat="45.74751" lon="4.855258"><name>1</name><desc>name=1</desc></wpt>
<wpt lat="45.746875" lon="4.854685"><name>2</name><desc>name=2</desc></wpt>
<wpt lat="45.7455847300985" lon="4.85279176712036"><name>3</name><desc>name=3</desc></wpt>
<wpt lat="45.746661" lon="4.857562"><name>4</name><desc>name=4</desc></wpt>
<wpt lat="45.746455" lon="4.853352999999996"><name>5</name><desc>name=5</desc></wpt>

<wpt lat="45.745704" lon="4.854172"><name>6</name><desc>name=6</desc></wpt>
<wpt lat="45.746455" lon="4.853353"><name>7</name><desc>name=7</desc>
</wpt><wpt lat="45.748799" lon="7.368677000000001"><name>8</name><desc>name=8</desc>
</wpt><wpt lat="45.74642" lon="4.852106"><name>9</name><desc>name=9</desc></wpt>

<wpt lat="45.746633" lon="4.856315"><name>G</name><desc>G</desc></wpt>

<wpt lat="45.746612" lon="4.850096"><name>B</name><desc>B</desc></wpt>

</gpx>

Je souhaite faire des calculs sur les features (centre, dimensions...).
Et du coup, j'ai besoin de manipuler l'ensemble des features.

Je vérifie que la source est "ready'. C'est bien le cas.
J'ai utilisé getFeatures (). Mais le résultat est vide.

L'affichage...

Code:

var state = vector.getSource().getState(); 
document.write ("state = "+state+"<BR>");

var features = vector.getSource().getFeatures ();
document.write ("features = "+features+"<BR>");
nbfeatures=features.length;
document.write ("nbfeatures = "+nbfeatures+"<BR>");

... donne ceci

Code:

state = ready
features =
nbfeatures = 0

Quel est le problème ?

Dernière modification par kartogravele (jeu. 27 octobre 2016 14:11)

Hors ligne

 

#2 jeu. 17 novembre 2016 10:52

Jean-Marie64
Membre
Lieu: Pau
Date d'inscription: 6 nov. 2007
Messages: 118

Re: Openlayers / getFeatures() ne donne rien

Bonjour

la requête récupérant les features doit être asynchrone puisqu'au moment de l'affichage des résultats (state, length etc.)
les features ne sont pas encore ajoutés dans le layer
une solution est de passer par une requête ajax pour être sûr d'afficher les résultats après que les features soient ajoutés au layer
le mieux est de faire la requête en mode asynchrone (avec $.ajax -> voir doc jquery)

...

     var vector = new ol.layer.Vector({
        source: new ol.source.Vector({
          format: new ol.format.GPX()
        }),
...

....
        $.ajax({
            url: "fichier.gpx",
            success: function(data) {
                var features = geoGPXFormat.readFeatures(data, {featureProjection: map.getView().getProjection()});
                vector.getSource().addFeatures(features);
                var state = vector.getSource().getState();

                var features = vector.getSource().getFeatures ();
                nbfeatures=features.length;
               
                document.getElementById("info").innerHTML="state = "+state+"<BR>"+"features = "+features+"<BR>"+"<BR>"+"nbfeatures = "+nbfeatures+"<BR>"

               
            },
            error: function(e) {
                document.getElementById("info").innerHTML("error retrieving url");
            }
        });

Hors ligne

 

Pied de page des forums

Powered by FluxBB

Partagez  |