所有文章 > API开发 > PHP+Mysql实现百度地图API打点标记

PHP+Mysql实现百度地图API打点标记

需求:从本地数据库读取经纬度,通过百度API在地图上打点显示(最简示例)

开发环境:PHP+Mysql 

源码:

1. bm.html 代码:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
#l-map{height:100%;width:78%;float:left;border-right:2px solid #bcbcbc;}
#r-result{height:100%;width:20%;float:left;}
</style>
<script type="text/javascript" src="js/jquery-1.6.2.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你申请的百度地图密钥"></script

<title>添加多个标注点</title>
</head>
<body>
<div id="allmap"></div>
</body>
<script type="text/javascript">
//将字符串转为JSon
function str2JSON(str) {
str=$.trim(str);
if(str!=""){
return eval('(' + str + ')');
}else{
return Object();
}
}

//通过jquery的Ajax获取Mysql中的经纬度
function get_trj(fn){
var url="setPoint.php"
$.get(url,{
method:'get_trj'
},function(result){//result为php返回的JSON字符串
result=str2JSON(result);
// alert(result);
fn(result); //这是回调函数,调用下面的 trj_callback 变量中方法,不懂得话,百度JQuery Ajax
});
}
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.404, 39.915);//坐标中心是天安门
map.centerAndZoom(point, 15);

// 编写自定义函数,创建标注
function addMarker(point){
var marker = new BMap.Marker(point);
map.addOverlay(marker);
}

var trj_callback=function(pts_array){
//将获取的array转换为BMap.Point

var sContentArray=Array();
var infoWindowArray=Array();

for(var i=0;i<pts_array.length;i++){
//这是在地图上打点,往里面传个经纬度即可,自己完善下循环就可以了
addMarker(new BMap.Point(pts_array[i][0],pts_array[i][1]));
}
}

//这是程序的入口,调用,
get_trj(trj_callback);



</script>

</html>

2.  setPoint.php 代码:

<?php

/**
* 数据库配置信息
*/
$db_config = array(
'host' => "localhost",
'user' => "root",
//'password' => "password",
'password' => "root",
//'database' => "gis"
'database' => "map"
);
/**
* flush outputbuffer并将其输出到客户端,可实现即时输出
* @param unknown_type $str
*/
function qk_echo($str) {
echo $str;
ob_flush();//刷新缓存
flush();
}

/**
* Helper 类,用于接收http请求并对外提供服务
*/
class Helper{
private $db_config;
public function __construct($db_config){
$this->db_config=$db_config;
}
/**
* 对外提供api接口
* @param method api名称
*/
public function do_api(){
$method=$_GET['method'];
$result="";
switch ($method) {
case 'get_trj':
# code...
$result=$this->get_trj();
break;

default:
# code...
break;
}
qk_echo($result); //Response
}

/**
* 获取轨迹信息,以字符串的形式返回
*/
public function get_trj(){
//初始化数据库连接
$conn=mysql_connect($this->db_config['host'], $this->db_config['user'],$this->db_config['password']);
//选择数据库
@mysql_select_db($this->db_config['database'],$conn);

//$table_name="trajectory";
//$table_name="ap_max";
$table_name="wifi_state";
//$sql="select id,lng,lat,ssid,rssiMax,rssiMin,wifi_mac,testPointNum,wifi_mac_used from ".$table_name;
//$sql="select id,lon,lat,time,encyptiontype,rssi,name from ".$table_name;
$sql="select id,lon,lat,time,encyptiontype,rssi,name from wifi_state";


// 执行sql查询
$rs=mysql_query($sql,$conn);
$result=array();
while($row=mysql_fetch_row($rs)){
//加入经纬度信息
//echo $row[1];
$result[]=array($row[1],$row[2],$row[3],$row[4],$row[5],$row[6]);
//$result[]=array($row[1],$row[2],$row[3],$row[4]);
}
//关闭数据集
@mysql_close($rs);

//返回结果
return json_encode($result);
}
}

/*$link=mysql_connect("localhost","root","root");
if(!$link) echo "FAILD!连接错误,用户名密码不对";
else echo "OK!可以连接"; */


$helper=new Helper($db_config);
$helper->do_api();
$helper->get_trj();

3.  MySQL数据库:

数据库名:map

表名:wifi_state

导出文件(可直接导入Mysql):

-- phpMyAdmin SQL Dump
-- version phpStudy 2014
-- http://www.phpmyadmin.net
--
-- 主机: localhost
-- 生成日期: 2017 年 03 月 15 日 08:37
-- 服务器版本: 5.5.53
-- PHP 版本: 5.4.45

SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";


/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;

--
-- 数据库: `map`
--
CREATE DATABASE `map` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci;
USE `map`;

-- --------------------------------------------------------

--
-- 表的结构 `wifi_state`
--

CREATE TABLE IF NOT EXISTS `wifi_state` (
`id` int(10) NOT NULL,
`time` date NOT NULL,
`lat` varchar(123) NOT NULL,
`lon` varchar(123) NOT NULL,
`name` varchar(123) NOT NULL,
`encyptiontype` varchar(123) NOT NULL,
`rssi` varchar(123) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

--
-- 转存表中的数据 `wifi_state`
--

INSERT INTO `wifi_state` (`id`, `time`, `lat`, `lon`, `name`, `encyptiontype`, `rssi`) VALUES
(1, '2017-03-08', '39.915', '116.408', 'netgear41', 'unlocked', '0'),
(1, '2017-03-08', '39.910', '116.401', 'netgear41', 'unlocked', '0'),
(1, '2017-03-08', '39.917', '116.406', 'netgear41', 'unlocked', '0'),
(1, '2017-03-08', '39.912', '116.408', 'netgear41', 'unlocked', '0'),
(1, '2017-03-08', '39.910', '116.407', 'netgear41', 'unlocked', '0');

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

4.完成效果示例:

5. 完整项目源码下载地址

百度地图取Mysql数据打点
链接: https://pan.baidu.com/s/1qSnSOtudYanU5Oi_cl28gA
提取码: fn9s

文章转自微信公众号@PHP自学中心

#你可能也喜欢这些API文章!