当我在局部视图中使用googleApi时出现“太多递归”错误

Question

当我在部分视图中使用googleApi时出现“太多递归”错误

解决方案是什么？

局部视图中

：

<script type="text/javascript">
    var poly;
    var geodesicPoly;
    var marker1;
    var marker2;
    var locations;
    var map;
    var flag = 0; 
    var geodesicPoly = null;
    $(document).ready(function () {
        
        function initialize() {
            var middleest = new google.maps.LatLng(32.2717923, 53.7049971);
            var mapOptions = {
                zoom: 5,
                center: middleest,
                minZoom: 15, maxZoom: 5
            };
            var map = new google.maps.Map(document.getElementById('flying_network'), mapOptions);
            map.setCenter(middleest);
            map.controls[google.maps.ControlPosition.TOP_CENTER].push(document.getElementById('info'));
            $.ajax({
                type: "POST",
                url: "/Route/FlightCording",
                data: {},
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    setMarkers(map, data);
                },
                error: function (x, e) {
                    alert("The call to the server side failed. " + x.responseText);
                }
            });
        }

        google.maps.event.addDomListener(window, 'load', initialize);
        function setMarkers(map, locations) {
            // Add markers to the map
            var shape = {
                coord: [1, 1, 1, 20, 18, 20, 18, 1],
                type: 'poly'
            };

            for (var i = 0; i < locations.length; i++) {
                var airport = locations[i];
                var myLatLng = new google.maps.LatLng(airport.LatitudeDeg, airport.LongitudeDeg);
                var marker = new google.maps.Marker({
                    position: myLatLng,
                    map: map,
                    shape: shape,
                    animation: google.maps.Animation.DROP,
                    title: airport.AirportTitle,
                    zIndex: 1
                });
                var infowindow = new google.maps.InfoWindow();
                google.maps.event.addListener(marker, 'click', (function (marker, airport, infowindow) {
                    return function () {
                        //var notif;
                        showRoutes(airport.AirportIataCode).done(function (result) {
                            //رفتن به موقعیت مکانی مارکر
                            map.setCenter(marker.getPosition());
                            //نمایش اطلاعات
                        });
                    };
                })(marker, airport, infowindow));
                //google.maps.event.clearListeners(marker, 'click');
            }
        }
        function showRoutes(iatacode) {
            return $.ajax({
                type: "POST",
                url: "/Route/RouteLines",
                data: "{sourceIataCode:'" + iatacode + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    for (var i = 0; i < data.length; i++) {
                        geodesicPoly = new google.maps.Polyline({
                            strokeColor: '#CC0099',
                            strokeOpacity: 1.0,
                            strokeWeight: 3,
                            geodesic: true,
                            map: map
                        });

                        var marker1 = new google.maps.Marker({
                            map: map,
                            draggable: false,
                            position: { lat: data[i].sourceLat, lng: data[i].sourceLong }
                        });

                        var marker2 = new google.maps.Marker({
                            map: map,
                            draggable: false,
                            position: { lat: data[i].destinationLat, lng: data[i].destinationLong }
                        });

                        var bounds = new google.maps.LatLngBounds(new google.maps.LatLng(data[i].sourceLat, data[i].sourceLong), new google.maps.LatLng(data[i].destinationLat, data[i].destinationLong));
                        map.fitBounds(bounds);

                        // drawing line
                        var path = [new google.maps.LatLng(data[i].sourceLat, data[i].sourceLong), new google.maps.LatLng(data[i].destinationLat, data[i].destinationLong)];

                        geodesicPoly.setPath(path);

                        // create marker event
                        var destIataCode = data[i].destinationIataCode;
                        google.maps.event.addListener(marker2, 'click', (function (marker2, destIataCode) {
                            return function () {
                                showRoutes(destIataCode).done(function (result) {
                                    map.setCenter(marker.getPosition());
                                });
                            };
                        })(marker2, destIataCode));
                    }

                },
                error: function (x, e) {
                    alert("Error");
                }
            });
        }
        function addLine() {
            geodesicPoly.setMap(map);
        }
        function removeLine() {
            geodesicPoly.setMap(null);
        }
       
    });
    
   
</script>

<div id="flying_network" class="col-md-5 col-sm-5 col-xs-12"></div>

当我在部分视图中使用googleApi时出现“太多递归”错误

解决方案是什么？

Answer 1

您的MapOptions对象中的maxZoom和minZoom属性已被撤消。应该是：

var mapOptions = {
  zoom: 5,
  center: middleest,
  minZoom: 5,
  maxZoom: 15
};

proof of concept fiddle

代码段

＆＃13;

＆＃13;

var poly;
var geodesicPoly;
var marker1;
var marker2;
var locations;
var map;
var flag = 0;
var geodesicPoly = null;
$(document).ready(function() {

  function initialize() {
    var middleest = new google.maps.LatLng(32.2717923, 53.7049971);
    var mapOptions = {
      zoom: 5,
      center: middleest,
      minZoom: 5,
      maxZoom: 15
    };
    var map = new google.maps.Map(document.getElementById('flying_network'), mapOptions);
    map.setCenter(middleest);
    map.controls[google.maps.ControlPosition.TOP_CENTER].push(document.getElementById('info'));
    $.ajax({
      type: "POST",
      url: "/Route/FlightCording",
      data: {},
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(data) {
        setMarkers(map, data);
      },
      error: function(x, e) {
        alert("The call to the server side failed. " + x.responseText);
      }
    });
  }

  google.maps.event.addDomListener(window, 'load', initialize);

  function setMarkers(map, locations) {
    // Add markers to the map
    var shape = {
      coord: [1, 1, 1, 20, 18, 20, 18, 1],
      type: 'poly'
    };

    for (var i = 0; i < locations.length; i++) {
      var airport = locations[i];
      var myLatLng = new google.maps.LatLng(airport.LatitudeDeg, airport.LongitudeDeg);
      var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        shape: shape,
        animation: google.maps.Animation.DROP,
        title: airport.AirportTitle,
        zIndex: 1
      });
      var infowindow = new google.maps.InfoWindow();
      google.maps.event.addListener(marker, 'click', (function(marker, airport, infowindow) {
        return function() {
          //var notif;
          showRoutes(airport.AirportIataCode).done(function(result) {
            //رفتن به موقعیت مکانی مارکر
            map.setCenter(marker.getPosition());
            //نمایش اطلاعات
          });
        };
      })(marker, airport, infowindow));
      //google.maps.event.clearListeners(marker, 'click');
    }
  }

  function showRoutes(iatacode) {
    return $.ajax({
      type: "POST",
      url: "/Route/RouteLines",
      data: "{sourceIataCode:'" + iatacode + "'}",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      success: function(data) {
        for (var i = 0; i < data.length; i++) {
          geodesicPoly = new google.maps.Polyline({
            strokeColor: '#CC0099',
            strokeOpacity: 1.0,
            strokeWeight: 3,
            geodesic: true,
            map: map
          });

          var marker1 = new google.maps.Marker({
            map: map,
            draggable: false,
            position: {
              lat: data[i].sourceLat,
              lng: data[i].sourceLong
            }
          });

          var marker2 = new google.maps.Marker({
            map: map,
            draggable: false,
            position: {
              lat: data[i].destinationLat,
              lng: data[i].destinationLong
            }
          });

          var bounds = new google.maps.LatLngBounds(new google.maps.LatLng(data[i].sourceLat, data[i].sourceLong), new google.maps.LatLng(data[i].destinationLat, data[i].destinationLong));
          map.fitBounds(bounds);

          // drawing line
          var path = [new google.maps.LatLng(data[i].sourceLat, data[i].sourceLong), new google.maps.LatLng(data[i].destinationLat, data[i].destinationLong)];

          geodesicPoly.setPath(path);

          // create marker event
          var destIataCode = data[i].destinationIataCode;
          google.maps.event.addListener(marker2, 'click', (function(marker2, destIataCode) {
            return function() {
              showRoutes(destIataCode).done(function(result) {
                map.setCenter(marker.getPosition());
              });
            };
          })(marker2, destIataCode));
        }

      },
      error: function(x, e) {
        alert("Error");
      }
    });
  }

  function addLine() {
    geodesicPoly.setMap(map);
  }

  function removeLine() {
    geodesicPoly.setMap(null);
  }

});

＆＃13;

html,
body,
#flying_network {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="flying_network" class="col-md-5 col-sm-5 col-xs-12"></div>

＆＃13;

＆＃13;

＆＃13;