ne s'affiche pas

**Stefan0** · 19/11/2011, 15h35

Bonjour,

On m'a demandé de rajouter une carte google maps dans une page web. Après de longues heures passés sur les tutoriels anglais de google maps, j'ai réussis à afficher google maps soit au dessus du contenu, soit au dessus, mais jamais là ou je voulais. Aujourd'hui, j'ai trouvé un tutoriel français grâce à ce forum ( http://blog.thecodingmachine.com/fr/...oogle-maps-api ). Mais maintenant, je n'arrive plus du tout à afficher de carte. Les seuls changements par apport à avant sont l'apparition d'un texte au dessus du contenu et, pendant une courte période, un message d'erreur indiquant que je devais rentrer true ou false dans le paramètre sensor (mais ça c'est réglé). Vous l'aurez compris, mon niveau est faible, apparemment trop pour ce genre de manipulation. Mais j'aimerai vraiment rendre service à la personne qui m'a demandé de mettre google maps sur sa page, alors je viens demander votre aide. J'ai volontairement modifié le texte, les images et les liens internes de la page afin de préserver l'anonymat de son auteur. De même les coordonnées du marqueur et du centre de la carte ont été modifiés.

Voici ce que Google Chrome m'affiche lorsque je lui demande d'ouvrir la page :

Les fonctions qui permettent de personnaliser la carte sont vers la fin du <body>, je le précise car j'ai vu que ça se faisait souvent dans <head> mais le tutoriel que j'ai cité tout à l'heure le fait dans <body>. Au passage, je signale que je n'ai pas fais de ligne

Code :

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

<div id="map_canvas" style="width:100%; height:100%"></div>

pour insérer la carte, comme indiquer par les tutoriels anglais car je ne l'ai pas vu dans ce tutoriel. Voici le code source de la 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
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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="Content-Type"
 content="text/html; charset=windows-1252"/>
  <meta name="GENERATOR" content="Microsoft FrontPage 4.0">
  <meta name="ProgId" content="FrontPage.Editor.Document">
  <title>Test pour insérer google maps</title> 
<script type="text/javascript" src="https://maps-api-ssl.google.com/maps/api/js?v=3.7&sensor=false"></script>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% }
</style>
 
 
</head>
<body onload="initialize()">
<table bordercolorlight="#ECFEFF" bordercolordark="#ECFEFF"
 bgcolor="#ecfeff" border="1" bordercolor="#ecfeff" height="1"
 width="100%">
  <tbody>
    <tr>
      <td bordercolorlight="#C4FDFD" bordercolordark="#C4FDFD"
 align="center" bgcolor="#c4fdfd" height="583" valign="top" width="26%">
      <p align="center"><img src="Logo6.jpg" align="top" border="0"
 height="148" width="155"></p>
      <p align="center"><b><a href="une-autre-page.htm"><font face="Georgia" color="#FF00FF" size="4">Une autre<br>
      <br>
      page du site</font></a></b></p>
      <p align="center"><b><a href="index.htm"><u><font color="#008080"
 size="4">Index du site</font></u></a></b> </p>
      <p><b><font color="#000080" face="Verdana" size="3">Un titre</font></b></p>
      <p align="center"> <b><a href="ma-page-cle.htm"><font
 color="#008080" size="3">Ma page clé</font></a></b> </p>
      <p align="center"> <b><a href="page3.htm"><font
 color="#008080" size="3">Page 3</font></a></b> </p>
      <p align="center"> <b><a href="la-page.htm"><font color="#008080"
 size="3">LA page</font></a></b> </p>
      <p align="center"> <b><a href="tout-sur-moi"><font
 color="#008080" size="3">Tout sur moi</font></a></b> </p>
      <p align="center"><b><font color="#000080" face="Verdana" size="3">Autre titre</font></b></p>
      <p align="center"> <b><a href="art-du-rien.htm"><font
 color="#008080" size="3">L'art du rien</font></a></b> </p>
      <p align="center"><b><font color="#000080" face="Verdana" size="3">3ème titre</font></b></p>
      <p align="center"><font size="3"><a
 href="moi.htm"><b><font color="#008080">Moi</font></b></a><font
 color="#008080"><b> </b></font></font></p>
      </td>
      <td bordercolor="#ECFEFF" bordercolorlight="#ECFEFF"
 bordercolordark="#ECFEFF" bgcolor="#ecfeff" height="583" valign="top"
 width="80%">
      <p align="center"> <img src="mon-autre-logo.jpg" border="0"
 height="146" width="619"> </p>
      <p align="left"><b><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font
 size="6">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font></b>
      <div align="center">
        <center>
      <table width="130%" border="0">
        <tbody>
          <tr>
            <td width="100%">
            <p align="center"><b><font color="#800000" size="6">Me contacter et localiser</font>
            </b> </p>
            </td>
          </tr>
          <tr>
            <td width="100%">
            <p align="center">&nbsp;</p>
            <b>
            <p align="center"><font color="#000080" size="4">Mon nom et prénom</font></p>
            <font size="3">
            <p align="center"><font color="#000080">Mon numéro de rue et ma rue</font></p>
            <p align="center"><font color="#000080">Mon code postal et ma ville</font></p>
            </font>
            <p align="center"><font color="#000080" size="3">Mon uméro de téléphone</font></p>
            <p align="center"><font color="#000080" size="3">Mon e-mail: </font><font
 color="#0000ff" size="3"><a href="mailto:monemail@yahoo.fr">monemail@yahoo.fr</a>&nbsp;</font></p>
            <p align="center" style="tab-stops: -750.7pt -705.7pt; margin-left: -70.9pt; margin-right: 283.85pt; margin-top: 0cm; margin-bottom: .0001pt"><b style="mso-bidi-font-weight:normal"><span style="mso-bidi-font-weight: normal"><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </font><font size="4" color="#000080">Quelque chose de pas intéressant<br>
 
            </font>
            </span></b></p>
            <p align="center" style="tab-stops: -750.7pt -705.7pt; margin-left: -70.9pt; margin-right: 283.85pt; margin-top: 0cm; margin-bottom: .0001pt"><b style="mso-bidi-font-weight:normal"><font color="#000080" size="4"><span style="mso-bidi-font-weight: normal">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            Un autre truc pas intéressant<o:p>
            </span></font><span style="font-size:14.0pt">
            </o:p>
            </span></b></p>
            </b>
            <p align="center">&nbsp; </p>
			<p align="center">La carte google maps devrait s'afficher entre ici</p>
			<script type="text/javascript">
function initialize() {
    var maLatlng = new google.maps.LatLng(97.544441910939, 95.122767090797424);
    var mesOptions = {
        zoom: 12,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.HYBRID
		panControl: false,	
		zoomControl: true,
		zoomControlOptions: {
			style: google.maps.ZoomControlStyle.LARGE,
			position: google.maps.ControlPosition.LEFT_CENTER
		mapTypeControl: false, 
		scaleControl: false, 
		streetViewControl: false, 
		overviewMapControl: false}
    }
    var carte = new google.maps.Map(document.getElementById("map_canvas"), mesOptions);
    var image = 'monmarqueur.png';
    // Instanciation de notre marqueur
    var marker = new google.maps.Marker({
        position: maLatLng,
        map: carte,
        icon: image
    });
    var message = "Mon message";
    var infowindow = new google.maps.InfoWindow({
        content: message,
        size: new google.maps.Size(50,50)
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(carte,marker);
    });}
	// Création de la balise script pour inclure les fonctions de Google Maps dans notre application
function loadScript() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialisation";
    document.body.appendChild(script);
}
// Au chargement de la page on appelle la fonction loadScript qui appelle la fonction initialisation() grâce au paramètre callback
window.onload = loadScript;
</script>
			<p align="center">
			<div id="map_canvas" style="width: 90%; height: 90%"></div></p>
			<p align="center">et ici...</p>
			</p>
            </td>
          </tr>
        </tbody>
      </table>
        </center>
      </div>
      </td>
    </tr>
  </tbody>
</table>
<p>&nbsp;</p>
</body>
</html>

Merci d'avance pour d'éventuels corrections du code source ou conseils!

PS : Je viens de me rendre compte que ce forum possède une F.A.Q. google maps

. Je vais essayer de trouver ma réponse dedans mais n'hésitez pas à répondre si vous détectez des erreurs (je sais qu'il y en a beaucoup

).

PPS : Si vous comprenez pourquoi le texte est mal centré (un peu excentré à droite) et pourquoi l'image "mon-autre-logo.jpg" est un peu écrasé, merci de me le signaler.

EDIT : Oups, j'oubliais, je souhaite qu'il n'y ai aucun bouton sur la carte à part le zoom. Je souhaite que le centre de la carte, le marqueur (qui aura un icone créé par mes soins) et l'infobulle aient les mêmes coordonnées. Je voulais aussi que le seul type de carte possible soit le type mixte (ou hybride).

**NoSmoking** · 19/11/2011, 22h12

Bonsoir,
pas mal de remarques sur ce que tu soumets

Lors de la déclaration des propriétés d'un objet il est IMPERATIF de séparer les déclaration par une virgule et il est IMPERATIF de ne pas en mettre après la dernière déclaration sous peine de panne du script.

Sur la déclaration des options de ta map on peut lire, ré indenté pour l'occasion :

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
var mesOptions = {
  zoom: 12,
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.HYBRID
  panControl: false,
  zoomControl: true,
  zoomControlOptions: {
    style: google.maps.ZoomControlStyle.LARGE,
    position: google.maps.ControlPosition.LEFT_CENTER
    mapTypeControl: false,
    scaleControl: false,
    streetViewControl: false,
    overviewMapControl: false
  }
}

il manque au moins DEUX virgules

Dans ce même code on peut lire également

Code :

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

<body onload="initialize()">

puis

Code :

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

window.onload = loadScript;

qui fait donc appel à la fonction loadScript qui elle se charge de charger le script "http://maps.google.com/maps/api/js?sensor=false&callback=initialisation" qui donc appel la fonction initialisation au chargement.

Sauf que tu as déchargé le script en début de fichier dans le HEAD, et que l'on ne trouve pas de trace de la fonction initialisation dans ta partie SCRIPT.

Une petite remarque au passage, mettre une DIV dans une balise P c'est moyen mais bon, pour m'amener au pourquoi la carte ne s'affiche pas.

Mettre une height:100% c'est bien à condition que le conteneur parent est une hauteur réelle, mathématiquement parlant 100% de 0px donnera 0px et ce quoiqu'il arrive même si Raymond DEVOS à montré que trois fois rien c'est déjà quelque chose

Envoyé par Raymond DEVOS

Une fois rien... c'est rien !
Deux fois rien... c'est pas beaucoup !
Pour trois fois rien on peut déjà acheter quelque chose !

donc mets une hauteur, une vrai, une fixe en px pour être sûr que celle ci apparaisse.

Commence déjà par corriger tout cela.

Remarques :
- Javascript est sensible à la casse ce qui signifie que maLatlng est différent de maLatLng.
-Quant à utiliser un tutoriel autant le suivre du début à la fin sans chercher à faire un mixte de plusieurs.
- J'en conclu que ce post est une suite logique à ce POST.

**Stefan0** · 20/11/2011, 11h58

Merci beaucoup pour votre réponse très complète. En effet, ce sujet est une "suite logique" du précédent, j'ai tenté de comprendre comment les cartes fonctionnaient. Je n'ai pas vraiment cherché à faire un mixte de plusieurs tutoriels mais il semble que je me sois emmêler les pinceaux. Je me plonge dans vos corrections dès l'envois de ce message. Je vous remercie encore!

EDIT : Grâce aux précieux conseils de NoSmoking, j'ai presque réussis à faire tout ce que je voulais, et j'ai même rajouté une deuxième APIs de type streetview. Il n'y a plus que deux petites améliorations que j'aimerais faire :
1) Rajouter un bouton pour modifier l'orientation de la carte (autrement dit, avoir la possibilité de mettre le nord vers la gauche, vers le bas... etc) si c'est possible. J'ai cru comprendre qu'il fallait mettre true dans rotateControl pour l'activer mais qu'il fallait en plus la commande rotateControlOptions pour l'afficher. Mais je trouve pas de documentation sur rotateControlOptions pour l'instant.

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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Test</title>
<script src="//maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">
 
  function initialize() {
    var fenway = new google.maps.LatLng(46.179744978442315, 0.1656585931777954);
    var mapOptions = {
      center: fenway,
      zoom: 12,
	mapTypeControl: false,
	panControl: false, // affiche le rond avec 4 flèches, autre moyen de se déplacer.
	scaleControl: false, // affiche ou non l'échelle
	rotateControl: false, // il manque des options pour s'en servir et impossible de trouver de la documentation sur rotateControlOptions
	overviewMapControl: true, // affiche la mini carte
	streetViewControl: false, // active/désactive streetview
      mapTypeId: google.maps.MapTypeId.HYBRID
 
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"), mapOptions);
    var panoramaOptions = {
      position: fenway,
      pov: {
        heading: 290,
        pitch: 0,
        zoom: 1
      }
    };
    var panorama = new  google.maps.StreetViewPanorama(document.getElementById("pano"),panoramaOptions);
    map.setStreetView(panorama);
    var myLatLng = new google.maps.LatLng(46.17978583587941, 0.1658463478088379);
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        iconURL: "http://www.mon-icone-hébergé.png",
    });
    var marker = new google.maps.Marker({
        position: myLatLng,
        map: panorama,
        iconURL: "http://www.mon-autre-icone-hébergé.png",
    });
  }
</script>
</head>
<body onload="initialize()">
<table bordercolorlight="#ECFEFF" bordercolordark="#ECFEFF"
 bgcolor="#ecfeff" border="1" bordercolor="#ecfeff" height="1"
 width="100%">
  <tbody>
    <tr>
      <td bordercolorlight="#C4FDFD" bordercolordark="#C4FDFD"
 align="center" bgcolor="#c4fdfd" height="583" valign="top" width="26%">
      <p align="center"><img src="Logo6.jpg" align="top" border="0"
 height="148" width="155"></p>
      <p align="center"><b><a href="une-autre-page.htm"><font face="Georgia" color="#FF00FF" size="4">Une autre<br>
      <br>
      page du site</font></a></b></p>
      <p align="center"><b><a href="index.htm"><u><font color="#008080"
 size="4">Index du site</font></u></a></b> </p>
      <p><b><font color="#000080" face="Verdana" size="3">Un titre</font></b></p>
      <p align="center"> <b><a href="ma-page-cle.htm"><font
 color="#008080" size="3">Ma page clé</font></a></b> </p>
      <p align="center"> <b><a href="page3.htm"><font
 color="#008080" size="3">Page 3</font></a></b> </p>
      <p align="center"> <b><a href="la-page.htm"><font color="#008080"
 size="3">LA page</font></a></b> </p>
      <p align="center"> <b><a href="tout-sur-moi"><font
 color="#008080" size="3">Tout sur moi</font></a></b> </p>
      <p align="center"><b><font color="#000080" face="Verdana" size="3">Autre titre</font></b></p>
      <p align="center"> <b><a href="art-du-rien.htm"><font
 color="#008080" size="3">L'art du rien</font></a></b> </p>
      <p align="center"><b><font color="#000080" face="Verdana" size="3">3ème titre</font></b></p>
      <p align="center"><font size="3"><a
 href="moi.htm"><b><font color="#008080">Moi</font></b></a><font
 color="#008080"><b> </b></font></font></p>
      </td>
      <td bordercolor="#ECFEFF" bordercolorlight="#ECFEFF"
 bordercolordark="#ECFEFF" bgcolor="#ecfeff" height="583" valign="top"
 width="80%">
      <p align="center"> <img src="mon-autre-logo.jpg" border="0"
 height="146" width="619"> </p>
      <p align="left"><b><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font
 size="6">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font></b>
      <div align="center">
        <center>
      <table width="130%" border="0">
        <tbody>
          <tr>
            <td width="100%">
            <p align="center"><b><font color="#800000" size="6">Me contacter et localiser</font>
            </b> </p>
            </td>
          </tr>
          <tr>
            <td width="100%">
            <p align="center">&nbsp;</p>
            <b>
            <p align="center"><font color="#000080" size="4">Mon nom et prénom</font></p>
            <font size="3">
            <p align="center"><font color="#000080">Mon numéro de rue et ma rue</font></p>
            <p align="center"><font color="#000080">Mon code postal et ma ville</font></p>
            </font>
            <p align="center"><font color="#000080" size="3">Mon numéro de téléphone</font></p>
            <p align="center"><font color="#000080" size="3">Mon e-mail: </font><font
 color="#0000ff" size="3"><a href="mailto:monemail@yahoo.fr">monemail@yahoo.fr</a>&nbsp;</font></p>
            <p align="center" style="tab-stops: -750.7pt -705.7pt; margin-left: -70.9pt; margin-right: 283.85pt; margin-top: 0cm; margin-bottom: .0001pt"><b style="mso-bidi-font-weight:normal"><span style="mso-bidi-font-weight: normal"><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</font><font size="4">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </font><font size="4" color="#000080">Quelque chose de pas intéressant<br>
 
            </font>
            </span></b></p>
            <p align="center" style="tab-stops: -750.7pt -705.7pt; margin-left: -70.9pt; margin-right: 283.85pt; margin-top: 0cm; margin-bottom: .0001pt"><b style="mso-bidi-font-weight:normal"><font color="#000080" size="4"><span style="mso-bidi-font-weight: normal">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            Un autre truc pas intéressant<o:p>
            </span></font><span style="font-size:14.0pt">
            </o:p>
            </span></b></p>
            </b>
<br><br><br><br>
<div id="map_canvas" style="width: 600px; height: 400px"></div>
<br><br><br><br>
  <div id="pano" style="width: 600px; height: 400px;"></div>
</td>
          </tr>
        </tbody>
      </table>
        </center>
      </div>
      </td>
    </tr>
  </tbody>
</table>
<p>&nbsp;</p>
</body>
</html>

Et voici à quoi ressemble la page (on sais jamais ça peut-être servir) :

Merci d'avance pour votre aide!

**NoSmoking** · 22/11/2011, 23h16

Rajouter un bouton pour modifier l'orientation de la carte (autrement dit, avoir la possibilité de mettre le nord vers la gauche, vers le bas... etc) si c'est possible. J'ai cru comprendre qu'il fallait mettre true dans rotateControl pour l'activer mais qu'il fallait en plus la commande rotateControlOptions pour l'afficher. Mais je trouve pas de documentation sur rotateControlOptions pour l'instant.

cette fonctionnalité n'est pas à a connaissance disponible sur les cartes à plat.

C'est disponible sur les vues satellites et à un certains niveau de zoom et uniquement si les vues à 45° sont disponibles.

Essaies de zoomer une carte en mode satellite et regarde si le mode 45° est présent.

ne s'affiche pas

APIs Google

Discussions similaires

Partager

Partager