Position actuelle: Accueil> Derniers articles> Tutoriel PHP: Utilisez l'API de la carte Baidu pour implémenter la réponse de l'événement de clic pour Annotation Point

Tutoriel PHP: Utilisez l'API de la carte Baidu pour implémenter la réponse de l'événement de clic pour Annotation Point

M66 2025-07-31

Bibliothèque javascript pour l'introduction de l'API de la carte Baidu

L'API Baidu Map fournit des fonctions de carte puissantes et des capacités interactives pour les sites Web et les appareils mobiles. Pour utiliser les cartes Baidu dans des projets PHP, vous devez d'abord introduire la bibliothèque JavaScript des cartes Baidu sur la page. Les exemples sont les suivants:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=Votre carte BaiduAPIClé"></script>
  </head>
  <body>
    <div id="map" style="width: 100%; height: 400px;"></div>
  </body>
</html>

Veuillez remplacer votre touche API Baidu Map dans l'exemple par une clé valide que vous avez obtenue à partir de la plate-forme ouverte Baidu Map.

Les balises sont utilisées pour héberger les zones d'affichage de la carte.

Générer du code d'instance de carte à l'aide de PHP

Après avoir introduit avec succès la bibliothèque API, vous pouvez utiliser PHP pour sortir dynamiquement du code JavaScript, créer une instance de carte et définir le point central et le niveau de zoom: 

<?php
 echo '<script type="text/javascript">
     var map = new bmap.map ("map"); // Créer une instance de carte var point = new BMAP.point (116.404, 39.915); // Définissez la coordonnée du point central Map.CenterandZoom (point, 15); // Initialisez la carte, définissez le point central et le niveau de zoom</script> &#39;;;
?>

Dans le code, la carte sera affichée dans un conteneur avec carte ID, et la coordonnée du point central est la latitude et la longitude de Pékin.

Ajouter un point d'étiquette et lier un événement de clic

Afin d'atteindre l'événement de clic sur le déclenchement du point d'annotation, vous devez créer l'objet Point Annotation et le lier pour cliquer sur l'écoute: 

<?php
 echo '<script type="text/javascript">
     // Créer un point de numérotation var marqueur = new Bmap.marker (point);
     map.AdDoverlay (marqueur);

     // Ajouter un événement Cliquez à écouter marqueur.AddeventListener ("cliquez", fonction () {
       alert ("Vous avez cliqué sur le point de marquage!");
     });
 </script>&#39;;;
?>

Le code ci-dessus ajoute le point d'annotation à la carte et une fenêtre d'invite apparaît lors du clic. Vous pouvez modifier la fonction de traitement des événements selon les besoins pour implémenter des fenêtres contextuelles d'informations, des liens de saut et d'autres fonctions.

Résumer

Grâce aux étapes ci-dessus, vous pouvez facilement intégrer l'API Baidu Map dans votre projet PHP pour compléter la réponse interactive des points d'annotation MAP. L'API Baidu Map a des fonctions riches et prend en charge des opérations plus complexes. Il est recommandé de combiner des documents officiels pour apprendre en profondeur pour améliorer l'expérience de l'application de la carte.

Connexe
Derniers articles