Des incohérences dans le quickstart.js (?)

**Scarab Aware** · 21/03/2013, 14h10

Je recrée un autre sujet concernant la mise en place de l'API. Hier j'ai eu comme qui dirais une fausse joie. J'ai bien une carte qui apparaît mais sans layerswitcher

J'ai vu à partir de cet exemple http://api.ign.fr/tech-docs-js/examp...Map_basic.html, et sauf contradiction de votre part, il ne me semble pas convenu de reprendre complètement le code de l'exemple non ?

Ainsi, après plusieurs changement dans ce que j'ai au niveau de mon quickstart.js, jamais les contrôles n'apparaissent et la je constate quelque chose de surprenant à ce niveau là :

var options= {
mode:'normal',
territory:'FXX',
displayProjection:'geoportalMap'
proxy:'assets/proxy.php'+'?url='

La carte n'apparait que si le displayProjection est présent. Si je met comme ceci :

var options= {
mode:'normal',
territory:'FXX',
displayProjection:'...'
proxy:'assets/proxy.php'+'?url='

voir comme cela

var options= {
mode:'normal',
territory:'FXX',
'geoportalMap'
proxy:'assets/proxy.php'+'?url='

ça continue d'afficher la même carte après avoir rafraîchi la page. Mais sans, j'en reste simplement au loading. Et avec cette ligne c'est toujours la même chose qui apparait, celle de l'exemple. Je peux enlever "'GEOGRAPHICALGRIDSYSTEMS.MAPS'" ça ne change pas.

D'autant plus que je devrais avoir un centrage de base sur Saint Mandé non ?

Et si je change les coordonnées dans le JS, la punaise ne bouge point. Par contre si je les change dans le quickstart.html, tout s'en va.

**mga_geo** · 21/03/2013, 14h54

Pour espérer avoir une réponse, il faut poser des questions claires.
Et ensuite il faut tenir informé des évolutions faites.

**Scarab Aware** · 21/03/2013, 16h34

Bon...alors, on est bien d'accord que en suivant ce qui est dis ici : http://api.ign.fr/documentation/93/d...-du-geoportail

Je devrais avoir ceci :

Le fait, est que jusqu'à hier je ne passais pas l'étape du loading, en restant à voir ceci sans qu'aucune carte ne s'affiche :

Ainsi, n'aboutissant pas, j'ai regardé les exemples ici : http://api.ign.fr/tech-docs-js/examples/

J'ai pris cet exemple : http://api.ign.fr/tech-docs-js/examp...Map_basic.html

Ensuite j'ai bidouillé au niveau de mon fichier quickstart.js, reprenant des morceaux de code, faisant même un nouveau contrat pour avoir une nouvelle clé au cas où...Et avec ces manips j'ai une carte qui s'affiche

Mais il manque les contrôles soit les layers pour les couches et l'échelle. J'ai fais différents essais qui ne donnent rien. MAIS, ce que je voulais dire là, c'est que la carte apparait de n'importe quelle façon toujours identique, quoi que je fasse seulement et seulement SI je met quelque chose entre territory et proxy au niveau des options. C'est ce que je signalais dans mon post ouvrant le sujet

Est ce que les choses sont plus claires maintenant ?

**Zébulon-21** · 21/03/2013, 20h23

Tes messages sont dans un format réservé aux mal-voyants ?

Tu peux aussi trouver source d'inspiration sur ce site.

**Scarab Aware** · 22/03/2013, 08h12

vi désoulé de la taille que ça prends

En tout cas merci pour le site, vais voir ce que ça donne avec et je tiens au courant.

**nicolas.h** · 22/03/2013, 08h44

Envoyé par Scarab Aware

Bon...alors, on est bien d'accord que en suivant ce qui est dis ici : http://api.ign.fr/documentation/93/d...-du-geoportail

Je devrais avoir ceci :

Le fait, est que jusqu'à hier je ne passais pas l'étape du loading, en restant à voir ceci sans qu'aucune carte ne s'affiche :

Ainsi, n'aboutissant pas, j'ai regardé les exemples ici : http://api.ign.fr/tech-docs-js/examples/

J'ai pris cet exemple : http://api.ign.fr/tech-docs-js/examp...Map_basic.html

Ensuite j'ai bidouillé au niveau de mon fichier quickstart.js, reprenant des morceaux de code, faisant même un nouveau contrat pour avoir une nouvelle clé au cas où...Et avec ces manips j'ai une carte qui s'affiche

Mais il manque les contrôles soit les layers pour les couches et l'échelle. J'ai fais différents essais qui ne donnent rien. MAIS, ce que je voulais dire là, c'est que la carte apparait de n'importe quelle façon toujours identique, quoi que je fasse seulement et seulement SI je met quelque chose entre territory et proxy au niveau des options. C'est ce que je signalais dans mon post ouvrant le sujet

Est ce que les choses sont plus claires maintenant ?

Bonjour je viens de jeter un oeil sur le tutoriel:
http://api.ign.fr/documentation/93/d...-du-geoportail

Il semblerait qu'il manquerait la ligne de code suivante:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.gGEOPORTALRIGHTSMANAGEMENT===undefined? {'apiKey':'votre_clé_api'} : gGEOPORTALRIGHTSMANAGEMENT)

A ajouter comme ceci dans le code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
viewer= new Geoportal.Viewer.Default('viewerDiv', OpenLayers.Util.extend(
        options,
        window.gGEOPORTALRIGHTSMANAGEMENT===undefined? {'apiKey':'votre_clé_api'} : gGEOPORTALRIGHTSMANAGEMENT)
    );

Pourriez vous retester avec cette modification, d'avance merci

**Scarab Aware** · 22/03/2013, 10h04

Alors, pour la ligne de code dont vous me parlez elle est bien insérée. Par contre, après avoir revu le codage avec un responsable du service informatique du SDIS, nous avons pu faire un autre constat.

Sur ce morceau de code toujours, dans la fonction initmap

var options= {
mode:'normal',
territory:'FXX',
displayProjection:'geoportalMap' ,
proxy:'assets/proxy.php?url='

En ne mettant pas de virgule après 'geoportalMap' une carte apparaît. Si je met une virgule, aucune carte n'apparait. Et que je mette 'geoportalMap' ou '...' voir tout et n'importe quoi, la même carte continue d'apparaître.

Et au niveau de firebug, la carte charge quand je ne met pas cette fameuse virgule, mais j'ai ce message d'erreur :

Cependant, il y a au moins un point positif, hier je pouvais toujours tenter de changer la longitude et la latitude dans le quickstart.html, cela ne faisait rien, à part faire disparaître la carte. Maintenant l'épingle bouge

Je place quand même le contenue de mon .html au cas où

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>API Geoportail - SDIS 54</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico"/>
    <style type="text/css"><!--/*--><![CDATA[/*><!--*/
    h1 {
        text-align:center;
        font-size:0.75em;
        font-style: italic;
        width:800px;
    }
    div#example_explain {
        margin:0px 0px 10px 0px;
        border: thin solid #595E61;
        width:800px;
        position:relative;
        left:0px;
        top:0px;
        text-align:justify;
        font-size: 0.75em;
        font-style: italic;
        color: #595E61;
    }
    form#gpLangChange {
        border:0px;
        margin:0px;
        padding:0px;
    }
    div#viewerDiv {
        width:1280px;
        height:960px;
        background-color:white;
        background-image:url(http://api.ign.fr/geoportail/api/js/2.0.0/theme/geoportal/img/loading.gif);
        background-position:center center;
        background-repeat:no-repeat;
    }
    div#footer {
        font-size:x-small;
        text-align:center;
        width:800px;
    }
    div#footer a, div#footer a:link, div#footer a:visited, div#footer a:hover {
        text-decoration:none;
        color:black;
    }
    div#code a, div#code a:link, div#code a:visited, div#code a:hover {
        text-decoration:none;
        color: #595E61;
    }
     
   div#code {
        margin:0px 0px 10px 0px;
        width:800px;
        position:relative;
        left:0px;
        top:0px;
        text-align:justify;
        font-size: 0.75em;
        font-style: italic;
        
    }
    /*]]>*/--></style>
	 
  </head>
  <body>
    <h1 id="example_title"></h1>
    <form id="gpLangChange" name="gpLangChange" action="#">
      <select style="font-size:0.75em;" id="gpChooseLang" name="gpChooseLang" size="1">
        <option value="en">English</option>
        <option value="fr">Français</option>
      </select>
    </form>
    <div id="viewerDiv"></div>
	<script type="text/javascript"><!--//--><![CDATA[//><!--
            	var iv= null;
                window.onload= function() {
                
                        iv= Geoportal.load(
                                 // div's ID:
                                 'viewerDiv',
                                 // API's keys:
                                 ['ma clé'],
                                 {// map's center :
                                                // longitude:
                                                lon:4.731525,
                                                // latitude:
                                                lat:50.833333
                                 },
                                 //zoom level 
                                 null,
                                 //options
                                 {
                                 	type:'js'
                                 }
                        );
                };
                //--><!]]></script>
	<script type="text/javascript" src="http://api.ign.fr/geoportail/api/js/latest/GeoportalExtended.js"><!-- --
	 ></script>
    <script type="text/javascript" src="js/utils.js"><!-- --
	></script>     
    <script type="text/javascript" src="js/i18n/quickstart.js"><!-- --
	></script>
    <script type="text/javascript" src="js/quickstart.js"><!-- --
	></script>
    <div id="example_explain"></div>
	<!--<div id='code'><a href="./js/geoportalMap_basic.js" alt="geoportalMap_basic" id="example_jscode" target="_blank"></a></div>-->
    <div id='code'><a href="js/quickstart.js" alt="quickstart" id="example_jscode" target="_blank"></a></div>
    <div id="footer"><a href="https://api.ign.fr/geoportail/document.do?doc=legal_mentions" id="legal"  
target="_blank"></a> - &copy;IGN 2008-2013</div>
  
   
  </body>
</html>

Et le contenu de mon quickstart.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
/*
 * Copyright (c) 2008-2011 Institut Geographique National France, released under the
 * BSD license.
 */
/**
 * Property: viewer
 * {<Geoportal.Viewer>} the viewer global instance.
 */
viewer= null;

/**
 * Function: initMap
 * Load the application. Called when all information have been loaded by
 * <loadAPI>().
 */
function initMap() {
   
    // ----- Traduction
    translate();

    // ----- Options
    
    var options= {
        mode:'normal',
		territory:'FXX',
		displayProjection:'sdis'
		proxy:'assets/proxy.php?url='
    };

    viewer= new Geoportal.Viewer.Default('viewerDiv', OpenLayers.Util.extend(
        options,
        // API keys configuration variable set by <Geoportal.GeoRMHandler.getConfig>
        // variable contenant la configuration des clefs API remplie par <Geoportal.GeoRMHandler.getConfig>
        window.gGEOPORTALRIGHTSMANAGEMENT===undefined? {'apiKey':'ma clé'} : gGEOPORTALRIGHTSMANAGEMENT)
    );
    if (!viewer) {
        // problem ...
        OpenLayers.Console.error(OpenLayers.i18n('new.instance.failed'));
        return;
    }
	
   
   
    // ----- Layers
    viewer.addGeoportalLayers(['ORTHOIMAGERY.ORTHOPHOTOS']);	
    
    // ----- Autres
	viewer.getMap().setCenterAtLonLat(2.418611,48.842222,10);
}

/**
 * Function: loadAPI
 * Load the configuration related with the API keys.
 * Called on "onload" event.
 * Call <initMap>() function to load the interface.
 */
function loadAPI() {
    // wait for all classes to be loaded
    // on attend que les classes soient chargées
   if (checkApiLoading('loadAPI();',['OpenLayers','Geoportal','Geoportal.Viewer','Geoportal.Viewer.Default'])===false); {
        return;
    }
    
    Geoportal.GeoRMHandler.getConfig(['ma clé'], null,null, {
        onContractsComplete: initMap
    });
}

// assign callback when "onload" event is fired
// assignation de la fonction à appeler lors de la levée de l'évènement "onload"
window.onload= loadAPI;

**nicolas.h** · 22/03/2013, 10h31

Vos explications n'étant pas très clair pour moi, je n'ai pas réellement compris si vous souhaiter faire apparaitre une carte qui ressemble à celle du tutoriel:

http://api.ign.fr/documentation/93/d...-du-geoportail

Ou si votre problème vient de votre display projection ?

En effet au début, vous souhaiter faire le tutoriel, puis vous nous parler du Displayprojection qui lui n'est que susnommé et non appliqué dans le tutoriel en question, en attendant faute de mieux je vous transmet le code JS qui fonctionne pour arriver à la fin du tutoriel:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
/*
 * Copyright (c) 2008-2011 Institut Geographique National France, released under the
 * BSD license.
 */
 

 
/**
 * Property: viewer
 * {<Geoportal.Viewer>} the viewer global instance.
 */
viewer= null;


/**
 * Function: initMap
 * Load the application. Called when all information have been loaded by
 * <loadAPI>().
 */
function initMap() {
   
    // ----- Traduction
    translate();

    // ----- Options
    var options= {
        mode:'normal',
	territory:'FXX',
	
    };

    viewer= new Geoportal.Viewer.Default('viewerDiv', OpenLayers.Util.extend(
        options,
        // API keys configuration variable set by <Geoportal.GeoRMHandler.getConfig>
        // variable contenant la configuration des clefs API remplie par <Geoportal.GeoRMHandler.getConfig>
        window.gGEOPORTALRIGHTSMANAGEMENT===undefined? {'apiKey':'votre_clé'} : gGEOPORTALRIGHTSMANAGEMENT)
    );
    if (!viewer) {
        // problem ...
        OpenLayers.Console.error(OpenLayers.i18n('new.instance.failed'));
        return;
    }
   
    // ----- Layers
    viewer.addGeoportalLayers(['ORTHOIMAGERY.ORTHOPHOTOS','GEOGRAPHICALGRIDSYSTEMS.MAPS']);



    
    // ----- Autres
	viewer.getMap().setCenterAtLonLat(2.418611,48.842222,10);
}

/**
 * Function: loadAPI
 * Load the configuration related with the API keys.
 * Called on "onload" event.
 * Call <initMap>() function to load the interface.
 */
function loadAPI() {
    // wait for all classes to be loaded
    // on attend que les classes soient chargées
    if (checkApiLoading('loadAPI();',['OpenLayers','Geoportal','Geoportal.Viewer','Geoportal.Viewer.Default'])===false) {
        return;
    }
    
    Geoportal.GeoRMHandler.getConfig(['votre clé'], null,null, {
        onContractsComplete: initMap
    });
}

// assign callback when "onload" event is fired
// assignation de la fonction à appeler lors de la levée de l'évènement "onload"
window.onload= loadAPI;

Il vous suffirat d'y faire référence dans votre fichier HTML sans ajouter de code dans votre fichier HTML.

Des incohérences dans le quickstart.js (?)

IGN API Géoportail

Vue hybride

Discussions similaires

Partager

Partager