Question

我是JavaScript的新手。

编写使用GooogleMaps API的脚本

工作正常。从数据库中获取Lat Lngs，制作标记，放在地图上。

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

提供警报以进行诊断。开始工作。

缩小到在被调用函数MakeLatLngs（）的顶部发出警报。

无论警报是否存在或已注释掉，

MakeLatLngs代码似乎都会执行。只是地图显示的是alert语句，并且不会显示注释掉的alert语句。警报只是文本而不是使用任何变量。所以我不知道这里发生了什么。

在绘制地图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">

Answer 1

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

Asp.Net Page JavaScript警报命令改变程序行为

1 个答案: