《PHP学习:php+js实现百度地图多点标注的方法》要点:

本文介绍了PHP学习:php+js实现百度地图多点标注的方法,希望对您有用。如果有疑问,可以联系我们。

PHP教程

PHP教程1.php创建json数据

PHP教程

$products = $this->product_db->select($where);

$products_json = json_encode($products);

PHP教程2.js传入json数据

PHP教程类似于这样的结构

PHP教程

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"

}];

PHP教程js擅长处理json数据

PHP教程

var products_json = {$products_json};

// 百度地图

var citymap = new citymap(products_json,'宿迁');

PHP教程3.处理地图

PHP教程

document.write('');

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, {

icon: myIcon

});

map.addOverlay(marker);

var label = new BMap.Label(pro.name,{offset:new BMap.Size(20,-10)});

// 设置label样式

label.setStyle({

color : "#CC3333",

fontSize : "13px",

backgroundColor :"#CCFFFF",

border :"0",

fontWeight :"bold"

});

marker.setLabel(label);

return marker;

};

this.addInfoWindow = function(marker,pro) {

//pop弹窗标题

var title = '

' + pro.name + '

';

//pop弹窗信息

var html = [];

html.push('

html.push('

');

html.push('

地址:');

html.push('

' + pro.address + ' ');

html.push('

');

html.push('

');

var infoWindow = new BMap.InfoWindow(html.join(""), {

title: title,

width: 200

});

var openInfoWinFun = function() {

marker.openInfoWindow(infoWindow);

};

marker.addEventListener("click", openInfoWinFun);

return openInfoWinFun;

}

this.setMapEvent = function() {

map.enableDragging();//启用地图拖拽事件,默认启用(可不写)

// map.enableScrollWheelZoom();//启用地图滚轮放大缩小

map.enableDoubleClickZoom();//启用鼠标双击放大,默认启用(可不写)

map.enableKeyboard();//启用键盘上下左右键移动地图

};

this.addMapControl = function() {

//向地图中添加缩放控件

var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});

map.addControl(ctrl_nav);

//向地图中添加缩略图控件

var ctrl_ove = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:1});

map.addControl(ctrl_ove);

//向地图中添加比例尺控件

var ctrl_sca = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});

map.addControl(ctrl_sca);

};

this.initMap();

}

PHP教程更多关于PHP相关内容感兴趣的读者可查看本站专题:《php curl用法总结》、《PHP数组(Array)操作技巧大全》、《php排序算法总结》、《PHP常用遍历算法与技巧总结》、《PHP数据结构与算法教程》、《php程序设计算法总结》、《PHP数学运算技巧总结》、《php正则表达式用法总结》、《PHP运算与运算符用法总结》、《php字符串(string)用法总结》及《php常见数据库操作技巧汇总》

PHP教程希望本文所述对大家PHP程序设计有所帮助.

移动端百度地图多点标注php,PHP学习:php+js实现百度地图多点标注的方法相关推荐

  1. 百度地图 php,php+js实现百度地图多点标注的方法

    本文实例讲述了php+js实现百度地图多点标注的方法.分享给大家供大家参考,具体如下: 1.php创建json数据 $products = $this->product_db->selec ...

  2. 【百度地图API】如何利用自己的数据制作社交地图?只显示可视区域内的标注...

    原文:[百度地图API]如何利用自己的数据制作社交地图?只显示可视区域内的标注 摘要:如果你自己的数据已经超过1万个,如何进行合理的显示?除了聚合marker外,还有一个办法.那就是,只显示可视区域内 ...

  3. 【百度地图API】如何利用自己的数据制作社交地图?只显示可视区域内的标注

    [百度地图API]如何利用自己的数据制作社交地图?只显示可视区域内的标注 摘要:如果你自己的数据已经超过1万个,如何进行合理的显示?除了聚合marker外,还有一个办法.那就是,只显示可视区域内的标注 ...

  4. js调用百度地图API,实现地图标注位置

    直接调用js就可以,通过设置中心位置来实现显示的中心确定,入图中的小括号:通过标注坐标来在地图中显示你自己的位置,如图"青岛农业大学"标注: 效果图如下: 代码如下: <di ...

  5. 移动端调用电话、短信、唤起QQ和使用百度地图

    H5能很方便地实现这些功能,都是一句代码搞定 调用电话 <a href="tel:12345678"> 短信 <a href='sms:12345678'> ...

  6. 【安卓学习之常见问题】百度地图卫星地图精度不够

    █ [安卓学习之常见问题]百度地图卫星地图精度不够 █ 系列文章目录 提示:这里是收集了和文件分享有关的文章 [安卓学习之常见问题]android路径及文件问题 [安卓学习之常见问题]文件分享–文件不 ...

  7. H5使用百度地图SDK获取用户当前位置并且标记显示在地图

    代码实现功能: H5使用百度地图SDK获取用户当前位置并且标记显示在地图,点击该标记弹出一层自定义的HTML. 效果图: 代码: <!DOCTYPE html> <html>& ...

  8. baidumaptrace.php,GitHub - SignalLine/BaiduMapTrace: 百度地图运动轨迹纠偏、去噪、绑路之百度鹰眼sdk服务...

    BaiduMapTrace 百度地图运动轨迹纠偏.去噪.绑路之百度鹰眼sdk服务 轨迹大致能反应用户所经过的路劲,效果还是不错的,说明gps信号较好,精度较高. 但是除了西边的轨迹较为平滑之外,其他方 ...

  9. 前端(1)js:百度地图api使用

    (1)百度地图API链接 1)获取key http://lbsyun.baidu.com/apiconsole/key 2)查看相关API文档 http://lbsyun.baidu.com/inde ...

最新文章

  1. 用XML反序列化快速完成ASP.NET配置文件
  2. pythreejs is needed for plotting with pythreejs backend
  3. Web开发-Django初识及实战
  4. javafx 遮罩_JavaFX技巧31:遮罩/剪切/ Alpha通道
  5. 卷积神经网络-目标探测
  6. Pandas DataFrame 取消科学计数法打印
  7. 使用Hash函数和MAC产生伪随机数
  8. CFA在线计算机,注意!CFA考场上只能携带这种计算机!
  9. 双向lstm-crf源码的问题和细微修改
  10. C语言向文件写入学生信息并读取显示出来
  11. 利用InVEST模型的生境质量模块计算生境质量
  12. 提高 Mac OS X 速度的 52 个方法
  13. win7下ACE+TAO环境搭建
  14. php 属猪,属猪人的流年运程
  15. 徐荣谦《养好脾和肺 宝宝不积食不咳嗽长大个》【01】小儿常见病
  16. 深入理解Java虚拟机——运行时栈帧结构(局部变量表)
  17. 网桥是怎么分类的?具体有哪些分类?
  18. 文章翻译:Recommending items to more than a billion people(面向十亿级用户的推荐系统)...
  19. 开发通用资料——英文缩写
  20. Orin 调试GMSL camera遇到问题之MIPI CSI2 报文解析

热门文章

  1. html信息代码是什么意思,这句html代码是什么意思?
  2. SD卡烧录镜像后插电脑不显示问题
  3. js效果需要刷新页面才生效
  4. 技能学习:学习使用php(tp6框架) + vue.js,开发前端全栈网站-4.跨域且传输数据,并优化后端接口
  5. “强迫症头像”蹿红,还需谨防病毒入侵
  6. 孔 孟 颜 曾四姓通天谱(孔、孟、颜、曾、卜、闵、冉)
  7. 如何给X86的安卓机刷机(联想乐檬K80M)(线刷)
  8. pymysql的列名传参
  9. Smobiler 仿美柚APP个人主页
  10. killall 命令终止进程用法