Exemples d'application et tutoriels de l'API Baidu Map en PHP

Exemples d'application et didacticiels de l'API Baidu Map en PHP

L'API Baidu Map est une interface de développement de cartes gratuite lancée par Baidu, qui peut facilement implémenter l'affichage de la carte, la recherche, la navigation et d'autres fonctions dans votre propre site Web ou application. Cet article explique comment utiliser l'API Baidu Map en PHP et fournit quelques exemples d'application pratiques.

1. Utilisation de base de l'API Baidu Map

1. Enregistrez un compte développeur Baidu Map et créez une application

Tout d'abord, nous devons enregistrer un compte développeur sur la plateforme ouverte Baidu Map et créer une application. Lors de la création d'une application, vous obtiendrez une clé API (ak), qui sera utilisée dans le code suivant.

2. Présentez la bibliothèque JavaScript de l'API Baidu Map

Dans le fichier php, nous devons introduire la bibliothèque JavaScript de l'API Baidu Map, vous pouvez utiliser le code suivant :

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的API密钥"></script>

Parmi eux, la clé API doit être remplacé par votre propre clé.

3. Créer un conteneur de carte

Utilisez le code suivant pour créer un conteneur de carte dans une page Web :

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

Parmi eux, l'élément div avec l'identifiant "map" est utilisé pour placer la carte.

4. Initialisez la carte et définissez le point central

Dans le code JavaScript, nous devons initialiser la carte et définir le point central de la carte, utilisez le code suivant :

<script>
    // 创建Map实例
    var map = new BMap.Map("map");
    // 设置中心点坐标
    var point = new BMap.Point(116.404, 39.915);
    // 初始化地图，设置中心点坐标和地图级别
    map.centerAndZoom(point, 15);
</script>

où, 116,404 représente la longitude, 39,915 représente La latitude et le niveau de carte 15 représentent le niveau d'affichage est le niveau de la rue.

5. Ajouter une étiquette

Vous pouvez utiliser le code suivant pour ajouter une étiquette sur la carte :

<script>
    // 创建标注点
    var marker = new BMap.Marker(point);
    // 添加标注点到地图上
    map.addOverlay(marker);
</script>

Après avoir exécuté le code ci-dessus, vous pouvez voir un point d'étiquette sur la carte.

2. Exemple d'application de l'API Baidu Map en PHP

Ce qui suit est un exemple simple pour illustrer comment utiliser l'API Baidu Map en PHP.

Supposons que nous ayons une exigence : afficher l'emplacement du magasin sur une page Web et le marquer sur la carte.

Voici les étapes simples suivantes à titre de référence :

1. Créer une table de base de données

Tout d'abord, nous devons créer une table de base de données pour stocker les informations de localisation du magasin. La structure de la table peut faire référence au code suivant :

CREATE TABLE `store` (
  `id` INT UNSIGNED AUTO_INCREMENT,
  `name` VARCHAR(50) NOT NULL,
  `address` VARCHAR(100) NOT NULL,
  `longitude` DOUBLE NOT NULL,
  `latitude` DOUBLE NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=INNODB DEFAULT CHARSET=utf8;

2. Ajouter des informations sur le magasin à la base de données

Pour ajouter des informations sur l'emplacement du magasin dans la base de données, vous pouvez utiliser le code suivant :

INSERT INTO `store` (`name`, `address`, `longitude`, `latitude`) VALUES
('商店A', '地址A', 116.404, 39.915),
('商店B', '地址B', 116.404, 39.915),
('商店C', '地址C', 116.404, 39.915);

3. Exemple de code PHP

Écrivez du code PHP à partir de la base de données Pour lire les informations du magasin et les marquer sur la carte, utilisez le code suivant :

<?php
// 连接数据库
$servername = "localhost";
$username = "root";
$password = "123456";
$dbname = "test";

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}

// 从数据库中读取商店信息
$sql = "SELECT * FROM store";
$result = $conn->query($sql);

// 输出商店信息到JavaScript数组
$stores = array();
while ($row = $result->fetch_assoc()) {
    $stores[] = $row;
}
?>

<script>
    var map = new BMap.Map("map");
    var point = new BMap.Point(<?php echo $stores[0]['longitude']; ?>, <?php echo $stores[0]['latitude']; ?>);
    map.centerAndZoom(point, 15);

    <?php foreach ($stores as $store): ?>
    var storePoint = new BMap.Point(<?php echo $store['longitude']; ?>, <?php echo $store['latitude']; ?>);
    var storeMarker = new BMap.Marker(storePoint);
    map.addOverlay(storeMarker);
    <?php endforeach; ?>
</script>

Enregistrez le code ci-dessus en tant que fichier php, exécutez le fichier et vous pourrez voir la carte sur la page Web et l'afficher. l'emplacement du magasin.

Grâce aux exemples ci-dessus, nous pouvons voir comment utiliser l'API Baidu Map en PHP et implémenter quelques fonctions simples. Vous pouvez apprendre et explorer davantage d'autres fonctions de l'API Baidu Map selon vos besoins, et les appliquer dans vos propres projets. J'espère que cet article pourra vous être utile.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!