谷歌地图API只显示了4个标记中的3个
Google maps API only shows 3 markers out of 4?
我有这段代码和多标记设置应该正确工作它设置在一个数组中,我循环它们,但问题是我在我的数组中有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();
数据数组错误。第二个和第四个数组将lat和lng作为一个值,尽管其余的(正确地)是两个不同的值。在这些lat和lng之间添加逗号,你应该没问题。
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]
];
相关文章:
- 如何使用url加载程序在webpack中导入多个图像
- 多个单选按钮组相互干扰
- 下拉选择可自动更改第二个下拉选择
- onkeyup无法动态创建多个文本区域
- JQuery合并了keyup和focusout两个函数
- 正在验证8个真/假复选框或复选框中的2个
- 借助asp.net验证或java脚本对多个文本进行验证
- 如何使用 node.js 比较两个 json 数组
- 为复选框javascript指定两个值
- Phonegap-(安卓/iphone)多个图像的图像库出现问题
- jQuery自定义验证比较多个输入的序列
- Html页面上的多个Base64图像和平滑加载
- 节点是否需要模块传递带有方括号的arg?这是个错误吗
- 使用javascript检查多个输入值,并在1次检查中标记多个输入框
- KnockoutJS-组件-多个实例
- Google 应用脚本:返回 2 个两个范围之间唯一值的函数
- Select2使用ajax和php基于第一个(多个)选择填充第二个字段
- 原生Javascript querySelectorAll()带有多个/多个伪选择器/匹配
- 如何将两个/多个对象作为参数传递给函数
- gull-concat只连接两个(半个)JS文件