有关Javascript和Google Map API的问题

Question

I am currently working on a project about taxis. 我目前正在从事有关出租车的项目。 I want to display some taxis on Google Map but encountered the following problem. 我想在Google Map上显示一些出租车，但是遇到以下问题。 When the program turns into function print_taxi(), all data in taxilatlng[] will disappear! 当程序变成函数print_taxi（）时，taxatelng []中的所有数据都将消失！ It seems that all of the data can only be kept inside directionsservice.route(){}. 看来所有数据只能保存在directionsservice.route（）{}中。 Need help. 需要帮忙。

<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script>
onerror=handleErr
var txt=""

function handleErr(msg,url,l)
{
    txt="There was an error on this page.\n\n"
    txt+="Error: " + msg + "\n"
    txt+="URL: " + url + "\n"
    txt+="Line: " + l + "\n\n"
    txt+="Click OK to continue.\n\n"
    alert(txt)
    return true
}

var centerlat=22.551622;
var centerlng=114.121178;
var taxi_num=10;
var taxiradius=0.005;

var taxilatlng = new Array();
var taximarker = new Array();
var taxilat = new Array();
var taxilng = new Array();
var map;

var RANDOM_DATA_INITIALIZED;

function get_random(lowerbound, upperbound){
    return lowerbound+Math.floor((upperbound-lowerbound)*Math.random());
}

function get_random_loc(now, radius){
    return now+radius-Math.random()*2*radius;
}

function get_random_latlng(taxiradius){
    var tmp=new google.maps.LatLng(get_random_loc(centerlat,taxiradius), get_random_loc(centerlng,taxiradius));
    return tmp;
}

function dump_obj(myObject) {  
  var s = "";  
  for (var property in myObject) {  
  s = s + "\n "+property +": " + myObject[property] ;  
  }
  alert(s);  
}  

function init_map()
{

    var latlng=new google.maps.LatLng(centerlat, centerlng);
    var options={
        zoom:16,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    map=new google.maps.Map(document.getElementById("map_canvas"), options);

}

function print_taxi(){
    image="taxi.gif";
    for(var i=1;i<=taxi_num; ++i){
        taximarker[i]=new google.maps.Marker({
            position: taxilatlng[i],
            icon: image,
            map: map
        });
    }
}

function get_taxi_pos()
{
    var cnt_generatedcar=0;

    for(var i=1;i<=taxi_num; i++)
    {
        var from=get_random_latlng(taxiradius);
        var to=get_random_latlng(taxiradius);
        var directionsservice=new google.maps.DirectionsService();
        var taxirenderer=new google.maps.DirectionsRenderer();
        var DirReq={
                origin: from,
                destination: to,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
        };

        directionsservice.route(DirReq, function(response, status){
            if(status==google.maps.DirectionsStatus.OK)
            {
                var all_routes = response.routes;
                for(curroute in all_routes)
                {
                    ++cnt_generatedcar;
                    var all_paths = all_routes[curroute].overview_path;
                    var cnt_paths = all_paths.length;
                    var id_path=get_random(0, cnt_paths-1);
                    taxilatlng[i] = all_paths[id_path];
                    if(cnt_generatedcar==taxi_num){
                        print_taxi();
                    }
                }
            }
        });
    }
}

function init(){

    init_map();

    get_taxi_pos();

}


</script>
</head>

<body onload="init();">
<div id="map_canvas" style="float:left; width:70%; height:100%"></div>
<div id="msg"></div>
</body>

</html>

Answer 1

directionsservice.route is a callback method and is called only after i >taxi_num. directionsservice.route是一种回调方法，仅在i> taxi_num之后才被调用。 As a result the value in taxilatlng is getting set only once at index (taxi_num+1). 结果，滑行中的值仅在索引（taxi_num + 1）处设置一次。 You can modify the code to something like : 您可以将代码修改为：

 var ctr = -1; // added
 directionsservice.route(DirReq, function(response, status){if(status==google.maps.DirectionsStatus.OK)
        {
            var all_routes = response.routes;
    ctr++;
            for(curroute in all_routes)
            {
                ++cnt_generatedcar;
                var all_paths = all_routes[curroute].overview_path;
                var cnt_paths = all_paths.length;
                var id_path=get_random(0, cnt_paths-1);
                taxilatlng[ctr] = all_paths[id_path];

                if(cnt_generatedcar==taxi_num){
                    print_taxi();
                }
            }
        }
    });

I've just used a new variable as a counter instead of i. 我只是使用一个新变量代替i作为计数器。

有关Javascript和Google Map API的问题

问题描述

1 个解决方案

解决方案1
0 已采纳 2011-01-08 13:42:44

有关Javascript和Google Map API的问题

问题描述

1 个解决方案

解决方案1 0 已采纳 2011-01-08 13:42:44

解决方案1
0 已采纳 2011-01-08 13:42:44