0

我是 JavaScript 新手。

编写使用 GooogleMaps API 的脚本

工作正常。从数据库中获取纬度,制作标记,放在地图上。

决定将函数调用向上移动一个级别,(它在 PageMethod 调用的 OnSuccess 方法中)。停止工作。

放入警报以进行诊断。开始工作。

缩小到在调用函数 MakeLatLngs() 的顶部有警报。

无论警报是否存在或被注释掉,MakeLatLngs 代码似乎都会执行。只是地图显示带有警报语句,而不显示带有注释掉的警报语句。警报只是文本,不使用任何变量。所以我不知道这里发生了什么。

同样的事情也发生在绘制地图 DrawMap() 的函数中。我在函数开始时放置了一个信息警报,然后地图绘制了。把它放在外面,地图不会。

任何有关正在发生的事情的线索将不胜感激?

脚本如下。流程从脚本底部的函数 Initialise 开始。谢谢

     var myPositions = [];
     var myRoutes = [];
     var myString = [];
     var myLatLngs = [];
     var myTitles = [];
     var NumPoints;
     var map;
     var poly;
     var RouteName;
     var myMarkers = [];
     var myMapCentre = new google.maps.LatLng(-41.2954168187213, 174.767133718655);
     function DrawMap() {
         alert("Generating Points for " + RouteName);// Need this to display
         var thisLatLng = myLatLngs[0];

         var myOptions = {
             zoom: 8,
             center: thisLatLng,
             mapTypeId: google.maps.MapTypeId.ROADMAP
         };

         map = new google.maps.Map(document.getElementById('map_canvas'),
        myOptions);

         MakeMarkers();
         RouteLine();
     }

     function OnSuccess1(response) {
         myPositions = new Array();

         myString = response;

         NumPoints = response.length;
         for (var i = 0; i < NumPoints; i++) {
             myPositions[i] = response[i];

         }
     }
     function OnError1(response) {
     }

     function Marker()
     {
     this.meterId=0;
     this.latLng="";
     }
     function OnSuccess(response) {
         myPositions = new Array();

         myString = response;

         NumPoints = response.length;
         alert("Numpoints is " + NumPoints);
         for (var i = 0; i < NumPoints; i++) {
             myPositions[i] = response[i];

         }
         alert("Exiting OnSuccess");
         //MakeLatLngs(); //ORIGINAL POSITION OF LATLNG CALL
         return true;
     }

     function setRoute() {
     RouteName = prompt(' What route?', '');

     }

     function OnError(error) {
         alert("In Error");
     }
     function RouteLine() {
         var polyOptions = {
             strokeColor: '#000000',
             strokeOpacity: 1.0,
             strokeWeight: 3
         }
         poly = new google.maps.Polyline(polyOptions);
         poly.setMap(map);
         var path = poly.getPath();
         for (var i = 0; i < NumPoints; i++) {
             path.push(myLatLngs[i]);
         }

     }

     function MakeLatLngs() {
         alert("You need me now " );//Got to have this to display OK when called from LoadData
         myLatLngs = new Array();
         for (var i = 0; i < NumPoints; i++) {

             var sMarker = myPositions[i];

             var SeqPos = sMarker.indexOf(";");
             var latLngPos = sMarker.indexOf(";", SeqPos + 1);
             var marker = sMarker.substring(0, latLngPos);
             //alert("Marker is " + marker);
             //var Seq = sMarker.substring(latLngPos + 1, SeqPos - latLngPos);
             myTitles[i] = marker;
             //alert("MeterId is " + marker);
             var sLatLng = sMarker.substring(latLngPos + 1)
             //alert("SLatLng is " + sLatLng);
             var pos = sLatLng.indexOf(",");
             //alert("pos is " + pos);
             var sLat = sLatLng.substring(0, pos);
             //alert("sLat is " + sLat);
             var sLng = sLatLng.substring(pos + 1, sLatLng.length - 1);
             //alert("sLng is " + sLng);
             var lat = parseFloat(sLat);
             var lng = parseFloat(sLng);


             //alert("Lat is " + lat + " Long is " + lng);
             if (!isNaN(lng) && !isNaN(lat) && lat != 0 && lng != 0 ) {
                 var latlng = new google.maps.LatLng(lat, lng);
                 myLatLngs[i] = latlng;
             }

         }
         alert("Exiting MakeLatLngs")

     }

     function MakeMarkers() {

         for (var i = 0; i < NumPoints; i++) {
             var sTitle = "MyValue " + i;
             var marker = new google.maps.Marker({
                 position: myLatLngs[i],
                 map: map,
                 title: myTitles[i]
             });
         }
     }

     function LoadData() {

         setRoute();//Get the desired route from the user
         PageMethods.GetMarkers(RouteName, OnSuccess, OnError);
         MakeLatLngs(); //Works here ONLY WHEN AN ALERT IS FIRST LINE in FUNCTION. Orginal call was at end of OnSuccess
         //PageMethods.GetRouteBoundaries(OnSuccess1, OnError1);
         return false;
     }

     function initialize() {

         LoadData();
         DrawMap();
     }

     google.maps.event.addDomListener(window, 'load', initialize);//yes you do need this with or without <body onload="initialise">
4

1 回答 1

1

原因是您的PageMethods.GetMarkers是异步的,因此在您调用DrawMap时尚未加载数据。我猜当您使用警报时,它会暂停执行足够长的时间以加载数据。将DrawMap方法放在页面方法的OnSuccess中,应该可以解决问题。

于 2012-05-30T03:35:57.130 回答