#1 Wed 03 December 2014 13:03
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Openlayers Différent map.zoomToMaxExtent
Bonjour,
Je souhaiterais savoir s'il est possible de définir plusieurs "map.zoomToMaxExtent();" pour avoir la possibilité de zoomer sur différentes parties de la carte, c'est l'utilisateur qui pourra choisir les différentes parties de la carte à afficher (à zoomer) avec par exemple un menu ou des choix à cocher.
Merci
Hors ligne
#2 Wed 03 December 2014 13:58
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Oui, tu peux faire un tableau JavaScript et pour chaque entrée un extent qui sera utilisé dans la méthode zoomToExtent() (et non pas zoomToMaxExtent() ). La liste déroulante permet d'activer la cellule du tableau qui va bien.
C'est plus du JavaScript que du OpenLayers
Code:
var mesExtents = [OpenLayers.Bounds(-180,-90,180,90), OpenLayers.Bounds(-10, 5, 10,6)]; map.zoomToExtent(zoomToExtent[0]);
Y.
Yves Jacolin, bénévole de l'association GeoRezo.net, agit au nom et pour le compte de l'association - Partageons ce qui nous départage !! - GeoRezo vous aide ? Aidez GeoRezo !
Hors ligne
#3 Wed 03 December 2014 14:18
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bien merci, donc a priori c'est possible, je vais tenter de m'en sortir avec tes explications mais je sens que je vais patauger : D
Hors ligne
#4 Wed 03 December 2014 15:25
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Re bonjour Yves
Bon je t’avoue que je galère un peu, je suis un peu faible en Java, tu pourrais me donner des pistes supplémentaires.
Un grand merci
Hors ligne
#5 Fri 05 December 2014 17:14
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Je suis désolé mais je vais avoir besoin de votre une fois de plus car je n'ai pas trouver la soulution à mon problème, bon d'accord je ne dois être doué !!!!
Un grand merci pour votre aide
Hors ligne
#6 Mon 08 December 2014 10:33
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Je suis toujours en panne, quelqu'un aurait-il une idée sur la solution à Yves, loin de moi l'idée de vous demander quelque chose de tout fait mais sur ce coup j'avoue une petite faiblesse.
Merci
Hors ligne
#7 Mon 08 December 2014 21:34
Re: Openlayers Différent map.zoomToMaxExtent
Bonsoir,
Le bout de code que vous propose Yves vous montre comment stocker les emprises dans un tableau.
La deuxième ligne est l'instruction en JS pour modifier l'emprise de la carte en utilisant la première valeur [0] du tableau.
Voici un autre exemple (rapidement trouvé) pour vous permettre de comprendre un peu mieux le fonctionnement :
http://forum.webrankinfo.com/javascript … 76449.html
Commencez peut-être par créer des boutons ou des liens et essayer de modifier l'emprise en appelant directement la fonction map.zoomToExtent() avec une valeur d'emprise.
Si vous débutez en JavaScript, il faut commencer par le début :
http://www.w3schools.com/js/
http://www.codecademy.com/en/tracks/javascript
Bon courage
Hors ligne
#8 Tue 09 December 2014 15:05
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Merci pour cette réponse, je me penche dessus tout de suite.
Merci
Hors ligne
#9 Wed 10 December 2014 12:20
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Je patine toujours pour trouver la solution. Avec vos différentes pistes j'ai pris la décisions de créer des boutons
Code:
<button onclick="fonction();">Extent 1</button>
qui devront appeler une fonction mais je ne trouve pas d’exemple de ce type de fonction. J'ai bien une piste sur les exemples mis à disposition par le site de Openlayers :
http://dev.openlayers.org/examples/pola … tions.html
Mais je n'ai pas trouvé la méthode pour l'adapter.
Dernière modification par geobrie (Wed 10 December 2014 12:29)
Hors ligne
#10 Thu 08 January 2015 16:08
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
A ce jour je n'ai toujours pas trouvé de solution, auriez-vous une idée ?
Merci
Hors ligne
#11 Fri 09 January 2015 01:50
- Cornet Jérémie
- Participant assidu
- Lieu: Nouméa
- Date d'inscription: 6 Apr 2008
- Messages: 229
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Il s'agit de javascript assez basique.
Je vous conseillerai fortement de suivre des tutoriels dédiés au javascript en général puis à openlayers en particulier.
Avec un select par exemple, il faut capturer l'évènement change et envoyer à une fonction dédiée au zoom.
On stocke dans les options les extents sous formes de chaine avec séparateur virgule
Code:
<select onChange="myExtent(this);"> <option value="-180,-90,180,90">Tout</option> <option value="-10, 5, 10,6">Mon zoom</option> </select>
Code:
function myExtent(my_select){ //transfo de l'extent sous forme de texte en tableau var bounds_coords = my_select.value.split(","); //On zoome sur cette extent (NB : zoomToExtent accepte comme paramètre un OpenLayers.Bounds ou un tableau des coordonnées des 4 points) map.zoomToExtent(bounds_coords); }
Hors ligne
#12 Fri 09 January 2015 09:40
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Merci pour la réponse. J'ai essayé ce code mais ça ne semble pas fonctionner, je pense que j'ai mal placé les différents éléments, pouvez-vous m'aider. Je suis désolé j'avoue mon incompétence, mais je suis assez coincé par le temps sur ce projet.
Code:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <meta name="apple-mobile-web-app-capable" content="yes"> <link rel="stylesheet" href="http://dev.openlayers.org/theme/default/style.css" type="text/css"> <link rel="stylesheet" href="http://dev.openlayers.org/examples/style.css" type="text/css"> <title>Cartographie</title> <style type="text/css"> html, body { height: 100%; } #map { width: 100%; height: 80%; border: 1px solid black; } .olPopup p { margin:0px; font-size: .9em;} .olPopup h2 { font-size:1.2em; } </style> <script src="http://dev.openlayers.org/OpenLayers.js";></script> <script type="text/javascript"> function init(){ var options = { controls: [ new OpenLayers.Control.LayerSwitcher(), ], maxExtent: bounds, projection: "EPSG:2154", allOverlays: true, }; map = new OpenLayers.Map('map', options);/*création d'une carte */ var carte1 = new OpenLayers.Layer.WMS("carte1","http://site.net/cgi-bin/mapserv?map=/home/site/www/propriete/htdocs/propriete.map&", { srs: 'EPSG:2154', layers: 'carte1', transparent: true, format:'image/png', }, {isBaseLayer: true, visibility: true} ); var carte3 = new OpenLayers.Layer.WMS("carte2","http://site.net/cgi-bin/mapserv?map=/home/site/www/propriete/htdocs/propriete.map&", { srs: 'EPSG:2154', layers: 'carte2', transparent: true, format:'image/png', }, {isBaseLayer: false, visibility: true} ); var carte3 = new OpenLayers.Layer.WMS("carte3","http://site.net/cgi-bin/mapserv?map=/home/site/www/propriete/htdocs/propriete.map&", { srs: 'EPSG:2154', layers: 'carte3', transparent: true, format:'image/png', }); map.addLayers([carte1, carte2, carte3]); function myExtent(my_select){ //transfo de l'extent sous forme de texte en tableau var bounds_coords = my_select.value.split(","); //On zoome sur cette extent (NB : zoomToExtent accepte comme paramètre un OpenLayers.Bounds ou un tableau des coordonnées des 4 points) map.zoomToExtent(bounds_coords);}} </script> </head> <h1 id="title">Carte</h1><br /> <body onload="init()"><p> </p> <div style="width:100%; height:60%;border:1px black solid;"id="map"></div> <select onChange="myExtent(this);"> <option value="820461,6786349,1048185,6915665">Tout</option> <option value="820421,6808284,830172,6813734">carte1</option> </select> <a href="javascript:history.back()" class="btn btn-primary"> <span class="glyphicon glyphicon-circle-arrow-left"></span> Retour </a> </body> </html>
Merci
Hors ligne
#13 Mon 12 January 2015 09:15
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
J'avoue mon incompétence mais j'ai un réel besoin pour avancer dans mon projet, pourriez-vous me corriger cela me retirerait un grosse épine du pied
UN GRAND MERCI
Hors ligne
#14 Mon 12 January 2015 13:43
- Cornet Jérémie
- Participant assidu
- Lieu: Nouméa
- Date d'inscription: 6 Apr 2008
- Messages: 229
Re: Openlayers Différent map.zoomToMaxExtent
Bonjour,
Il vous faut apprendre quelques bases de developpement javascript, a minima
- utilisation de la console javascript du navigateur pour débuguer
http://www.alsacreations.com/astuce/lir … cript.html
- portée des variables (pour savoir où placer myExtent dans ce cas)
http://msdn.microsoft.com/fr-fr/library … 94%29.aspx
NB : en javascript tout est une variable objet donc écrire
Code:
fonction MaFonction(v1){ }
équivaut à écrire :
Code:
var MaFonction = function(v1){ }
La portée fonctionne exactement de la même manière pour une fonction que pour une variable.
Hors ligne
#15 Mon 12 January 2015 14:29
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Je suis bien conscient que votre objectif n'est pas de donner des solutions clef en main, mais on ne peut pas être tous des experts. Dans ce projet j'essaye de me débrouiller avec le peu de connaissance que j'ai acquis par mes propres moyens, ce n'est pas mon métier de base et il m'est difficile de passer trop de temps à apprendre le java script, dans un premier temps je doit faire avec les exemples que je glane sur le web. C'est pour cette raison que je me tourne vers vous. Dans un premier temps je suis obligé de me tourner vers vous avec ce travail important pour lequel je vous sollicite.
Merci pour votre aide
Hors ligne
#16 Mon 12 January 2015 15:41
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Help Me Please
Hors ligne
#17 Mon 12 January 2015 23:52
- Cornet Jérémie
- Participant assidu
- Lieu: Nouméa
- Date d'inscription: 6 Apr 2008
- Messages: 229
Re: Openlayers Différent map.zoomToMaxExtent
Je ne ferais pas le travail à votre place, ça s'est sûr.
Pour en revenir à votre problème :
Si je parle de la portée des variables c'est parce que vous avez copié la fonction myExtent dans la fonction init ce qui veut dire qu'elle n'est disponible que dans cette fonction. Hors, elle est appelée depuis l'évènement du select donc elle a besoin d'être disponible gloablement.
Il suffit de la déclarer après init pour cela.
Si je vous parle de la console javascript, c'est parce qu'il y a plusieurs petits problèmes dans le code qui vont apparaître dans la console et seront facilement corrigeables. C'est un bien petit investissement de comprendre comment l'utiliser...
Dernière modification par Cornet Jérémie (Tue 13 January 2015 04:27)
Hors ligne
#18 Tue 13 January 2015 14:36
- geobrie
- Participant actif
- Date d'inscription: 31 Jan 2010
- Messages: 120
Re: Openlayers Différent map.zoomToMaxExtent
Un grand merci Jérémie ça fonctionne, je te demande de bien vouloir m'excuser si j'ai été un peu insistant, mais comme tu peux le voir mes connaissances sont assez limitées et mon activité professionnelle ne me laisse pas beaucoup de temps pour acquérir toutes les connaissances que je devrait. En plus je me suis engagé sur ce projet auprès d'un tiers, je n'aurais certainement pas dû, sans mesurer l’importance des connaissances qu'il me fallait.
Merci Jérémie
Hors ligne