Google지도에 MarkerCluster 추가, 표시되지 않음

Question

마커가있는 기존 Google지도에 MarkerCluster 기능을 추가하려고합니다. API 지침을 사용하여 가장 간단한 예제를 추가하려고 시도했습니다. 불행하게도지도가 사라집니다.

markerClsuter 변수를 잘못된 위치에 배치한다고 가정합니다. 그러나 확신 할 수 없습니다. 내 JavaScript가 좋지 않아 약간 혼란 스럽다.

오래 전부터 코드에 대한 사과를 전했지만 가능한 한 많은 내용을 제공하고자했습니다.

감사합니다. 당신이 그것을 제공하지 않았다으로 "simple" example using MarkerClusterer 복사 작업

function mainGeo() 
{ 
    if (navigator.geolocation) 
     { 
      navigator.geolocation.getCurrentPosition(mainMap, error, {maximumAge: 30000, timeout: 10000, enableHighAccuracy: true}); 
    } 
    else 
    { 
      alert("Sorry, but it looks like your browser does not support geolocation."); 
    } 
} 


var stories = {{story_Json|safe}}; 
var geocoder; 
var map; 

var markers = []; 

function loadMarkers(stories){ 
    for (i=0;i<stories.length;i++) { 
     var story = stories[i]; 

     (function(story) { 
      var pinColor = "69f2ff"; 
       var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor, 
        new google.maps.Size(21, 34), 
        new google.maps.Point(0,0), 
        new google.maps.Point(10, 34)); 
      var point = new google.maps.LatLng(story.latitude, story.longitude); 
      var marker = new google.maps.Marker({position: point, map: map, icon: pinImage}); 
      var infowindow = new google.maps.InfoWindow({ 
      content: '<div >'+ 
       '<div >'+ 
       '</div>'+ 
       '<h2 class="firstHeading">'+story.headline+'</h2>'+ 
       '<div>'+ 
       '<p>'+story.author+'</p>'+ 
       '<p>'+story.copy+'</p>'+ 

       '</div>'+ 
       '</div>' 

      }); 
      google.maps.event.addListener(marker, 'click', function() { 
      infowindow.open(map,this); 
      }); 
     })(story); 
    } 
var markerCluster = new MarkerClusterer(map, markers); 
} 



function mainMap(position) 
{ 
     geocoder = new google.maps.Geocoder(); 
     // Define the coordinates as a Google Maps LatLng Object 
     var coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 

     // Prepare the map options 
     var mapOptions = 
     { 
        zoom: 15, 
        center: coords, 
        mapTypeControl: false, 
        navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     // Create the map, and place it in the map_canvas div 
     map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

     // Place the initial marker 
     var marker = new google.maps.Marker({ 
        position: coords, 
        map: map, 
        title: "Your current location!" 
     }); 

     loadMarkers(stories); 

    } 


    function codeAddress() { 
    var address = document.getElementById("address").value; 
    geocoder.geocode({ 'address': address}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     map.setCenter(results[0].geometry.location); 
     var marker = new google.maps.Marker({ 
      map: map, 
      position: results[0].geometry.location 
     }); 
     } else { 
     alert("Geocode was not successful for the following reason: " + status); 
     } 
    }); 
    } 

Answer 1

는 분명히 데이터를 포함하지 않습니다.

Answer 2

지도가 사라지면 구문 오류로 인해 어딘가에있을 가능성이 큽니다. 아마도 쉼표 나 세미 콜론을 놓친 것일 수도 있습니다. 마커를 편집 할 때 마커 코드가 정확하지 않은 경우 일반적으로지도가로드되고 마커는로드되지 않습니다.

마커에 새 코드를 추가하면 마커 클러스터와 마커 관리자도 핵심 변수를 변경해야합니다.

예를 들어, 레이블이있는 마커가있는 새 기능을 만들기로 결정했을 때 마커 관리자에 새 기능을 추가하지 않으면 마커 관리자가 저를 위해 작동하지 않게되었습니다.