0

私はmarkerClustererがグーグルマップ上の大量のマーカーを処理できることを知っています。このサンプルコードを以下に示すように参照することにより

<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
                )

        )

それらが同じlatとlonを持っているように、1つの情報ウィンドウ内に情報をスタックすることはできますか？私はそれが可能性があることを知っています。私はそれをどうやってやるのかと思っています。そして、jsonデータフォーマットはどのようにしてマップ上で正しい出力を取得しますか？

ここの誰かが私を助けてくれることを願っています。前もって感謝します。

4

1 に答える 1

0

最初の質問; どの情報ウィンドウ？コードには情報ウィンドウがありません。ループ内で、マーカーごとにinfowindow変数を作成し、そのコンテンツを設定して、そのマーカーのイベントリスナーを作成する必要があります。

<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>
于 2011-09-16T14:33:07.320 に答える