Intégrer le code Google Map en HTML avec un marqueur

J'ai plusieurs endroits avec leur latitude et leur longitude. Je veux les afficher dans google map. C'est ok, ce que je ne peux pas est d'afficher le marqueur à la position lat,longue spécifique.

Par exemple, si j'ai le code suivant, est-il possible de placer une option pour afficher le marché car tous les lat, long coord viennent d'une base de données et font écho à php

<iframe width="425" height="350" frameborder="0" scrolling="no" 
        marginheight="0" marginwidth="0" 
        src="http://maps.google.mu/?ie=UTF8&amp;ll=-20.234496,57.603722&amp;spn=0.093419,0.169086&amp;t=m&amp;z=13&amp;
        output=embed"></iframe>
        <br />
        <small><a href="http://maps.google.mu/?ie=UTF8&amp;ll=-20.234496,57.603722
                  &amp;spn=0.093419,0.169086&amp;t=m&amp;z=13&amp;source=embed"
               style="color:#0000FF;text-align:left">View Larger Map
               </a>
        </small>
21
demandé sur SALAMAT Med Ayman 2012-05-02 18:30:33

5 réponses

L'élément que vous avez posté semble être simplement copié-collé à partir de la fonctionnalité d'intégration de Google Maps.

Si vous souhaitez supprimer des marqueurs pour les emplacements que vous avez, vous devrez écrire du JavaScript pour le faire. Je suis en train d'apprendre comment faire cela.

Consultez ce qui suit: https://developers.google.com/maps/documentation/javascript/overlays

Il a plusieurs exemples et exemples de code qui peuvent être facilement réutilisés et adaptés pour s'adapter à votre courant problème.

11
répondu zigzag 2012-05-02 14:39:49

Je suggère de cette façon, une ligne iframe. aucun javascript nécessaire du tout. Dans la requête ?q=,

<iframe src="http://maps.google.com/maps?q=12.927923,77.627108&z=15&output=embed"></iframe>
41
répondu naren 2015-07-07 06:59:34

Apprendre la bibliothèque JavaScript de Google est une bonne option. Si vous n'avez pas envie d'entrer dans le codage, vous trouverez peut-être Maps Engine Lite utile.

C'est un outil récemment publié par Google où vous pouvez créer vos cartes personnelles (créer des marqueurs, dessiner des géométries et adapter les couleurs et les styles).

Voici un tutoriel utile que j'ai trouvé: Conseil Rapide: Intégrer De Nouvelles Cartes Google

6
répondu linqu 2013-11-19 08:08:27

Pas besoin d'outils javascript ou tiers, utilisez ceci:

<iframe src="https://www.google.com/maps/embed/v1/place?key=<YOUR API KEY>&q=71.0378379,-110.05995059999998"></iframe>

Le lieu paramètre fournit le marqueur

Il y a quelques options pour le format du paramètre' q '

Assurez-vous que L'API Google Maps Embed et L'API Static Maps sont activées dans vos API, sinon google bloquera la requête

Pour plus d'informations, consultez ici

3
répondu uofc 2015-08-04 19:44:36

Utilisez ceci, N'oubliez pas d'obtenir une clé api google à partir de

Https://console.developers.google.com/apis/credentials

Et le remplacer

    <div id="map" style="width:100%;height:400px;"></div>

<script>
function myMap() {

var map = new google.maps.Map(document.getElementById("map"), mapOptions);
  var myCenter = new google.maps.LatLng(38.224905, 48.252143);
  var mapCanvas = document.getElementById("map");
  var mapOptions = {center: myCenter, zoom: 16};
  var map = new google.maps.Map(mapCanvas, mapOptions);
  var marker = new google.maps.Marker({position:myCenter});
  marker.setMap(map);
}
</script>

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=myMap"></script>
1
répondu masoud Cheragee 2018-06-07 09:26:32