2012-02-17 4 views
1

Я действительно являюсь JS noob - я никогда не использовал его раньше, и я изо всех сил стараюсь использовать кластер-кластер google. Я Råd документациюс помощью API Google Maps - маркерный кластер

здесь код

<script src="http://localhost/wheredidmytweetgo/js/markercluster.js" type="text/javascript"></script> 
<script type="text/javascript"> 
//<![CDATA[ 
function load() { 
    if (GBrowserIsCompatible()) { 
    var map = new GMap2(
    document.getElementById("map")); 
    map.addControl(new GSmallMapControl()); 
    map.setCenter(
    new GLatLng(56.65622649350222, -19.86328125), 2); 
    var mc = new MarkerClusterer(map); 
    function createMarker(point, text, title) { 
     var marker = 
     new GMarker(point,{title:title}); 
     GEvent.addListener(
     marker, "click", function() { 
     marker.openInfoWindowHtml(text); 
     }); 
     return marker; 
    } 
    <?php 

    foreach ($cluster_location as $location) { 
    ?> 
    var marker = createMarker(
    new GLatLng(<?php echo $location ?>), 
    'Marker text <?php echo $location ?>', 
    'Example Title text <?php echo $location ?>'); 
    map.addMarker(marker); 
    <?php } 
    ?> 
    } 
} 

кластера место просто массив широты и долгот - Мой код работает отлично, если только с помощью add.overlay однако есть слишком много, чтобы сделать читаемая карта, следовательно, необходимость кластеризации. Я загружаю кластер JS, который я включил. Я создаю объект кластера и передаю его в соответствии с определением.

var markers = []; 
//create array 

Я знаю, что могу создать массив JS и передать, чтобы

var mc = new MarkerClusterer(map, markers); 

Но я просто не имею знания JS для создания массива в это время (я намерен учиться) и документация Google советует можно перебирать и добавьте в то время, используя addMarker

Привет Том - Thanksfor инфо - Я пытался делать то, что вы посоветовали и придумали ниже:

<script src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript" src="http://localhost/wheredidmytweetgo/js/markercluster.js"> 

    </script> 

    <script type="text/javascript"> 
     function initialize() { 
     var center = new google.maps.LatLng(37.4419, -122.1419); 

     var map = new google.maps.Map(document.getElementById('map'), { 
      'zoom': 13, 
      'center': center, 
      'mapTypeId': google.maps.MapTypeId.ROADMAP 
     }); 

     var markers = []; 
     <?php foreach ($cluster_location as $location) { ?>{ 
     var marker = new google.maps.Marker({'position': <?php echo $location;?>}); 
    markers.push(marker); 
} 
     <? 
     } 
     ?> 
     var markerCluster = new MarkerClusterer(map, markers); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <h3>A simple example of MarkerClusterer (100 markers)</h3> 
    <p> 
     <a href="?compiled">Compiled</a> | 
     <a href="?">Standard</a> version of the script. 
    </p> 
    <div id="map-container"><div id="map"></div></div> 
    </body> 
</html> 

Но моя карта все еще загружается пустым. Я использую буквально самый основной Google предоставленный код сейчас и просто загружаются мои собственные маркеры. Я знаю, что мой маркеры позиционирование должно быть в порядке, потому что, когда я иду, чтобы посмотреть мой исходный код страницы я вижу

{ 

      var marker = new google.maps.Marker({'position': 40.0994425,-74.9325683}); 

     markers.push(marker); 

      }); 

для каждого маркера , дополнительная помощь действительно будет оценена!

ответ

0

Пожалуйста, проверьте примеры на странице библиотеки утилиты google maps (link).

Но в основном, чтобы добавить экземпляр объекта (маркера) к массиву, вы должны сначала определить массив, чтобы вам нужно было сделать var markers = []; над циклом, в котором вы создаете маркеры. И тогда, когда вы создаете маркеры, вы должны добавить их в массив маркеров, вызвав метод массива push (пока вы на нем заходите в MDN и читаете о массивах! Если вы хотите узнать, что самое подходящее время для начала - есть учебник о JS там также (link).

так внутри петли foreach АВЭС вы определили маркер просто добавить его в массив markers.push(marker); Это позволит сделать маркеры доступны для MarkerCluster инициализации.

В более долгосрочной перспективе, когда вы выясните javascript немного лучше, вы, вероятно, захотите заменить эту часть либо передачей данных как объекта JSON в DOM, чтобы методы могли справиться с этим, либо даже лучше - чтобы данные для маркеров были получены с помощью ajax-запроса. Но один шаг за один раз, я думаю :)

Возможно, попробуйте забавные интерактивные обучающие программы на www.codecademy.com? Они довольно простые, но кажется, что это именно то, что вам нужно

EDIT:

var marker, 
    markers = []; 

<?php foreach ($cluster_location as $location) { ?> 
    marker = new google.maps.Marker({'position': <?php echo $location;?>}); 
    markers.push(marker); 
<? } ?> 
+0

привет TOM Я добавил больше информации выше. извините за беспокойство! –

+0

проверить редактирование в моем ответе - вы вывели фигурные скобки в HTML и вывели неверный код JS. Попробуйте, если это сработает и сообщит мне. Я также переместил объявление переменной маркера из цикла, чтобы оно объявлялось только один раз. –

Смежные вопросы