2012-03-10 157 views
1

處理.cgi文件中的一些perl代碼,該代碼循環遍歷IP地址的散列列表,然後通過Web服務運行每個IP地址,該服務返回IP地址的經度和緯度,那麼它需要將每個IP地址顯示爲谷歌地圖上的標記。截至目前,我已經通過哈希列表並打印每個IP地址的座標。我無法弄清楚的是如何在谷歌地圖上顯示多個地圖標記。我目前只是通過將值硬編碼到$ latitude和$ longitude變量來測試它。我想在javascript中需要有某種循環,它會遍歷並分配每個座標,但我不知道如何處理該座標。在Google Maps API中顯示多個地圖標記

更新:我已經添加了第一個答案的代碼,併成功地將列表打印在循環之外。我現在遇到的問題是Google地圖不會再加載。我已經將問題縮小到了緯度和經度變量賦予其價值的JavaScript。

unless ($result->fault) { 

# Print out the results one by one 
my $latitude = "LATITUDE = " . $result->valueof('//LATITUDE') . "\n"; 
my $longitude = "LONGITUDE = " . $result->valueof('//LONGITUDE') . "\n"; 

#print "MESSAGE = " . $result->valueof('//MESSAGE') . "\n"; 


$lats .= $latitude . ','; 
$lons .= $longitude . ','; 


} else { 

print "IP2Location Web Service Failed!\n"; 
print join ', ', 
$result->faultcode, 
$result->faultstring, 
$result->faultdetail; 

} 
} 

chop $lats; 
chop $lons; 

#printing here to test if the variable is making it out of the loop 
print $lats ; 
print $lons ; 

print <<ENDHTML; 
<html> 
    <head> 
<title>IP Lookup Map</title> 
<meta name="viewport" 
    content="width=device-width, initial-scale=1.0, user-scalable=no"> 
<meta charset="UTF-8"> 
<style type="text/css"> 
    html, body, #map_canvas { 
    margin: 0; 
    padding: 0; 
    height: 90%; 
    width: 90%; 
    } 
</style> 
<script type="text/javascript" 
    src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
//If I comment out the following variables the map will load, not sure what the problem is 
    var latitudes = "$lats".split(","); 
    var longitudes = "$lons".split(","); 

    var map; 
    function initialize() { 
    var myOptions = { 
     zoom: 7, 
     center: new google.maps.LatLng(44, -90), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById('map_canvas'), 
     myOptions); 

    // Creating a marker and positioning it on the map 
    for(var i = 0; i < latitudes.length; i++){ 
     var latitude = latitudes[i]; 
     var longitude = longitudes[i]; 
    // Creating a marker and positioning it on the map 
     var marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(latitude,longitude), 
     map: map 
    }); 
    } 
    } 

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

回答

2

顯然你需要保存所有的緯度和經度,而不是僅僅打印它們。我會用2個全局,除非你($結果)外{

my $lats = ''; 
my $lons = ''; 
.... 
$lats .= $latitude . ','; 
$lons .= $longitude . ','; 

(您可能需要印章($拉特);在循環後斬($ LONS)刪除最後一個逗號),然後在您的javascript部分:

// create two arrays from that lats and lons string using split() 
var latitudes = "$lats".split(','); 
var longitudes = "$lons".split(','); 
..... 
// create map code 
.... 
for(var i = 0; i < latitudes.lenght; i++){ 
    var latitude = latitudes[i]; 
    var longitude = longitudes[i]; 
    // Creating a marker and positioning it on the map 
    var marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(latitude,longitude), 
     map: map 
    }); 
} 
0

修復它,讓所有的東西都能正常工作。問題在於,$ latitude和$ longitude變量仍然被分配了一堆額外的文本,這些文本是不需要的。現在只分配了這個值。

my $latitude = $result->valueof('//LATITUDE'); 
my $longitude = $result->valueof('//LONGITUDE'); 
相關問題