第一步：在百度申请账号建立应用，获取ak值。
第二步: 写html页面 ，代码如下
<?php
// 页面刷新秒数
$t = $_GET['t'];
$time = empty($t) ? '5000' : $t.'000';
// 数据刷新秒数
$h = $_GET['h'];
// 输入地址名转换ID
$k = $_GET['k'];
$cityName = empty($k) ? '北京市' : $k;
?>
<!DOCTYPE html>
<html>
<head>
<me
<me
<!-- <me
<ti
<st
body, html, #allmap {
width: 100%;
height: 100%;
overflow: hidden;
margin: 0;
font-family: "微软雅黑";
}
</st
<!-- 百度地图 -->
<sc
src="http://api.map.baidu.com/api?v=2.0&ak=申请获得ak值"></sc
<sc
<sc
// 定义存坐标点数组
var markers = new Array();
$(document).ready(function() {
getdata();
setInterval("frash()",<?php echo $time?>); // 间隔秒数 刷新
});
// 刷新页面
function frash(){
getdata();
markers.splice(0,markers.length);//清空数组
}
// 获取数据
function getdata(){
var cityName = document.getElementById("cityName").value;
var seconds = document.getElementById("seconds").value;
//alert(cityName);alert(seconds);
$.ajax({
url : '{:U("Home/Map/lists")}',
type: 'get',
async: true, //异步请求
data: {k: cityName,h: seconds},
success:function(data){
var json = eval(data);
for(var i=0; i<json.length; i++)
{
markers[i] = {position:{lng:json[i].jingdu,lat:json[i].weidu,info:json[i].vehicleno}};
}
map.clearOverlays(); // 清空地图上标注点
addMapOverlay(); // 设置坐标点
}
});
}
</sc
</head>
<body>
<from name="myfrom">
<input type="hidden" id="cityName" value="{$cityName}">
<input type="hidden" id="seconds" value="{$h}">
<div id="allmap"></div>
</from>
</body>
</html>
<sc
// 百度地图API功能
var marker;
var zoomSize = 17;
var map = new BMap.Map("allmap");
// 用城市名设置地图中心点
var cityName = document.getElementById("cityName").value;
//alert(cityName);
map.centerAndZoom(cityName, zoomSize);
map.setDefaultCursor("crosshair"); // 设置地图默认的鼠标指针样式
map.enableScrollWheelZoom(); // 启用滚轮放大缩小，默认禁用。
map.enableContinuousZoom(); // 启用地图惯性拖拽，默认禁用
// 添加带有定位的导航控件
var navigationControl = new BMap.NavigationControl({
// 靠左上角位置
anchor : BMAP_ANCHOR_TOP_LEFT,
// LARGE类型
type : BMAP_NAVIGATION_CONTROL_LARGE,
// 启用显示定位
enableGeolocation : true
});
map.addControl(navigationControl);
// 编写自定义函数,创建标注
function addMarker(point, ti
// 是引用图标的名字以及大小，注意大小要一样
var myIcon = new BMap.Icon(
"/Public/uploads/51-20.png",
new BMap.Size(100, 2*100)); // 指定定位位置
// 创建标注对象并添加到地图
var marker = new BMap.Marker(point, {
icon : myIcon
});
// 创建信息窗口对象
var infoWindow = new BMap.InfoWindow(ti
maxwidth : 20, // 信息窗口宽度
height : 5, // 信息窗口高度
});
map.addOverlay(marker);
marker.addEventListener("click", function() {
this.openInfoWindow(infoWindow);
map.zoomIn();
});
marker.setLabel(new BMap.Label(ti
offset : new BMap.Size(6, 4)
}));
}
// 设置坐标点
function addMapOverlay(){
// alert(markers.length+"---2");
// alert(markers[0].position.lng+"----3");
// alert(markers[0].position.lat+"----4");
for(var i = 0; i < markers.length; i++ ){
var point = new BMap.Point(markers[i].position.lng, markers[i].position.lat);
addMarker(point, markers[i].position.info);
}
}
</sc
第三步：写对应的控制器；
<?php
namespace Home\Controller;
use Think\Controller;
class MapController extends Controller {
public function index(){
$this->display();
}
public function lists(){
$time = time(); // 当前时间戳
$h = I('h'); // 数据刷新秒数
$h = empty($h) ? '30' : $h;
$k = I('k'); // 输入地址名转换ID
$cityName = empty($k) ? '北京市' : $k;
$areaid = M('area')->where("name like '%$cityName%'")->getField('id');
$where['areaid'] = $areaid;
$list = M('driver')
->where($where)
->where(" $time - online < $h ")
->field('jingdu,weidu,vehicleno')
->select();
echo json_encode($list);
}
}
