百度地图API 海量点 自定义添加信息
<!--添加百度地图--> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=密钥"></script> <script src="../../public/js/GetURLParam.js" type="text/javascript"></script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />//html代码<body onload="init()"> <form id="form1" runat="server"> <div style="width:100%" id="container"></div> </div> </form> </body>//关键代码<script> //默认最大 $(document).ready(function(){ var height=GetURLParam("height"); if(height!=null&&height!="undefined"&&height!=""){ $("#container").css("height",height+"px"); } else{ $("#container").css("height",$(document.body).height()); } }); var init = function() { var bumenid =document.getElementById("hiddText").value; //部门id var typeid =document.getElementById("selType").value; //类型id if("<%=scvalue %>"==1){ //首次加载 bumenid=-1; } var map = new BMap.Map("container", {}); // 创建Map实例 map.centerAndZoom(new BMap.Point(113.376170,22.521573), 5); // 初始化地图,设置中心点坐标和地图级别 map.enableScrollWheelZoom(); //启用滚轮放大缩小 if (document.createElement(‘canvas‘).getContext) { // 判断当前浏览器是否支持绘制海量点 $.ajax({ url:‘/CompanyUser/Action.ashx?Action=OA_Map_InfoHaiXiang&ID=‘+bumenid+"&typeid="+typeid,//带参一般处理程序 type:‘POST‘, dataType:‘html‘, contentType:"application/json; charset=utf-8", error:function(XMLHttpRequest, textStatus, errorThrown){parent.error("系统建议管理(提交单)数据加载错误");}, success:function(result){ if(result!=""){ var data=eval("("+result+")"); //result 类似这种 [[经度,维度,1]] 这个1 我始终不明白是什么 var points = []; // 添加海量点数据 for (var i = 0; i < data.length; i++) { points.push(new BMap.Point(data[i][0],data[i][1])); } var options = { size: BMAP_POINT_SIZE_SMALL, shape: BMAP_POINT_SHAPE_STAR, color: ‘#d340c3‘ } var pointCollection = new BMap.PointCollection(points, options); // 初始化PointCollection pointCollection.addEventListener(‘click‘, function (e) { var Name="";//名称 var ads="";//地址 var tel="";//电话 //关于自定义信息 修改json [[经度,维度,1,名称,地址,电话]] //循环查出值 for (var i = 0; i < data.length; i++) { points.push(new BMap.Point(data[i][0],data[i][1])); if(data[i][0]==e.point.lng&&data[i][1]==e.point.lat){//经度==点击的,维度 Name=data[i][3]; ads=data[i][4]; tel=data[i][5]; break; } } var point = new BMap.Point(e.point.lng, e.point.lat); var opts = { width: 250, // 信息窗口宽度 height: 70, // 信息窗口高度 title:"", // 信息窗口标题 enableMessage: false,//设置允许信息窗发送短息 } var infowindow = new BMap.InfoWindow("名称:"+Name+"<br/>地址:"+ads+"<br/>电话:"+tel, opts); map.openInfoWindow(infowindow, point); }); map.addOverlay(pointCollection); // 添加Overlay } } }); } else { alert(‘请在chrome、safari、IE8+以上浏览器查看本示例‘); } } </script>
百度地图API 海量点 自定义添加信息相关推荐
- 项目一、调用百度地图api实现电子围栏和报警信息关联
前段时间香克斯去实习去了,由于一些原因只实习了12天,不过第一次实习,觉得还是有必要记录一下.事先声明,这个博客也是获得同意的,目前这个项目完成度还不是很高,有的地方我的想法不成熟的,希望大家多多提意 ...
- html百度地图标记图标,百度地图api之换自定义标注图标
百度地图API自定义地图 html,body{margin:0;padding:0;} .iw_poi_title {color:#CC5522;font-size:14px;font-weight: ...
- 通过百度地图API获取用户所在地理位置信息
目录 1.密匙申请 2.源代码 3.结果展示 1.密匙申请 使用以下源码前,请先去百度地图开发平台申请密匙,前去申请:立即申请 2.源代码 此次定位代码是通过H5的方式实现的 <html> ...
- 百度地图api之如何自定义标注图标
在百度地图api中,默认的地图图标是一个红色的椭圆形.但是在项目中常常要求我们建立自己的图标,类似于我的这个 操作很简单,分如下几步进行 步骤一:先ps一个图标,大小要合适,如果要背景透明的,记得保存 ...
- 【Python】 调用百度地图API抓取西安市小区信息
前面有同学参加市场调查大赛,需要西安市的小区信息数据,一个小爬虫程序完美解决. 百度地图开放平台 详情访问:百度PlaceAPI 这里用到了矩形区域检索,具体参数说明如下: 调取详情 所需库: imp ...
- 百度地图 Api v3.0 自定义信息窗体样式
一.效果图 二.代码 注意要先引入: <script src="http://api.map.baidu.com/api?v=3.0&ak=IN43cyju8PVLGfSNwl ...
- geolocation/ 百度地图api Geolocation 定位当前城市信息
根据当前所处位置 定位所在城市信息 <html> <head> <meta charset="UTF-8" /> <title>js ...
- 利用百度地图api通过城市地址等信息取经纬度
https://developer.baidu.com/map/place-api.htm 标红的是可以通过经纬度获得当前城市信息(微信定位使用). Geocoding API有哪些功能? Geoco ...
- 百度地图API和高德地图API资料集锦
[高德地图API]从零开始学高德JS API(五)路线规划--驾车|公交|步行 [高德地图API]从零开始学高德JS API(四)搜索服务--POI搜索|自动完成|输入提示|行政区域|交叉路口|自有数 ...
最新文章
- SAP MM 物料库存转固定资产,报错:You cannot post to asset in company code 1900 fiscal year 2021
- 校园网安全问题分析与对策
- 机器学习中的数学(3)-模型组合(Model Combining)之Boosting与Gradient Boosting
- 多线程:线程安全?如何实现?
- html5圆圈图标,html5移动端环形图标菜单代码
- 信息安全工程师考试大纲-科目2:信息安全应用技术
- 前端程序员总结的工作中常用的十大浏览器兼容性问题,初学者瑰宝!
- 转hdmi_即插即用轻松双屏,毕亚兹 VGA转HDMI转换器评测
- PhoneGap插件开发实例
- MYSQL语句:创建、授权、查询、修改、统计分析等 一 用户的创建、权限设置、删除等...
- Vue-购物车简单案例
- 印前软件 数码打样 管理软件
- 用matlab实现sift算法,sift算法的MATLAB程序
- 【操作系统】王道考研 笔记总结目录(完结)
- 学游戏设计有前途吗?
- pes2017服务器维护时间,PES2017授权详情与球场数据包发布时间
- java resources报错解决方案(步骤三亲测)
- php nslookup,nslookup - 运维猫的个人空间 - OSCHINA - 中文开源技术交流社区
- cd linux menu.lst,怎么把cdlinux做成u盘启动?u盘启动cdlinux制作准备工具方法
- 将文件夹下的pdf文件合并
热门文章
- led数字字体_技术丨体育场馆LED显示屏设计与安装要求
- 自动输入命令执行_Ubuntu命令行操作-命令简介
- C语言getchar函数
- armgcc交叉编译的文件无法运行_从0开始搭建基于ARM GCC的软件系统02——使用ARM GCC编译SDK
- 交互式python解释器_从python脚本中调用python交互式解释器
- android返回键返回指定目录,Android 返回键返回到指定的Activity
- gitlab clone需要密码_搭建gitlab服务器最详教程
- 编程语言对比 字面常量
- hdfs java api读写
- opencv ORB角检测