Home Backend Development PHP Tutorial Application examples and tutorials of Baidu Map API in PHP

Application examples and tutorials of Baidu Map API in PHP

Aug 01, 2023 am 10:45 AM
php Baidu map api Applications.

Application examples and tutorials of Baidu Map API in PHP

Baidu Map API is a free map development interface launched by Baidu, which can easily display and display maps on your own website or application. Search, navigation and other functions. This article will introduce how to use Baidu Map API in PHP and provide some practical application examples.

1. Basic use of Baidu Map API

  1. Register Baidu Map developer account and create applications

First, we need to open the Baidu Map platform Register a developer account on the website and create an application. When creating an application, you will get an API key (ak), which will be used in the subsequent code.

  1. Introducing the JavaScript library of Baidu Map API

In the php file, we need to introduce the JavaScript library of Baidu Map API, you can use the following code:

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

Among them, the API key needs to be replaced with your own key.

  1. Create a map container

Use the following code to create a map container in a web page:

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

Among them, the div element with the id "map" Used to place maps.

  1. Initialize the map and set the center point

In the JavaScript code, we need to initialize the map and set the center point of the map, using the following code:

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

Among them, 116.404 indicates longitude, 39.915 indicates latitude, and a map level of 15 indicates that the display level is street level.

  1. Add a label

You can use the following code to add a label on the map:

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

After running the above code, you can see it on the map to a marked point.

2. Application Example of Baidu Map API in PHP

The following is a simple example to illustrate how to use Baidu Map API in PHP.

Suppose we have a requirement: display the location of the store on a web page and mark it on the map.

Here are the following simple steps for reference:

  1. Create a database table

First, we need to create a database table for Stores store location information. The table structure can refer to the following code:

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;
Copy after login
  1. Add store information to the database

To add some store location information in the database, you can use the following code:

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);
Copy after login
  1. PHP code example

Write PHP code to read store information from the database and mark it on the map, use the following code:

<?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>
Copy after login

Replace the above The code is saved as a php file. Run the file and you can see the map on the web page and display the location of the store.

Through the above examples, we can see how to use Baidu Map API in PHP and implement some simple functions. You can further learn and explore other functions of Baidu Map API as needed, and apply them in your own projects. Hope this article can be helpful to you.

The above is the detailed content of Application examples and tutorials of Baidu Map API in PHP. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

CakePHP Project Configuration CakePHP Project Configuration Sep 10, 2024 pm 05:25 PM

In this chapter, we will understand the Environment Variables, General Configuration, Database Configuration and Email Configuration in CakePHP.

PHP 8.4 Installation and Upgrade guide for Ubuntu and Debian PHP 8.4 Installation and Upgrade guide for Ubuntu and Debian Dec 24, 2024 pm 04:42 PM

PHP 8.4 brings several new features, security improvements, and performance improvements with healthy amounts of feature deprecations and removals. This guide explains how to install PHP 8.4 or upgrade to PHP 8.4 on Ubuntu, Debian, or their derivati

CakePHP Date and Time CakePHP Date and Time Sep 10, 2024 pm 05:27 PM

To work with date and time in cakephp4, we are going to make use of the available FrozenTime class.

CakePHP Working with Database CakePHP Working with Database Sep 10, 2024 pm 05:25 PM

Working with database in CakePHP is very easy. We will understand the CRUD (Create, Read, Update, Delete) operations in this chapter.

CakePHP File upload CakePHP File upload Sep 10, 2024 pm 05:27 PM

To work on file upload we are going to use the form helper. Here, is an example for file upload.

CakePHP Routing CakePHP Routing Sep 10, 2024 pm 05:25 PM

In this chapter, we are going to learn the following topics related to routing ?

Discuss CakePHP Discuss CakePHP Sep 10, 2024 pm 05:28 PM

CakePHP is an open-source framework for PHP. It is intended to make developing, deploying and maintaining applications much easier. CakePHP is based on a MVC-like architecture that is both powerful and easy to grasp. Models, Views, and Controllers gu

CakePHP Creating Validators CakePHP Creating Validators Sep 10, 2024 pm 05:26 PM

Validator can be created by adding the following two lines in the controller.

See all articles