Affichage de la carte avec l'api google maps

Résolu/Fermé

zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 - 7 juin 2012 à 19:12
zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 - 7 juin 2012 à 21:45

Bonjour,

je créer actuellement un site web pour la location d'un appartement. Je souhaite afficher une carte avec la localisation de l'appartement en question grâce a l'api google map. Jusque la pas de problème je récupère bien la carte. Mon problème est que je n'arrive pas à l'affichée ou je voudrais. voici le code que j'utilise :

HTML:

<body >

<div class="header">
<div class="formConnect">
s'identifier

</div>
<div class="htPage">
autre info
</div>
</div><br/>
<div class="erreurCont"><?php
//include('message.inc.php');
?></div><br/>
<div class="conteneur">
<div class="menu">
<?php
include 'menu.php';
?>
</div><br/>
<div id="map_canvas">

</div>
</div><br/>
<div class="footer">
<?php
?>
pied de page

</div>
</body>

JavaScript :

map = new google.maps.Map(document.getElementById("map_canvas"), {
zoom: 17,
center: new google.maps.LatLng(34.023685, -5.016778),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
map.panTo(new google.maps.LatLng(34.023685, -5.016778));
var marker = new google.maps.Marker({
position: new google.maps.LatLng(34.023685, -5.016778),
map: map,
title: 'appartement'

});

var marker1 = new google.maps.Marker({
position: new google.maps.LatLng(34.023286, -5.015911),
map: map,
title: 'Nausikaa-Spa'
});
var marker2 = new google.maps.Marker({
position: new google.maps.LatLng(34.026060, -5.013983),
map: map,
title: 'La Villa'
});

merci d'avance pour votre aide

A voir également:

Affichage de la carte avec l'api google maps
Google maps satellite - Guide
Dns google - Guide
Coordonnées gps google maps - Guide
Télécharger carte google maps - Guide
Google earth - Télécharger - 3D

10 réponses

Réponse 1 / 10

zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 1
Modifié par zeO_34 le 7/06/2012 à 22:22

je te remercie de ton aide l'ami j'ai suivie tn conseil avec le css ca avance un peu :) il fallait mettre la div map canvas en position absolute en css

Réponse 2 / 10

acid3max Messages postés 37 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 8 juin 2012 5
Modifié par acid3max le 7/06/2012 à 20:29

Quand tu dit afficher ?? Tu veu parler de ta carte google ou de ton marker contenu dans ta carte google ???

Réponse 3 / 10

zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 1
7 juin 2012 à 20:40

je veux parlé de ma carte google. le problème que je rencontre c'est que dans mon code html si je sors ma div "map_canvas" de la div"conteneur" ca marche nikel or je voudrais que ma carte s'affiche dans le conteneur

Réponse 4 / 10

acid3max Messages postés 37 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 8 juin 2012 5
Modifié par acid3max le 7/06/2012 à 20:52

Joue avec le css dans ta div map_canvas

<div style="margin:?px ?px ?px ?px; position:relative ou absolute;" id="map_canvas"></div>

OU

Met ta <div id="map_canvas"></div> dans une autre

<div style="margin ou padding:?px ?px ?px ?px; position:relative ou absolute;">
<div id="map_canvas"></div>
</div>

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 10

zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 1
7 juin 2012 à 21:04

ma div <div id="map_canvas" ></div> ce trouve déjà dans une autre <div class = "conteneur"></div>
je pense que le problème vient de mon js je pense que lorsque je fait
map = new google.maps.Map(document.getElementById("map_canvas") le getElementById ne trouve pas l'id map_canvas alors que lorsque la div map_canvas ne se trouve pas dans une autre ca marche

Réponse 6 / 10

acid3max Messages postés 37 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 8 juin 2012 5
7 juin 2012 à 21:18

Essais de mettre ton code JS avant ton <div id="map_canvas"> </div>

Réponse 7 / 10

zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 1
7 juin 2012 à 21:27

j'ai essayé mais ca ne change rien... en tt cas merci de ton aide

Réponse 8 / 10

acid3max Messages postés 37 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 8 juin 2012 5
Modifié par acid3max le 7/06/2012 à 21:29

lol tu peu me shooter ton url j'ai une tête de cochon et j'ai du en plugué une centaine de carte google comme sa lol

Réponse 9 / 10

zeO_34 Messages postés 6 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 7 juin 2012 1
7 juin 2012 à 21:30

bah je code en locale pr le moment il n'est pas encore en ligne ca m'enerve je suis pas loin mais bon je debute donc ca doit etre un truc bete

Réponse 10 / 10

acid3max Messages postés 37 Date d'inscription jeudi 7 juin 2012 Statut Membre Dernière intervention 8 juin 2012 5
7 juin 2012 à 21:39

D'accord je te laisse aller bonne chance l'ami sinon voici un lien très utile pour google map.. du geocoding etc...

http://labs.mario.ec/jquery-gmap/

Newsletters