Question

google maps api不会加载在initialize（）函数中定义的居中位置，而是在最后添加的标记（marker6）周围加载一个未知位置。

是什么导致它没有加载正确的位置？

提前感谢，

<script type="text/javascript">

var map;

    $(document).ready(function() {


    initialize();

    var BW = new google.maps.LatLng(50.892726, 3.471283);
    map.panTo(BW);

    $("#test1").click(function() {
    var BW = new google.maps.LatLng(50.892726, 3.471283);
    map.panTo(BW);
    resetLink();
    $('#test1').css ({'color':'white'});
    });

    $("#test2").click(function() {
    var BW2 = new google.maps.LatLng(50.863026,3.442379);
    map.panTo(BW2);
    resetLink();
    $('#test2').css ({'color':'white'});
    });

    $("#test3").click(function() {
    var BW3 = new google.maps.LatLng(50.748454,3.131254);
    map.panTo(BW3);
    resetLink();
    $('#test3').css ({'color':'white'});
    });

    $("#test4").click(function() {
    var BW4 = new google.maps.LatLng(49.272504,16.220863);
    map.panTo(BW4);
    resetLink();
    $('#test4').css ({'color':'white'});
    });

    $("#test5").click(function() {
    var BW5 = new google.maps.LatLng(51.498496,5.397516);
    map.panTo(BW5);
    resetLink();
    $('#test5').css ({'color':'white'});
    });

    $("#test6").click(function() {
    var BW6 = new google.maps.LatLng(52.35057,16.523513);
    map.panTo(BW6);
    resetLink();
    $('#test6').css ({'color':'white'});
    });


});


function resetLink() {
    $('#test1').css ({'color':'#7faacb'});
    $('#test2').css ({'color':'#7faacb'});
    $('#test3').css ({'color':'#7faacb'});
    $('#test4').css ({'color':'#7faacb'});
    $('#test5').css ({'color':'#7faacb'});
    $('#test6').css ({'color':'#7faacb'});
}



function initialize() {
     var mapOptions = {
      scrollwheel: false,
      scaleControl: false,
      center: new google.maps.LatLng(50.89266,3.47237),
      zoom: 16,
      mapTypeId: google.maps.MapTypeId.ROADMAP
};

   map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);




  var contentString = '<div id="content">'+
  '<p><b>Building Plastics nv</b><br />' +
  'Herlegemstraat 14<br />'+
  'B-9771 Nokere<br />'+
  '056 60 48 11'+
  '</p>'+
  '</div>';

  var contentString2 = '<div id="content">'+
  '<p><b>Building Windows</b><br />' +
  'Grote Leiestraat 205<br />'+
  'B-8570 Anzegem<br />'+
  '056 62 11 40 '+
  '</p>'+
  '</div>';

  var contentString3 = '<div id="content">'+
  '<p><b>Building Plastics France</b><br />' +
  'Avenue Europe 46<br />'+
  'F-59435 Roncq Cedex<br />'+
  '03 20 03 99 99 '+
  '</p>'+
  '</div>';

  var contentString4 = '<div id="content">'+
  '<p><b>Building Plastics CZ</b><br />' +
  'Velk&agrave; B&iacute;te&#353; 76<br />'+
  '595 01 Velk&agrave; B&iacute;te&#353;<br />'+
  '800 400 115'+
  '</p>'+
  '</div>';

  var contentString5 = '<div id="content">'+
  '<p><b>Building Plastics NL</b><br />' +
  'Magazijnweg 23<br />'+
  '5683 CV Best<br />'+
  '0499 37 53 27'+
  '</p>'+
  '</div>';

 var contentString6 = '<div id="content">'+
  '<p><b>Building Plastics PL</b><br />' +
  'Przemyslowa 3<br />'+
  '64-320 Buk<br />'+
  '061 814 91 61'+
  '</p>'+
  '</div>';

var infowindow = new google.maps.InfoWindow({
  content: contentString,
   maxWidth: 250,

});

var infowindow2 = new google.maps.InfoWindow({
  content: contentString2,
   maxWidth: 250,

});
var infowindow3 = new google.maps.InfoWindow({
  content: contentString3,
   maxWidth: 250,

});
   var infowindow4 = new google.maps.InfoWindow({
  content: contentString4,
   maxWidth: 250,

});
   var infowindow5 = new google.maps.InfoWindow({
  content: contentString5,
   maxWidth: 250,

});
  var infowindow6 = new google.maps.InfoWindow({
  content: contentString6,
   maxWidth: 250,

});

    var myLatlng = new google.maps.LatLng(50.8923380,3.477300);
    var myLatlng2 = new google.maps.LatLng(50.862987,3.446863);
    var myLatlng3 = new google.maps.LatLng(50.748411,3.136749);
    var myLatlng4 = new google.maps.LatLng(49.271619,16.225359);
    var myLatlng5 = new google.maps.LatLng(51.498349,5.401329);
    var myLatlng6 = new google.maps.LatLng(52.350542,16.52786);


var marker = new google.maps.Marker({
  position: myLatlng,
  map: map,
  title: 'BP1'
});
var marker2 = new google.maps.Marker({
  position: myLatlng2,
  map: map,
  title: 'BP2'
});
var marker3 = new google.maps.Marker({
  position: myLatlng3,
  map: map,
  title: 'BP3'
});
var marker4 = new google.maps.Marker({
  position: myLatlng4,
  map: map,
  title: 'BP4'
});
  var marker5 = new google.maps.Marker({
  position: myLatlng5,
  map: map,
  title: 'BP5'
});
  var marker6 = new google.maps.Marker({
  position: myLatlng6,
  map: map,
  title: 'BP6'
});

  google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map,marker);
     });
    google.maps.event.addListener(marker2, 'click', function() {
    infowindow2.open(map,marker2);
     });
    google.maps.event.addListener(marker3, 'click', function() {
    infowindow3.open(map,marker3);
     });
    google.maps.event.addListener(marker4, 'click', function() {
    infowindow4.open(map,marker4);
     });
    google.maps.event.addListener(marker5, 'click', function() {
    infowindow5.open(map,marker5);
     });
    google.maps.event.addListener(marker6, 'click', function() {
    infowindow6.open(map,marker6);
    });

    infowindow.open(map,marker);
    infowindow2.open(map,marker2);
    infowindow3.open(map,marker3);
    infowindow4.open(map,marker4);
    infowindow5.open(map,marker5);
    infowindow6.open(map,marker6);

      }

      google.maps.event.addDomListener(window, 'load', initialize);
</script>

Answer 1

首先初始化（）;被调用并将位置设置为：

center: new google.maps.LatLng(50.89266,3.47237)

但就在那之后你称之为：

var BW = new google.maps.LatLng(50.892726, 3.471283);
map.panTo(BW);

所以BW是你的新中心。这是你的意思吗？

Answer 2

好的，我发现了问题，

初始化时，它会打开6个textballoons，导致它出错？ idk确切的原因是什么？

无论如何，我改变了

    infowindow.open(map,marker);
    infowindow2.open(map,marker2);
    infowindow3.open(map,marker3);
    infowindow4.open(map,marker4);
    infowindow5.open(map,marker5);
    infowindow6.open(map,marker6);

到

    $("#test2").click(function() {
     infowindow2.open(map,marker2);
    });

    $("#test3").click(function() {
     infowindow3.open(map,marker3);
    });

    $("#test4").click(function() {
     infowindow4.open(map,marker4);
    });

    $("#test5").click(function() {
     infowindow5.open(map,marker5);
    });

    $("#test6").click(function() {
     infowindow6.open(map,marker6);
    });

所以只有在点击并发送到该位置时才打开文本框。

无法解释为什么因为我实际上不知道javascript那么好。

Google Maps API不会加载正确的居中位置，而是加载到最后添加的标记区域

2 个答案: