Javascript 标记群集不工作_Javascript_Google Maps

Javascript 标记群集不工作

javascript google-maps

Javascript 标记群集不工作,javascript,google-maps,Javascript,Google Maps,我正在尝试用下面的代码实现Marker集群，但它不起作用。当我尝试执行此操作时，它会显示标记，但不会对标记进行聚类。我试图解决这个问题，但失败了。有人能帮我解决这个问题吗在下面的代码Var records中，保存带有纬度和经度值的记录 <html> <style> #map { height: 100%; } </style> <body> <div id="map" s

我正在尝试用下面的代码实现Marker集群，但它不起作用。当我尝试执行此操作时，它会显示标记，但不会对标记进行聚类。我试图解决这个问题，但失败了。有人能帮我解决这个问题吗

在下面的代码

Var records

中，保存带有纬度和经度值的记录

<html>
    <style>
      #map {
        height: 100%;
      }
    </style>

<body>

   <div id="map" style="width:100%;height:700px"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js">
    </script>

    <script> 
function myMap() {
        var myCenter = new google.maps.LatLng(12.9715987,77.5945627);
        var mapCanvas = document.getElementById("map");
        var mapOptions = {center: myCenter, zoom: 2};
 //some code is there to fetch the records
      var  records = result.getArray("records");// it has records with latitude and longitude values

     for (var i=0; i< records.length; i++) {
              var record = records[i];
         console.log(record.Name + " -- " + record.Id+" -- "+record.Latitude);

           var markers = [];
            var marker = new google.maps.Marker({
                     position: new google.maps.LatLng(record.Latitude,record.Longitude),
                     map : map,
                    //icon: 'brown_markerA.png'
                    icon: 'http://maps.google.com/mapfiles/ms/icons/green-dot.png'

                });
          markers.push(marker);

                     var markerCluster = new MarkerClusterer(map, markers, {imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'});
              } 
    }
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=&callback=myMap"></script>
</body>
</html>


#地图{
身高：100%；
}
函数myMap（）{
var myCenter=new google.maps.LatLng（12.9715987,77.5945627）；
var mapCanvas=document.getElementById（“map”）；
var mapOptions={center:myCenter，zoom:2}；
//有些代码是用来获取记录的
var records=result.getArray（“records”）；//它有带纬度和经度值的记录
对于（var i=0；i

您的代码中有几个拼写错误：

您没有

google.maps.Map

变量

如果要在循环内部创建空数组，请将其移到外部

代码片段：

函数myMap（）{
var myCenter=new google.maps.LatLng（12.9715987,77.5945627）；
var mapCanvas=document.getElementById（“map”）；
变量映射选项={
中心：迈森特，
缩放：2
};
var map=new google.maps.map（mapCanvas，mapOptions）；
//有些代码是用来获取记录的
var记录=[{纬度：12.9715，经度：77.5945627}，{纬度：12.97159，经度：77.594}，{纬度：12.9715987，经度：77.5945627}，{纬度：12.971，经度：77.5945627}，{纬度：12.97，经度：77.5945627}]；
var标记=[]；
对于（var i=0；i
html，
身体，
#地图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}

我在发布的代码中遇到javascript错误（在修复了未捕获的引用错误：结果未定义之后），js？libraries=geometry，places&ext=.js:40 InvalidValueError:setMap:不是Map的实例；并且不是StreetViewPanorama的实例
，未捕获类型错误：this.map\uux.getZoom不是函数
。您的代码中没有google.maps.Map，非常感谢您解决了上述问题。它正在工作
var map = new google.maps.Map(mapCanvas, mapOptions);

var markers = [];
// start of loop
for (var i = 0; i < records.length; i++) {

} // end of loop
var markerCluster = new MarkerClusterer(map, markers, {
  imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
});