2016-09-13 5 views
-1

私はこのコードの塊を持っていて、マルチマーカーの設定は正しく動作するはずです。配列に設定してループしますが、問題は私の配列に4つの項目があり、それはすべてのものを通過するはずだからです。GoogleマップAPIは4つのマーカーのうち3つしか表示していませんか?

/*array for locations below */ 
var locations = [ 
    ['<h4>Kingsley Recruitment Liverpool <br/><br/> 11th Floor, The Plaza<br/> 100 Old Hall Street <br/> Liverpool <br/> L3 9QJ <br/> <br/> 0151 242 1630</h4>', 53.4109146,-2.9947334999999384], 

    ['<h4>Kingsley Recruitment Manchester <br/><br/> Centurion House<br/>129 Deansgate<br/>Manchester<br/>M3 3WR <br/> <br/> 0161 393 9889 </h4>', 53.479798 -2.2479048], 

    ['<h4>Kingsley Recruitment London <br><br> Warnford Court <br> 29 Throgmorton Street<br> London <br> EC2N 2AT <br><br> 0203 817 7030</h4>', 51.5074, 0.1278], 

    ['<h4>Kingsley Recruitment Birmingham</h4>', 52.48208 -1.9027578], 


    ['<h4>Kingsley Recruitment Leeds <br><br> West One <br> Wellington Street<br>Leeds<br>LS1 1BA <br><br>0113 887 2170 </h4>', 53.8008 , -1.5491] 
]; 

// Setup the different icons and shadows 
var iconURLPrefix = 'https://www.google.com/intl/en_ALL/mapfiles/'; 

var icons = [ 
    iconURLPrefix + 'marker_black.png', 

] 
var iconsLength = icons.length; 

var map = new google.maps.Map(document.getElementById('MAPS'), { 
    zoom: 6, 
    center: new google.maps.LatLng(52.6369, -1.1398), 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    mapTypeControl: false, 
    streetViewControl: false, 
    scrollwheel:false, 
    panControl: false, 
    zoomControlOptions: { 
    position: google.maps.ControlPosition.LEFT_BOTTOM 
    } 
}); 





var infowindow = new google.maps.InfoWindow({ 
    maxWidth: 160 
}); 

var markers = new Array(); 

var iconCounter = 0; 

// Add the markers and infowindows to the map 
for (var i = 0; i < locations.length; i++) { 
    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map, 
    icon: icons[iconCounter] 
    }); 

    markers.push(marker); 

    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
     infowindow.setContent(locations[i][0]); 
     infowindow.open(map, marker); 
    } 
    })(marker, i)); 

    iconCounter++; 

    if(iconCounter >= iconsLength) { 
    iconCounter = 0; 
    } 
} 

function autoCenter() { 
    // Create a new viewpoint bound 
    var bounds = new google.maps.LatLngBounds(); 
    // Go through each... 
    for (var i = 0; i < markers.length; i++) { 
    bounds.extend(markers[i].position); 
    } 
    // Fit these bounds to the map 
    map.fitBounds(bounds); 
} 
autoCenter(); 
+1

これは表示されていませんか?最後のもの? –

+0

['

Kingsley Recruitment Birmingham

'、52.48208 -1.9027578]、 – JkenGJ

+0

2番目と4番目の文字は、1つの文字列に宇宙で区切られています。 1番目と3番目の配列には2つの異なる値があります。そしてそれは3/5 –

答えて

1

データ配列にエラーがあります。 2番目と4番目の配列はlatとlngを1つの値として持ちますが、残りは(正しく)2つの異なる値です。 緯度経度と緯度経度の間にカンマを追加すると、うまくいくはずです。

var locations = [ 
    ['<h4>Kingsley Recruitment Liverpool <br/><br/> 11th Floor, The Plaza<br/> 100 Old Hall Street <br/> Liverpool <br/> L3 9QJ <br/> <br/> 0151 242 1630</h4>', 53.4109146,-2.9947334999999384], 

    ['<h4>Kingsley Recruitment Manchester <br/><br/> Centurion House<br/>129 Deansgate<br/>Manchester<br/>M3 3WR <br/> <br/> 0161 393 9889 </h4>', 53.479798, -2.2479048], 

    ['<h4>Kingsley Recruitment London <br><br> Warnford Court <br> 29 Throgmorton Street<br> London <br> EC2N 2AT <br><br> 0203 817 7030</h4>', 51.5074, 0.1278], 

    ['<h4>Kingsley Recruitment Birmingham</h4>', 52.48208, -1.9027578], 


    ['<h4>Kingsley Recruitment Leeds <br><br> West One <br> Wellington Street<br>Leeds<br>LS1 1BA <br><br>0113 887 2170 </h4>', 53.8008 , -1.5491] 
]; 
関連する問題