谷歌地圖v3聽衆（點擊） - 更改網址

我有一個帶有標記羣和各種點的Google地圖。使用事件偵聽器生成如下所示的點，它將在頁面加載時爲每個點生成點。谷歌地圖v3聽衆（點擊） - 更改網址

function mappyfuntime() { 
    var mapOptions = { 
     center: new google.maps.LatLng(51.481581,-3.17909), 
     zoom: 4, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("bigmap"), mapOptions); 
    <?php echo prepare_javascript(); ?> 
    var markers = []; 
    var marker = []; 
    linkto = new Array(); 
    for(g=0; g<LocationsArray.length; g++) { 
     var latlng = new google.maps.LatLng(LocationsArray[g][0], LocationsArray[g][1]); 
     marker[g] = new google.maps.Marker({'position': latlng}); 
     markers.push(marker[g]); 
     google.maps.event.addListener(marker[g], 'click', click_handler(PermalinksArray[g])); 
    } 
    var markerCluster = new MarkerClusterer(map, markers); 
} 

mappyfuntime(); 
function click_handler(link) { 
    alert(link); 
}

但是，如果我將google.maps.event.addListener更改爲以下內容，則警報將返回undefined。

google.maps.event.addListener(marker[g], 'click', function() { 
    alert(PermalinksArray[g]); 
});

如果我將PermalinksArray [g]傳遞給該函數，則會發生同樣的情況。當在地圖上點擊相應的點時，是否有任何方法可以從數組中獲取一條信息（全局定義）？

來源

2012-08-28 George Pearce

我猜連接數組來自php插入？那麼它不在全球範圍內。嘗試把你的javascript腳本的頂部插入php-insert。

// set globals 
var map; 
var markers = []; 
var PermalinksArray = ['...']; 
var LocationsArray = ['...']; 

function mappyfuntime() { 

    // init map 
    var mapOptions = { 
     center: new google.maps.LatLng(51.481581,-3.17909), 
     zoom: 4, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById("bigmap"), mapOptions); 

    // create markers   
    for(g=0; g<LocationsArray.length; g++) { 

     // create new Position 
     var latlng = new google.maps.LatLng(LocationsArray[g][0], LocationsArray[g][1]); 
     // create new marker with position 
     var marker = new google.maps.Marker({'position': latlng}); 
     // add event to marker 
     google.maps.event.addListener(marker, 'click', function() { 
      click_handler(marker, PermalinksArray[g]); 
     }); 
     // push marker into markers array 
     markers.push(marker); 
    } 
    var markerCluster = new MarkerClusterer(map, markers); 
} 

function click_handler(marker, link) { 
    alert(link); 
} 

mappyfuntime();

來源

2012-08-28 15:13:29 nooitaf

是否這樣做，但PermalinksArray和g仍然會在函數中返回爲undefined。使用：\t \t google.maps.event.addListener（標記並[g]， '點擊'，功能（PermalinksArray，克）{ \t \t \t警報（PermalinksArray [G]）; \t \t}）; 仍彈出「未定義」提醒。如果您想查看，代碼位於http://fused.org.uk/mappy。 –

範圍不應該順便說一句。你有標記和標記扭曲。你正在使用標記[g]並將標記推入標記。如果那有意義的話。您應該創建一個標記並將其推入標記數組中。 – nooitaf

我創建了一個帶有2個標記的Google Map，當點擊一個標記時，該區域的名稱出現在信息窗口中。標記中的信息通過名爲cityList的全局定義數組加載。你可以在下面找到我的代碼。

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>jQuery mobile with Google maps - Google maps jQuery plugin</title> 
     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
     <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
     <script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3&sensor=false&language=en"> </script> 
     <script type="text/javascript"> 

      var cityList = [ 
       ['Chicago', 41.850033, -87.6500523, 1], 
       ['Illinois', 40.797177,-89.406738, 2] 
      ], 
      demoCenter = new google.maps.LatLng(41,-87), 
      map; 

      function initialize() 
      { 
       map = new google.maps.Map(document.getElementById('map_canvas'), { 
        zoom: 7, 
        center: demoCenter, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
       }); 
      } 

      function addMarkers() 
      { 
       var marker, i; 
       var infowindow = new google.maps.InfoWindow(); 
       for (i = 0; i < cityList.length; i++) 
       { 
        marker = new google.maps.Marker({ 
         position: new google.maps.LatLng(cityList[i][1], cityList[i][2]), 
         map: map, 
         title: cityList[i][0] 
        }); 

        google.maps.event.addListener(marker, 'click', (function(marker, i) { 
         return function() { 
          infowindow.setContent(cityList[i][0]); 
          infowindow.open(map, marker); 
         } 
        })(marker, i)); 
       } 
      } 

      $(document).on("pageinit", "#basic-map", function() { 
       initialize(); 
      }); 

      $(document).on('click', '.add-markers', function(e) { 
       e.preventDefault(); 
       addMarkers(); 
      }); 

     </script> 
    </head> 
    <body> 
     <div id="basic-map" data-role="page"> 
      <div data-role="header"> 
       <h1><a data-ajax="false" href="/">jQuery mobile with Google maps v3</a> examples</h1> 
       <a data-rel="back">Back</a> 
      </div> 
      <div data-role="content"> 
       <div class="ui-bar-c ui-corner-all ui-shadow" style="padding:1em;"> 
        <div id="map_canvas" style="height:350px;"></div> 
       </div> 
       <a href="#" class="add-markers" data-role="button" data-theme="b">Add Some More Markers</a> 
      </div> 
     </div>  
    </body> 
</html>

我希望這有助於。

來源

2012-08-28 17:04:39

谷歌地圖v3聽衆（點擊） - 更改網址

回答

相關問題