Tutoriel sur l'utilisation de PHP et de l'API Baidu Map pour implémenter la fonction d'affichage de trajectoire de taxi-tutoriel php-php.cn

Tutoriel sur l'utilisation de PHP et de l'API Baidu Map pour implémenter la fonction d'affichage de trajectoire de taxi

PHPz

Libérer： 2023-07-31 13:54:01

original

1267 Les gens l'ont consulté

Tutoriel sur l'utilisation de PHP et de l'API Baidu Map pour implémenter la fonction d'affichage de trajectoire de taxi

Résumé :
Ce tutoriel présentera comment utiliser PHP et l'API Baidu Map pour implémenter la fonction d'affichage de trajectoire de taxi. Nous utiliserons l'API JavaScript de Baidu Maps pour dessiner la carte et obtenir les données de trajectoire de taxi à partir de la base de données via PHP. À terme, nous montrerons la trajectoire de mouvement de chaque taxi et ajouterons quelques fonctionnalités interactives.

Préparation
Avant de commencer, vous devez préparer le travail suivant :
Installer PHP et une base de données (telle que MySQL)
Enregistrer un compte développeur Baidu Maps et obtenir une clé API
Préparer les données de trajectoire de taxi
Créer une base de données
Tout d'abord, nous devons créer une table de base de données pour stocker les données de trajectoire du taxi. Supposons que nous devions stocker les données de longitude, de latitude et d'horodatage de chaque taxi. Créez un tableau nommé « pistes » et ajoutez les champs suivants :
```
CREATE TABLE `tracks` (
  `id` INT(11) UNSIGNED AUTO_INCREMENT PRIMARY KEY,
  `car_id` INT(11) NOT NULL,
  `lng` DOUBLE NOT NULL,
  `lat` DOUBLE NOT NULL,
  `timestamp` INT(11) NOT NULL
);
```
Copier après la connexion
Insérer les données de test
Insérez des données de test dans la table de base de données créée à l'étape précédente pour un affichage ultérieur des pistes. Par exemple :
```
INSERT INTO `tracks` (`car_id`, `lng`, `lat`, `timestamp`) VALUES
(1, 116.404, 39.915, 1600000000),
(1, 116.406, 39.920, 1600000100),
...
```
Copier après la connexion

Créer un script PHP
Créez un script PHP nommé "map.php" pour obtenir les données de trajectoire de la base de données et les renvoyer au front-end. Ajoutez le code suivant à "map.php" :

<?php
// 连接到数据库
$servername = "localhost";
$username = "root";
$password = "password";
$dbname = "your_database";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
 die("Connection failed: " . $conn->connect_error);
}

// 获取轨迹数据
$carId = $_GET['car_id']; // 从前端获取参数
$sql = "SELECT * FROM tracks WHERE car_id = $carId"; // 假设每辆出租车有一个唯一的ID
$result = $conn->query($sql);
$tracks = [];

if ($result->num_rows > 0) {
 while($row = $result->fetch_assoc()) {
     $tracks[] = $row;
 }
} else {
 echo "No tracks found.";
}

// 返回JSON格式的轨迹数据
header('Content-Type: application/json');
echo json_encode($tracks);
$conn->close();
?>

Copier après la connexion

Créer une page HTML
Créez une page HTML nommée "index.html" pour afficher la carte et les données de trajectoire. Ajoutez le code suivant à "index.html" :

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>出租车轨迹展示</title>
 <style>
     #map {
         width: 100%;
         height: 500px;
     }
 </style>
</head>
<body>
 <div id="map"></div>
 <script src="http://api.map.baidu.com/api?v=2.0&ak=your_api_key"></script>
 <script>
     var map = new BMap.Map("map");
     map.centerAndZoom(new BMap.Point(116.404, 39.915), 14);
     
     // 获取轨迹数据
     var carId = 1; // 假设需要展示的出租车ID为1
     var xhr = new XMLHttpRequest();
     xhr.open("GET", "map.php?car_id=" + carId, true);
     xhr.onreadystatechange = function () {
         if (xhr.readyState === 4 && xhr.status === 200) {
             var tracks = JSON.parse(xhr.responseText);
             // 绘制轨迹
             var path = tracks.map(function (track) {
                 return new BMap.Point(track.lng, track.lat);
             });
             var polyline = new BMap.Polyline(path, {strokeColor: "blue", strokeWeight: 3, strokeOpacity: 0.5});
             map.addOverlay(polyline);
         }
     };
     xhr.send();
 </script>
</body>
</html>

Copier après la connexion

Exécutez l'exemple
Placez les fichiers "map.php" et "index.html" sur votre serveur PHP et accédez à la page "index.html" via votre navigateur Vous peut voir l'effet d'affichage de la trajectoire de taxi.

Résumé :
Ce tutoriel présente comment utiliser PHP et l'API Baidu Map pour implémenter la fonction d'affichage de trajectoire de taxi. En utilisant PHP pour obtenir des données de trajectoire à partir de la base de données et en utilisant l'API JavaScript de Baidu Maps pour dessiner des cartes et des trajectoires, nous sommes en mesure d'afficher dynamiquement la trajectoire de mouvement de chaque taxi. Vous pouvez optimiser et développer davantage en fonction des besoins réels, comme l'ajout de marqueurs de taxi, de mises à jour de trajectoire en temps réel et d'autres fonctions.

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!