百度地图,mark点,获取mark的id label等

设计要求: 1,打开地图页面, 从自己的MYSQL数据库读取数据, 渲染到地图上(多个点)2,点击其中一个点,生成一个自己定义的DIV(里面元素自己定义,这里不是用的label)3,DIV里有该点 在数据库的所有数据(能获得推送实时数据)
initMap:function(){  var me=this;//定义全局对象   me.map = new BMap.Map("allmap", {enableMapClick:false}); //创建地图   var point = new BMap.Point(120.61990712,31.31798737);  // 创建点坐标(默认) 这里是苏州   me.map.centerAndZoom(point, 12);                  //默认缩放比例  其实打开地图的默认等级   me.map.enableScrollWheelZoom();                 //启用滚轮放大缩小  //添加控件   var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});// 左上角,添加比例尺    var top_left_navigation = new BMap.NavigationControl();  //左上角,添加默认缩放平移控件   me.map.addControl(top_left_control);    me.map.addControl(top_left_navigation);
  me.map.enableScrollWheelZoom();//获取缩放等级,这里没什么用写着玩的;

  //获取数据data  这里从自己数据库获取数据 我就省略了. 编辑大概样式()   me["data"]={   001:{name:苏州市工业园区,id:215006,lat: 31.31529999,lon:120.78209686,point:{[id_:001001,name_:测试点1]}},   002:{name:苏州市新区,id:215003,lat: 33.31529999,lon:120.78209686,point:{[id_:002001,name_:测试点2]}}   }}
//大量添加markers addMarks: function (data) {             var me=this;             for(var m in data){                 me.addMark(data[m]) } },//单个添加marker点(包括单击事件,DIV展开,数据渲染,marker的ID位置放置,与获取)
addMark:function(data){             var me=this;             var label;             var point = new BMap.Point(data.lon,data.lat);    //建立测试point点        var marker=new BMap.Marker(point,{icon:new BMap.Icon("../../images/dc_chg_run_24.png", new BMap.Size(24, 24))});  //在地图上建立marker点  ,自定义图片,托片大小                  label = new BMap.Label(data.id, {    offset: new BMap.Size(20, 0) }); //创建marker点的标记,这里注意下,因为百度地图可以对label样式做编辑,所以我这里吧重要的id放在了label(然后再隐藏)              label.setStyle(  {   display:"none"         });//对label 样式隐藏               marker.setLabel(label);  //把label设置到maker上             marker.setTitle(data.name); //这里设置maker的title (鼠标放到marker点上,会出现它的title,所以我这里把name,放到title里)              me.map.addOverlay(marker);  //把maker点添加到 地图上             data["chargerMarker"]=marker;   //这里很重要, 把maker对象放到缓存的data 里面            marker.addEventListener("click", function (e) {      //这里添加maker的监听点击事件,触发自定义div("#info-panel)的展示                                                         $("#info-panel").toggle(300);//div展开,关闭                                 me.tag=e.target.getLabel().content; //点击maker点后  获取label里面的内容                                $("#id").html(e.target.getLabel().content); //这里就可以获取到marker的id                                //根据me.tag 作为data的key  就能获取缓存data对应数据,就可以渲染到 自定义div里

  }},//图标跟换,根据数据要求,对该marker图标切换,闪烁假设 id="001";当然 数据推送的时候这个ID 实时变化的
changeIcon: function (id) {             var me=this;             var myIcon;              var state=parseInt(ms.state);               switch(state){                 case 0 : myIcon =new BMap.Icon("../../images/stop.png", new BMap.Size(24, 24)); break;                 case 1: myIcon =new BMap.Icon("../../images/run.png", new BMap.Size(24, 24));   break;                 case 2 : myIcon =new BMap.Icon("../../images/broken.png", new BMap.Size(24, 24));    break;                 default :;     }           me.data[id].chargerMarker.setIcon(myIcon);//改变图标        },

PS:随便瞎写写的~写的不好,多多见谅~


 
				
时间: 2024-08-06 19:45:37

百度地图,mark点,获取mark的id label等的相关文章

简单的百度地图点击获取当前地理坐标

在很多的时候我们需要在地图上点击一个地方,然后获取当前地点的经度和纬度值,代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>百度地图API地点搜索-获取经纬度DEMO</title> <meta name="

利用百度地图API,获取经纬度坐标

利用百度地图API,获取经纬度坐标 代码很简单,但在网上没找到现成的获取地图经纬度的页面. 就是想,给当前页面传递一个经纬度,自动定位到此经纬度.然后可以重新选择,选择完返回经纬度. 效果如下: 源代码下载:http://files.cnblogs.com/zjfree/select_map.rar 利用百度地图API,获取经纬度坐标,布布扣,bubuko.com

IOS中使用百度地图定位后获取城市坐标,城市名称,城市编号信息

IOS中使用百度地图定位后获取城市坐标,城市名称,城市编号信息 /**当获取到定位的坐标后,回调函数*/ - (void)didUpdateBMKUserLocation:(BMKUserLocation *)userLocation{ BMKCoordinateRegion region; region.center.latitude  = userLocation.location.coordinate.latitude; region.center.longitude = userLoca

百度地图之事件处理——获取所在的经纬度(百度地图简单使用)

地图事件概述 浏览器中的JavaScript是“事件驱动的”,这表示JavaScript通过生成事件来响应交互,并期望程序能够“监听”感兴趣的活动.例 如,在浏览器中,用户的鼠标和键盘交互可以创建在DOM内传播的事件.对某些事件感兴趣的程序会为这些事件注册JavaScript事件监听器,并在接收 这些事件时执行代码. 百度地图API拥有一个自己的事件模型,程序员可监听地图API对象的自定义事件,使用方法和DOM事件类似.但请注意,地图API事件是独立的,与标准DOM事件不同. 事件监听 百度地图

android菜鸟学习笔记31----Android使用百度地图API(二)获取地理位置及地图控制器的简单使用

1.获取当前地理位置: Android中提供了一个LocationManager的类,用于管理地理位置.不能通过构造函数获取该类的实例,而是通过Context的getSystemService(): LocationManager lm = (LocationManager) getSystemService(Context.LOCATION_SERVICE); 该类中有几个比较常用的方法: getLastKnownLocation(String provider)用于根据传入的provider

百度地图,自动获取定位,拖拽获取地点,模糊查询获取当前位置

先看下效果图,因为没有美化,只是做一下功能. 完整代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> <script src="../.

百度地图定位 : 获取当前位置的经纬度

说明: 1.初始化 BaiduMap SDK要在显示界面之前,即: SDKInitializer.initialize(Context); setContentView(R.layout.main); 2. 设置定位的模式是 LocationMode.Hight_Accuracy 时,在室内可能无法获取到准确的经纬度,会得到默认的值是4.9E-324 处理办法是将模式改为Battery_Saving,或到室外 3.可以根据当前设备网络连接情况和GPS是否开启来设定定位模式 //获得网络连接情况

百度地图用ip获取当前位置的经纬度(高精度)

步骤比较简单先上百度地图API官网,申请一个应用AK(访问凭据):查看一下高进度定位的API,看看是否都符合要求下面直接上代码 /** * 根据ip获取地理坐标 * @param ip * @return */ public JSONObject getCoorsByIp(String ip){ if (null == ip) { ip = ""; } try { URL url = new URL("http://api.map.baidu.com/highacciploc

用户Ip地址和百度地图api接口获取用户地理位置(经纬度坐标,城市)

<?php //获取用户ip(外网ip 服务器上可以获取用户外网Ip 本机ip地址只能获取127.0.0.1) function getip(){ if(!empty($_SERVER["HTTP_CLIENT_IP"])){ $cip = $_SERVER["HTTP_CLIENT_IP"]; } else if(!empty($_SERVER["HTTP_X_FORWARDED_FOR"])){ $cip = $_SERVER[&quo