2014-02-14 2 views
1

http://jsfiddle.net/9hYv4/1Google карты Кнопки управления

Я пытаюсь контролировать ярлыки моей карты - и выключаться, что есть.

Я не могу заставить его работать. См. Выше для скрипки.

Я определил свои кнопки для вызова функции, а также функцию либо показать метки, либо нет.

вот часть кода: JAVASCRIPT:

// Removes the markers from the map, but keeps them in the array. 
function clearMarkers() { 
    setAllMap(null); 
} 

// Shows any markers currently in the array. 
function showMarkers() { 
    setAllMap(map); 
} 

HTML:

<div id="panel"> 
    <input onclick="clearMarkers();" checked="checked" type="checkbox" value="Hide Markers"><label>Hide Markers</label> 
    <input onclick="showMarkers();" type="button" value="Show All Markers"> 
</div> 

EDIT

Пожалуйста, смотрите здесь: http://jsfiddle.net/9hYv4/10/

Я не знаю, о чем я думал. Для меня это флажок, который переключает иконки hide/show. Поэтому при проверке отображаются значки, когда они не отмечены, значки скрыты.

Код в скрипке и jsbin работает достаточно хорошо, однако, как видно из моей купленной скрипки, группировка значков (markerCluster) больше не работает.

нажмите на скрипку и уменьшите изображение, чтобы увидеть. Эти значки должны быть сгруппированы.

Надеюсь, это ясно?

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

И просто подведем итог: после переключения значков скрыть/показать с помощью кнопки флажка. И восстановить функции кластера.

СПАСИБО ВАМ ТАК :)

ответ

2

У вас есть какая-то ошибка в коде. Один из них связан с переменными, которые не видны и должны быть установлены как глобальные:

var map, 
    markers = []; 

Следующий связан с флажком. Отображение/скрытие последовательности связано с комбинацией состояний флажка и кнопки (иногда флажок не отмечен, а маркеры скрыты). Лучше реагировать на значение флажка. Смотрите новую функцию handleMarkers:

function handleMarkers() { 
    if (cBox.checked) { 
     clearMarkers(); 
    } else { 
     showMarkers(); 
    } 
} 

<input onclick="handleMarkers();" id='cBox' checked="checked" type="checkbox" value="Hide Markers"><label>Hide Markers</label> 

И маркеры показывают снова изменения масштаба. Он связан с MarkerClusteres. Новый приемник событий должен быть добавлен:

map.fitBounds(bounds); 

google.maps.event.addListener(map, 'zoom_changed', function() { 
    console.log('zoom changed!'); 
    if (cBox.checked) { 
     markerCluster.clearMarkers(); 
    } else { 
     markerCluster = new MarkerClusterer(map, markers, clusterOptions); 
    } 
}) 

example at jsbin Смотрите обновленный: изменил clearMarkers() и showMarkers() функции для обработки маркеров кластеров.

Обновление: Этот version at jsBin не создает новые объекты кластера кластера, а просто очищает/добавляет маркеры из/в существующий. Должен быть лучший вариант.

Увеличить обработчик изменения событий: восстановление маркеров только если markerCluster пуст:

google.maps.event.addListener(map, 'zoom_changed', function() { 
    console.log('zoom changed!'); 
    if (cBox.checked) { 
     markerCluster.clearMarkers(); 
    } else { 
     var totArray = markerCluster.getTotalMarkers(); 
     if (totArray == 0) { 
      markerCluster.addMarkers(markers); 
     } 
     //markerCluster = new MarkerClusterer(map, markers, clusterOptions); 
    } 
}) 
+0

Я согласен последовательность показать/скрыть это лучше. Однако теперь с markcluseters они больше не появляются http://jsfiddle.net/9hYv4/6/ – Scientized

+0

Код jsfiddle отличается от моего примера в jsbin –

+0

Я бы избавился от кнопки, потому что это сбивает с толку «Скрыть маркеры и маркеры показываются после нажатия кнопки. –

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