Affichage carte IGN dans google maps

**nrdz83** · 30/07/2016, 23h39

Bonjour à tous,

je n'y connais rien du tout en javascript, je cherche à afficher une carte IGN dans google maps sur un champ active x.

J'ai récupéré le code ci dessous sur le site API IGN >>>http://api.ign.fr/documentation/324/...pi-google-maps

j'ai adapté ce code en un mettant mes clefs google et IGN.

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
<!DOCTYPE html>
<html>
	<head>		
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<style type="text/css">
  		#map-canvas{
			width:800px;
			height:600px;
		}
	</style>	
	<script type="text/javascript"
  	src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCcuBlQ1Qm2dIVTITc0Q8ROAN3ufDZCoLo&sensor=true">
	</script>
	<script type="text/javascript">
	function initialize() {
		var tiledLayer=new google.maps.ImageMapType({
			getTileUrl: function(tileCoord,zoom) {
			    var url="http://wxs.ign.fr/3kisnujel7glkt8hwux0qzpx/geoportail/wmts?"+
				"LAYER=ORTHOIMAGERY.ORTHOPHOTOS"+
				"&FORMAT=image/jpeg&SERVICE=WMTS&VERSION=1.0.0"+
				"&REQUEST=GetTile&STYLE=normal&TILEMATRIXSET=PM"+
				"&TILEMATRIX="+zoom+"&TILEROW="+tileCoord.y+
				"&TILECOL="+tileCoord.x;
			    return url;			    
			},
			tileSize: new google.maps.Size(256,256),
			name: "Carte IGN",
			maxZoom: 18
		});
 
		var mapOptions = {
			mapTypeId: 'IGNLayer',
			center: new google.maps.LatLng(47.60,1.74),
			zoom: 12,
			mapTypeControlOptions: {
				mapTypeIds: ['IGNLayer',google.maps.MapTypeId.ROADMAP]
			}
		};
 
		var map = new google.maps.Map(document.getElementById("map-canvas"),
		mapOptions);
		map.mapTypes.set('IGNLayer',tiledLayer);
	}
	google.maps.event.addDomListener(window, 'load', initialize);
	</script>	
	</head>
	<body>
		<div id="map-canvas"/>
	</body>
<html>

Mon problème est le suivant:

- dans mon champ active x la carte IGN ne se charge pas le fond reste gris, et si je clique sur sur le bouton plan la carte google s'affiche.

Quelqu'un pourrait me dire d'ou cela peut venir?

Je n'arrive pas non plus à centrer la carte par rapport au champ active x

Nom : 1.jpg
Affichages : 282
Taille : 19,3 Ko

Nom : 1.jpg
Affichages : 282
Taille : 19,3 Ko

Nom : 2.jpg
Affichages : 270
Taille : 60,0 Ko

Par avance je vous remercie pour votre aide.

Cordialement.

**NoSmoking** · 31/07/2016, 09h06

Bonjour,

- dans mon champ active x la carte IGN ne se charge pas le fond reste gris, et si je clique sur sur le bouton plan la carte google s'affiche.

tu as visiblement un problème de droit avec ta clé si l'on regarde le message d'erreur envoyé

Code xml :

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

1
2
3
4
5
<ExceptionReport>
<Exception exceptionCode="MissingRights">
Wrong referer or wrong IP Adress or wrong User-Agent
</Exception>
</ExceptionReport>

tu devrais poser ta question sur le forum IGN API Géoportail, il semblerait que ce problème ait déjà été abordé.

Je n'arrive pas non plus à centrer la carte par rapport au champ active x

je ne sais pas ce que tu appelles « champ active x » mais si c'est la fenêtre alors il te faut ajouter un margin:auto dans le CSS de ta <div id="map-canvas">.

Code css :

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

1
2
3
4
5
#map-canvas{
    width:800px;
    height:600px;
    margin:auto;
}

**nrdz83** · 31/07/2016, 09h27

Bonjour nosmoking,

je te remercie pour ton aide apporté, je vais voir du côté de la clé IGN, et merci pour le code afin de centrer la carte.

La carte est affichée dans une application windev une fenêtre et un champ activeX

Bonne fin de journée

Cordialement.

Affichage carte IGN dans google maps

JavaScript

Discussions similaires

Partager

Partager