qq.maps.DrivingService 类
驾车路线获取类。用于获取两个或多个位置之间驾车路线的服务。
构造函数
构造函数 |
---|
DrivingService(opts?:DrivingServiceOptions)
|
方法
方法 | 返回值 | 说明 |
---|---|---|
search(start:String | LatLng, end:String | LatLng)
|
none
|
发起驾车路线检索。 - start: 起点,参数可以是关键字、Poi实例,或者LatLng坐标。 - end: 终点,参数可以是关键字、Poi实例,或者LatLng坐标。 |
setPolicy(policy:DrivingPolicy, time:String)
|
none
|
设置本次获取驾车路线的策略。 - time是时间,当且仅当policy为PREDICT_TRAFFIC时生效,格式为“day mm:ss”,例如“0 05:30”代表周日上午5点30分。day为星期,0代表周日,1—6代表周一至周六。mm:ss为24小时制,预测时间以半小时为间隔。 |
setLocation(location:String)
|
none
|
设置本次驾车路线获取的区域范围。例如“北京”。 |
setComplete(callback:Function)
|
none
|
设置检索成功后的回调函数。参数对象:{type:ServiceResultType.DRIVING_INFO,detail:Object.<DrivingInfo>} |
setError(callback:Function)
|
none
|
设置检索失败后的回调函数。 |
clear()
|
none
|
清空当前结果在map和panel中的展现。 |
实例
本示例中,设置驾车方案服务属性
var center = new qq.maps.LatLng(39.916527, 116.397128); var map = new qq.maps.Map(document.getElementById("container"), { center: center }); //设置获取驾车线路方案的服务 var drivingService = new qq.maps.DrivingService({ map: map, //展现结果 panel: document.getElementById('infoDiv') }); //设置回调函数 drivingService.setComplete(function(result) { if (result.type == qq.maps.ServiceResultType.MULTI_DESTINATION) { alert("起终点不唯一"); } }); //设置检索失败回调函数 drivingService.setError(function(data) { alert(data); }); //设置搜索地点信息、驾车方案等属性 function search() { var start = document.getElementById('start').value; var end = document.getElementById('end').value; var policy = document.getElementById("policy").value; //设置驾车方案 drivingService.setPolicy(qq.maps.DrivingPolicy[policy]); //设置驾车的区域范围 drivingService.setLocation("北京"); //设置驾驶路线的起点和终点 drivingService.search(start, end); } window.onload = search;
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>驾车线路搜索</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script> <style type="text/css"> html, body { height: 100%; margin: 0px; padding: 0px } #container { width: 100%; height: 100% } #panel { position: absolute; top: 5px; left: 50%; margin-left: -180px; z-index: 5; background-color: #fff; padding: 5px; border: 1px solid #999; } </style> </head> <body> <div id="panel"> <b>起点: </b> <select id="start" onchange="search();"> <option value="北京南站">北京南站</option> <option value="银科大厦">银科大厦</option> <option value="清华大学">清华大学</option> </select> <b>终点: </b> <select id="end" onchange="search();"> <option value="王府井步行街">王府井步行街</option> <option value="天坛公园">天坛公园</option> <option value="地铁西单站">地铁西单站</option> </select> </select> <b>计算策略:</b> <select id="policy" onchange="search();"> <option value="LEAST_TIME">最少时间</option> <option value="LEAST_DISTANCE">最短距离</option> <option value="AVOID_HIGHWAYS">避开高速</option> <option value="REAL_TRAFFIC">实时路况</option> <option value="PREDICT_TRAFFIC">预测路况</option> </select> </div> <div id="container" style="width:603px;height:300px"></div> <div style='width: 500px; height: 180px' id="infoDiv"></div> </div> <script> var center = new qq.maps.LatLng(39.916527, 116.397128); var map = new qq.maps.Map(document.getElementById("container"), { center: center }); //设置获取驾车线路方案的服务 var drivingService = new qq.maps.DrivingService({ map: map, //展现结果 panel: document.getElementById('infoDiv') }); //设置回调函数 drivingService.setComplete(function(result) { if (result.type == qq.maps.ServiceResultType.MULTI_DESTINATION) { alert("起终点不唯一"); } }); //设置检索失败回调函数 drivingService.setError(function(data) { alert(data); }); //设置搜索地点信息、驾车方案等属性 function search() { var start = document.getElementById('start').value; var end = document.getElementById('end').value; var policy = document.getElementById("policy").value; //设置驾车方案 drivingService.setPolicy(qq.maps.DrivingPolicy[policy]); //设置驾车的区域范围 drivingService.setLocation("北京"); //设置驾驶路线的起点和终点 drivingService.search(start, end); } window.onload = search; </script> </body> </html>