使用代码分析神器logger2js,搞定一切难题[百度地图api示例]

jzshmyt 2014-03-12 11:47:08

需求说明：
百度map api并未公开获取站点坐标经纬度的api接口，通过logger2js分析百度地图api源码，找出获取某条公交线各个站点经纬度的未公开方法。

被分析页面全部代码：



<html> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 

<style type="text/css"> 

body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;} 

#l-map{height:100%;width:78%;float:left;border-right:2px solid #bcbcbc;} 

#r-result{height:100%;width:20%;float:left;} 

</style> 

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=FEWAdks14E8Kul8QtRUO01p1"></script> 

<title>公交/地铁线路查询</title> 

</head> 

<body> 

<div id="l-map"></div> 

<div id="r-result"></div> 

</body> 

</html> 

<script type="text/javascript"> 

var tempVar; 

var map = new BMap.Map("l-map");            // 创建Map实例 

map.centerAndZoom(new BMap.Point(116.404, 39.915), 12); 

var busline = new BMap.BusLineSearch(map,{ 

    renderOptions:{map:map,panel:"r-result"}, 

        onGetBusListComplete: function(result){ 

           if(result) { 

              tempVar = result; 

              var fstLine = result.getBusListItem(0);//获取第一个公交列表显示到map上 

              busline.getBusLine(fstLine); 

           } 

        } 

}); 



function busSearch(){ 

    var busName = 331; 

    busline.getBusList(busName); 

} 



setTimeout(function(){ 

    busSearch(); 

},1500);

</script>

开工，步骤如下：
1、在页面head部分，增加在线调试工具script地址如下

<script type="text/javascript" src="http://logger2js.googlecode.com/svn/trunk/logger2js/logger.js" debug=true beautify=true skinid=0></script>

2、分析页面逻辑，使用ie开发人员工具或者findbug查看页面运行时html源代码，找出绘制站点的触发事件名称为Instance(‘TANGRAM__i’)._selectBusListItem，如下图

3、在logger2js工具窗口的执行入库框中输入Instance(‘TANGRAM__i’)._selectBusListItem，分析输出到控制台的代码逻辑如下：

4、拷贝出找到的代码块，对环境变量进行等价的赋值如下



var bl = Instance('TANGRAM__i');

for (var c = 0, d = bl.Fb.mk(); c < d; c++) {

　　var e = bl.Fb.wp(c).position;

　　var f = bl.Fb.wp(c).name;

        $alert(f+":"+e.lat+","+e.lng);

}

5、在执行窗口输入：Instance('TANGRAM__i')，进行执行，找到回调方法名字

6、注册回调方法，并在方法中执行4步中找出的代码块，如下



//打印出站点坐标点 

busline.setBusLineHtmlSetCallback(function(){ 

    var bl = Instance('TANGRAM__i'); 

    for (var c = 0, d = bl.Fb.mk(); c < d; c++) { 

　　　　var e = bl.Fb.wp(c).position; 

　　　　var f = bl.Fb.wp(c).name; 

        $alert(f+":"+e.lat+","+e.lng); 

    } 

});