[WB17] utilisation de l'API Géoportail

**courdi95** · 05/05/2012, 17h56

Bonjour,

Je viens de mettre en place un contrat gratuit ign pour bénéficier de l'API Géoportail : https://api.ign.fr/geoportail/index.do

Cette API Javascript permet l'insertion de cartes interactives Géoportail dans des pages web.

Pour faire les tests, l'IGN fournit un code HTML contenant du JS à metttre dans une page :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>API Geoportail - votre carte personnelle</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <style type="text/css"><!--/*--><![CDATA[/*><!--*/
    div#viewerDiv {
        width:800px;
        height:600px;
        background-color:white;
        background-image:url(http://api.ign.fr/geoportail/api/js/1.3/theme/geoportal/img/loading.gif);
        background-position:center center;
        background-repeat:no-repeat;
    }
    /*]]>*/--></style>
 
  </head>
  <body>
 
    <div id="viewerDiv"></div>
    <script type="text/javascript"><!--//--><![CDATA[//><!--
    window.onload= function() {
        Geoportal.load(
            // div's ID:
            'viewerDiv',
            // API's keys:
            ['maCleAPI'],
            {// map's center :
                // longitude:
                lon:2.731525,
                // latitude:
                lat:45.833333
            }
        );
    };
    //--><!]]></script>
 
    <script
    type="text/javascript"
    src="http://api.ign.fr/geoportail/api/js/1.3/Geoportal.js">
  <!-- -->
  </script>
  </body>
</html>

J'ai voulu donc utiliser cet exemple
- en créant une page Web dynamique
- en chargeant l'API dans la page (Description/Avancée/Javascript)
- en créant un champ HTML vide : HTM_SansNom1
- en créant un bouton qui appelle une procédure globale JS

Code :

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

1
2
3
4
5
6
7
function LoadMapGlobal()
{
	window.onload= function() {
		Geoportal.load(HTM_SansNom1,['maCleAPI'],{lon:2.731525,lat:45.833333});
		};
 
}

Je pensais donc que le clic bouton permettrait d'appeler la procédure LoadMapGlobal, qui permettrait de charger mon champ HTML avec la carte .... mais rien ne se passe ......

Est-ce que quelqu'un peut m'aider ??

**courdi95** · 12/05/2012, 05h00

Je relance mon post .... personne n'a d'idee sur la maniee d'integrer l'api geoportail dans une page webdev ?

**EriCstoFF** · 24/09/2012, 10h15

Bonjour, ton javascript tu ne le mets pas au bon endroit, il faut aller dans le code "chargement (onload) de la page (navigateur)", cliquer WL pour le mettre en mode JS et tu colles ta fonction ici.

[WB17] utilisation de l'API Géoportail

WebDev

Vue hybride

Discussions similaires

Partager

Partager