没有合适的资源?快使用搜索试试~ 我知道了~
本文实例讲述了php+js实现百度地图多点标注的方法。分享给大家供大家参考,具体如下: 1.php创建json数据 $products = $this->product_db->select($where); $products_json = json_encode($products); 2.js传入json数据 类似于这样的结构 var markerArr = [{ title: "名称:广州火车站", point: "113.264531,23.157003", address: "广东省广州市广州火车站", tel: "12306" }, { title:
资源推荐
资源详情
资源评论
php+js实现百度地图多点标注的方法实现百度地图多点标注的方法
本文实例讲述了php+js实现百度地图多点标注的方法。分享给大家供大家参考,具体如下:
1.php创建json数据
$products = $this->product_db->select($where);
$products_json = json_encode($products);
2.js传入json数据
类似于这样的结构
var markerArr = [{
title: "名称:广州火车站",
point: "113.264531,23.157003",
address: "广东省广州市广州火车站",
tel: "12306"
}, {
title: "名称:广州塔(赤岗塔)",
point: "113.330934,23.113401",
address: "广东省广州市广州塔(赤岗塔) ",
tel: "18500000000"
}, {
title: "名称:广州动物园",
point: "113.312213,23.147267",
address: "广东省广州市广州动物园",
tel: "18500000000"
}, {
title: "名称:天河公园",
point: "113.372867,23.134274",
address: "广东省广州市天河公园",
tel: "18500000000"
}];
js擅长处理json数据
<script>
var products_json = {$products_json};
// 百度地图
var citymap = new citymap(products_json,'宿迁');
</script>
3.处理地图
document.write('<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1We8imivxZnaKMujZIrlDZ0v"></script>');
function citymap(markerArr, cityName){
this.markerArr = markerArr;
this.cityName = cityName;
this.initMap = function() {
this.createMap();//创建地图
this.setMapEvent();//设置地图事件
this.addMapControl();//向地图添加控件
};
this.createMap = function() {
var map = new BMap.Map("dituContent");//在百度地图容器中创建一个地图
map.centerAndZoom(cityName,'13');
window.map = map;//将map变量存储在全局
// 绘制点
for (var i = 0; i < markerArr.length; i++) {
var p0 = markerArr[i].baidu_lng;
var p1 = markerArr[i].baidu_lat;
var maker = this.addMarker(new window.BMap.Point(p0, p1),markerArr[i],i );
this.addInfoWindow(maker, markerArr[i], i);
}
};
this.addMarker = function(point,pro,index) {
var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png",
new BMap.Size(23, 25), {
offset: new BMap.Size(10, 25),
imageOffset: new BMap.Size(0, 0 - index * 25)
});
var marker = new BMap.Marker(point, {
资源评论
weixin_38748263
- 粉丝: 6
- 资源: 894
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功