指定起终点公交搜索

此示例是一个简单的公交搜索。搜索从西单到搜狐网络大厦,的乘车路线。并显示在地图上。

关键代码

var bRender=new sogou.maps.BusRenderer();
var request={
 'map':map,        //Map
 'destination':'搜狐网络大厦',//new Point(12949535.945308747,4836604.4296875),   //目标位置。可将此项指定为要进行地址解析的字符串或 LatLng或者为搜狗地图坐标。必填。
 'origin':'西单'        //原点的位置。可将此项指定为要进行地址解析的字符串或 LatLng或者为搜狗地图坐标。必填。
}
var bus=new sogou.maps.Bus();
bus.route(request);
bus.setRenderer(bRender);
			

代码解析

首先要先初始化一个公交实例,设置请求参数。调用route方法。

var bus=new sogou.maps.Bus();
var request={
 'map':map,        //Map
 'destination':'搜狐网络大厦',//目标位置。可将此项指定为要进行地址解析的字符串或 LatLng或者为搜狗地图坐标。必填。
 'origin':'西单'        //原点的位置。可将此项指定为要进行地址解析的字符串或 LatLng或者为搜狗地图坐标。必填。
}
bus.route(request);
			

接下来将查询结果显示到地图上,需要先初始化搜索渲染类。再调用公交的setRenderer方法,进行结果渲染。

			var bRender=new sogou.maps.BusRenderer();
			bus.setRenderer(bRender);
			

完整代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>指定起终点公交搜索</title>
<style type="text/css">
#map{position:absolute;width:600px; height:600px;}
</style>
<script type="text/javascript" src="http://api.go2map.com/maps/js/api_v2.0.js"></script>
</head>

<body>
    <div id="map" ></div>
</body>
<script>
var myLatLng = new sogou.maps.Point(12957062,4827187);
var myOptions = {
  zoom: 10,
  center: myLatLng
};
var map = new sogou.maps.Map(document.getElementById("map"), myOptions);

var bRender=new sogou.maps.BusRenderer();
var request={
 'map':map,        //Map
 'destination':'搜狐网络大厦', //目标位置。可将此项指定为要进行地址解析的字符串或 LatLng或者为搜狗地图坐标。必填。
 'origin':'西单'        //原点的位置。可将此项指定为要进行地址解析的字符串或 LatLng或者为搜狗地图坐标。必填。
}
var bus=new sogou.maps.Bus();
bus.route(request);
bus.setRenderer(bRender);
</script>
</html>
			

运行代码