百度api获得昆明的经纬度和62路公交线路查询

 

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>行政区域工具</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
</head>
<body>
<div style="width:520px;height:340px;border:1px solid gray" id="container"></div>
<p><input id="startBtn" type="button" onclick="startTool();" value="开启取点工具" /><input type="button" onclick="map.clearOverlays();document.getElementById('info').innerHTML = '';points=[];" value="清除" /></p>
<div id="info"></div>
</body>
</html>
<script type="text/javascript">
var map =  new BMap.Map("container");                         //  创建Map实例
map.centerAndZoom("昆明", 12);      //  初始化地图,设置中心点坐标和地图级别

var key = 1;     // 开关
var newpoint;    // 一个经纬度
var points = [];     // 数组,放经纬度信息
var polyline =  new BMap.Polyline();  // 折线覆盖物

function startTool(){    // 开关函数
if(key==1){
        document.getElementById("startBtn").style.background = "green";
        document.getElementById("startBtn").style.color = "white";
        document.getElementById("startBtn").value = "开启状态";
        key=0;
    }
     else{
        document.getElementById("startBtn").style.background = "red";
        document.getElementById("startBtn").value = "关闭状态";
        key=1;
    }
}
map.addEventListener("click", function(e){    // 单击地图,形成折线覆盖物
    newpoint =  new BMap.Point(e.point.lng,e.point.lat);
     if(key==0){
     //     if(points[points.length].lng==points[points.length-1].lng){alert(111);}
        points.push(newpoint);   // 将新增的点放到数组中
        polyline.setPath(points);    // 设置折线的点数组
        map.addOverlay(polyline);    // 将折线添加到地图上
        document.getElementById("info").innerHTML += "new BMap.Point(" + e.point.lng + "," + e.point.lat + "),</br>";     // 输出数组里的经纬度
    }
});
map.addEventListener("dblclick", function(e){    // 双击地图,形成多边形覆盖物
if(key==0){
        map.disableDoubleClickZoom();    // 关闭双击放大
var polygon =  new BMap.Polygon(points);
        map.addOverlay(polygon);    // 将折线添加到地图上
    }
});
</script>

 

 

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>搜索62路公交</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
</head>
<body>
<p><img src="http://map.baidu.com/img/logo-map.gif" /><span style="display:inline-block;width:200px;">&nbsp;</span><input type="text" value="62" id="busId" />路公交&nbsp;<input type="button" value="查询" onclick="busSearch();" /></p>
<div style="clear:both">&nbsp;</div>
<div style="float:left;width:600px;height:500px;border:1px solid gray" id="container"></div>
<div id="results" style="float:left;width:300px;height:500px;font-size:13px;"></div>
</body>
</html>
<script type="text/javascript">
var map =  new BMap.Map("container");
map.centerAndZoom( new BMap.Point(102.731417,25.063555), 12);

var busline =  new BMap.BusLineSearch(map,{
    renderOptions:{map:map,panel:"results"},
        onGetBusListComplete:  function(result){
            if(result) {
              var fstLine = result.getBusListItem(0); // 获取第一个公交列表显示到map上
             busline.getBusLine(fstLine);
           }
        }
});
function busSearch(){
     var busName = document.getElementById("busId").value;
    busline.getBusList(busName);
}
</script>

 

你可能感兴趣的:(api)