极客观点
项目管理
HarmonyOS
我要做什么：现有55个地点坐标，希望获取它们两两之间的行车路程。
我做了什么：我试图通过循环来调用高德API，依次输出结果。（为了防止循环过快，使用了setTimeout来暂停。）
有什么问题：1、每一次运行得到的结果都有一部分不一样。2、输出的数据也不是按照循环顺序排列的。（用两个for循环嵌套结果也是如此。）
这两点让我很疑惑，不知我代码有问题，还是和高德API本身有关，该如何解决呢？
下面是部分代码：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>地图路线规划服务</title>
<script language="javascript" src="http://webapi.amap.com/maps?v=1.2&key=这里是高德的key"></script>
</head>
<body onLoad="mapInit()">
<div id="buttons">
<ul>
<li>
<button onclick="javascript:driving_route();">驾车行程</button>
</li>
<li>
<button onclick="javascript:clearMap();">清空</button>
</li>
</ul>
</div>
<div id="result"></div>
</body>
<script language="javascript">
var mapObj;
var route_text = "";
//初始化地图对象，加载地图
function mapInit(){
mapObj = new AMap.Map("iCenter",{
center:new AMap.LngLat(120.1000, 30.8766), //地图中心点：湖州
level:11 //比例尺
});
}
//清空地图
function clearMap(){
mapObj.clearMap();
document.getElementById("result").innerHTML = ' ';
}
//地址坐标
var ad = new Array();
ad[0]=new AMap.LngLat(120.10266,30.867054)
ad[1]=new AMap.LngLat(120.09536,30.866726)
ad[2]=new AMap.LngLat(120.10358,30.872642)
ad[3]=new AMap.LngLat(120.11806,30.868422)
ad[4]=new AMap.LngLat(120.114014,30.862691)
ad[5]=new AMap.LngLat(120.104868,30.856874)
//驾车导航
function driving_route() {
clearMap();
mapObj.plugin(["AMap.Driving"], function() {
var DrivingOption = {
policy: AMap.DrivingPolicy.LEAST_TIME
};
for (var i=0; i<5; i++){
var j=i+1;
function f(){
if(j<6){
var MDrive = new AMap.Driving(DrivingOption);
AMap.event.addListener(MDrive, "complete", driving_routeCallBack);
MDrive.search(ad[i],ad[j]);
j++;
setTimeout(f(),50);
}
}
f(j);
}
});
}
//导航结果
function driving_routeCallBack(data) {
var routeS = data.routes;
if (routeS.length <= 0) {
}
else{
var totaldis = 0;
for(var v=0; v<routeS.length; v++){
var distance = routeS[v].distance; //行车距离
totaldis += distance; //总路程
}
route_text = route_text + " " + totaldis;
document.getElementById("result").innerHTML = route_text;
}
}
问题之前已解决，看到这么久也没别人回答，我自己说一下解决思路吧。
问题出在回调函数异步加载上，如果直接用 for 循环执行，就会受制于网络请求速度，导致输出混乱。但是，这里如果使用递归，先执行输出再进行下一步，就没有问题了。