кластер гугл карта - PullRequest
Новая
       10

кластер гугл карта

0 голосов
/ 16 сентября 2011

Я знаю markerClusterer, способный обрабатывать большие суммы маркеров на карте Google.Ссылаясь на этот пример кода, как показано ниже 

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

    <script type="text/javascript" src="../src/data.json"></script>
    <script type="text/javascript">
      var script = '<script type="text/javascript" src="../src/markerclusterer';
      if (document.location.search.indexOf('compiled') !== -1) {
        script += '_compiled';
      }
      script += '.js"><' + '/script>';
      document.write(script);
    </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: 3,
          center: center,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        var markers = [];
        for (var i = 0; i < 100; i++) {
          var dataPhoto = data.photos[i];
          var latLng = new google.maps.LatLng(dataPhoto.latitude,
              dataPhoto.longitude);
          var marker = new google.maps.Marker({
            position: latLng
          });
          markers.push(marker);
        }
        var markerCluster = new MarkerClusterer(map, markers);
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>

Первый вопрос, почему этот пример информационного окна не может работать?

Второй, если у меня есть такой массив, как этот: 

[-6.358851,106.889359] => Array
        (
            [0] => stdClass Object
                (
                    [name] => C
                )

        )

    [-6.154060,106.854080] => Array
        (
            [0] => stdClass Object
                (                        
                    [name] => A
                )

            [1] => stdClass Object
                (
                    [name] => B
                )

        )

Могу ли я сделать так, чтобы те имели одинаковые значения широты и долготы, складывать информацию в одном информационном окне?Я знаю, что это может быть.Мне просто интересно, как это сделать.А как работает формат данных json для получения правильного вывода на карту?

Надеюсь, кто-нибудь здесь может мне помочь.Заранее спасибо.

1 Ответ

0 голосов
/ 16 сентября 2011

Первый вопрос; какое информационное окно? В вашем коде нет информационного окна. Что вам нужно сделать, так это внутри вашего цикла, создать переменную информационного окна для каждого маркера, установить его содержимое и создать прослушиватель событий для этого маркера. 

<script type="text/javascript">
    var map;

    function initialize() {
        var homeLatlng = new google.maps.LatLng(51.476706,0); // London
        var homeLat = 51.476706;
        var homeLng = 0;

        var myOptions = {
            zoom: 5,
            center: homeLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        for (var i = 0; i < 100; i++) {
            var latLng = new google.maps.LatLng(homeLat, homeLng+i);
            var marker = new google.maps.Marker({
                position: latLng,
                map: map
            });

            setContent(marker, i);
        }
    }

    function setContent(marker, i) {
        var infowindow =  new google.maps.InfoWindow({
            content: 'clicked marker ' + (i+1)
        });

        google.maps.event.addListener(marker, 'click', function(event) {
           infowindow.open(map, marker);
        });
    }


    google.maps.event.addDomListener(window, 'load', initialize);
</script>
...