我的第5个标记未显示,怎么了?

时间:2019-04-23 13:33:13

标签: javascript jquery html google-maps

我的第四个标记没有显示,我似乎找不到问题。 我检查了变量名是否正确,检查了语法,甚至更改了位置变量以查看是否会改变任何内容。地图会加载,但不会显示超过3个标记。

这里是我的代码:

<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Test</title>

<style>

    #map {
        height: 500px;
        width: 100%;
    }

</style>
</head>

<body>
<div id="map"></div>
<script>

    function initMap() {

// Markers position
var pos = {lat: 38.64971527, lng: -9.143150};
var pos1 = {lat: 38.628753, lng: -9.115710};
var pos2 = {lat: 38.61512, lng: -9.110663};
var pos3 = {lat: 38.615125, lng: -9.110663};

// Map
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 12,
      center: {lat: 38.628753, lng: -9.115710}
        });
        
//Markers
   var Mark = new google.maps.Marker({
  position: pos,
  map: map,
});

 var Mark1 = new google.maps.Marker({
  position: pos1,
  map: map,
});

  var Mark3 = new google.maps.Marker({
   position: pos2,
   map: map,
});
  var Marker4 = new google.maps.Marker({
   position: pos3,
   map: map,
});

}
</script>

<script async defer src="https://maps.googleapis.com/maps/api/js?AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>

</html>

1 个答案:

答案 0 :(得分:1)

所有标记在此处。在您的缩放级别,pos2pos3的标记非常接近,以至于它们重叠。如果您使用地图缩放/鼠标轮进行放大,则可以看到两者。