API SDK Géoportail Ajout couches

Bonjour,

j'ai un petit soucis sur mon API géoportail pour l'introduire dans ma page web, je n'ai pas l'affichage des couches, mais seulement des widgets (recherche, zoom, marqueur...) mais je n'ai aucun affichage sur les cartes.

Voici mon

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <!-- SDK Géoportail -->
    <script src="api/GpSDK-2D-3.1.9/GpSDK2D.js"></script>
    <link rel="stylesheet" href="api/GpSDK-2D-3.1.9/GpSDK2D.css" />
    <script type="module" src="js/map.js"></script>
</head>
    <body>
		<div id="mapDiv"></div>
 
    </body>
</html>

Et mon code JS :

Code:

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
 
var map = Gp.Map.load(
    "mapDiv",   // identifiant du conteneur HTML
    // options d'affichage de la carte (Gp.MapOptions)
    {           
         // clef d'accès à la plateforme
         apiKey: "********",
         // centrage de la carte
         center : {
            x : -4.620391,
            y : 48.268698,
            projection : "CRS:84"
         },
         // niveau de zoom de la carte (de 1 à 21)
         zoom : 15,
         // Couches à afficher
         layersOptions : {
            // Couche photographies aériennes
            "ORTHOIMAGERY.ORTHOPHOTOS" : {},
            // Couche photographies aériennes
            "GEOGRAPHICALGRIDSYSTEMS.MAPS.SCAN-EXPRESS.STANDARD" : {
                opacity : 0.3
            }
         },
         // Outils additionnels à proposer sur la carte
         controlsOptions : {
             // ajout d'une barre de recherche
             "search" : {
                 maximised : true
             }
         },
         layerswitcher : {
             // HTML cible pour les couches, par défaut, même div que la map
             div : {},
             // si le controle est ouvert ou non
             maximised : true
         },
         // Repères visuels
         markersOptions : [{
             content : "<h1>Pôle Géosciences</h1><br/><p>73 avenue de Paris, Saint-Mandé</p><br/><p><a href='http://www.pôle-géosciences.fr/index.htm' target='_blank'>Site Web</a></p>"
         }]
 
    }    
) ;

Merci d'avance si vous avez une idée pour m'aider.