將城市/州從SQL Server加載到Google地圖？

我試圖做一個小型應用程序，需要一個城市&狀態和地址解析到經緯度位置。現在我正在使用Google Map的API，ColdFusion和SQL Server。基本上，城市和州的字段都放在數據庫表中，我想要將這些位置放在Google地圖上，並將其放在Google地圖上，以顯示它們的位置。將城市/州從SQL Server加載到Google地圖？

這是我的代碼來做地理編碼，並查看頁面的源代碼顯示它正確循環我的查詢，並在地址字段中放置一個位置（「奧馬哈，NE」），但沒有標記，或地圖對於這個問題，是顯示在頁面上：

function codeAddress() { 
<cfloop query="GetLocations"> 
    var address = document.getElementById(<cfoutput>#Trim(hometown)#,#Trim(state)#</cfoutput>).value; 
     if (geocoder) { 
     geocoder.geocode({<cfoutput>#Trim(hometown)#,#Trim(state)#</cfoutput>: address}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      var marker = new google.maps.Marker({ 
      map: map, 
      position: results[0].geometry.location, 
      title: <cfoutput>#Trim(hometown)#,#Trim(state)#</cfoutput> 
      }); 
     } else { 
      alert("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
     }  
</cfloop> }

，這裏是代碼初始化地圖：

var geocoder; 
var map; 

function initialize() { 
    geocoder = new google.maps.Geocoder(); 
    var latlng = new google.maps.LatLng(42.4167,-90.4290); 
    var myOptions = { 
     zoom: 5, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      title: "Test" 
     }); 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
}

我有一個使用緯度/長，這是很難的地圖工作編碼到數據庫表中，但我希望能夠使用城市/州並將其轉換拉長/長。任何建議或指示？在數據庫中存儲經緯度也是可能的，但我不知道如何在SQL中做到這一點。

來源

2010-05-24 knawlejj

您可能要合作nsider下面的例子：

使用V2 API：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps API Geocoding Demo</title> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false" 
      type="text/javascript"></script> 
</head> 
<body onunload="GUnload()"> 

    <div id="map_canvas" style="width: 400px; height: 300px"></div> 

    <script type="text/javascript"> 

    // Prepare this list from ColdFusion 
    var locations = [ 
     'New York, NY', 
     'Los Angeles, CA', 
     'Chicago, IL', 
     'Houston, TX', 
     'Phoenix, AZ' 
    ]; 

    if (GBrowserIsCompatible()) { 
     var map = new GMap2(document.getElementById("map_canvas")); 

     var geocoder = new GClientGeocoder(); 
     var index = 0; 

     var geocoderFunction = function() { 
      geocoder.getLatLng(locations[index], function (point) {  
      if (point) { 
       map.addOverlay(new GMarker(point));     
      } 

      // Call the geocoder with a 100ms delay 
      index++; 
      if (locations.length > index) { 
       setTimeout(geocoderFunction, 100); 
      } 
      }); 
     } 

     map.setCenter(new GLatLng(38.00, -100.00), 3); 

     // Launch the geocoding process 
     geocoderFunction(); 
    } 
    </script> 
</body> 
</html>

使用V3 API：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps API Geocoding Demo</title> 
    <script src="http://maps.google.com/maps/api/js?sensor=false" 
      type="text/javascript"></script> 
</head> 
<body> 

    <div id="map_canvas" style="width: 400px; height: 300px"></div> 

    <script type="text/javascript"> 

    // Prepare this list from ColdFusion 
    var locations = [ 
     'New York, NY', 
     'Los Angeles, CA', 
     'Chicago, IL', 
     'Houston, TX', 
     'Phoenix, AZ' 
    ]; 

    var mapOpt = { 
     mapTypeId: google.maps.MapTypeId.TERRAIN, 
     center: new google.maps.LatLng(38.00, -100.00), 
     zoom: 3 
    }; 

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

    var geocoder = new google.maps.Geocoder(); 
    var index = 0; 

    var geocoderFunction = function() { 
     geocoder.geocode({ 'address': locations[index] }, function (results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
      new google.maps.Marker({ 
       map: map, 
       position: results[0].geometry.location 
      });    
      } 

      // Call the geocoder with a 100ms delay 
      index++; 
      if (locations.length > index) { 
      setTimeout(geocoderFunction, 100); 
      } 
     }); 
    } 

    // Launch the geocoding process 
    geocoderFunction(); 
    </script> 
</body> 
</html>

所有你需要做的是從ColdFusion的渲染JavaScript數組locations，而不是使用在該示例中硬編碼一個。從上面的例子

截圖：

Google Maps API Geocoding Demo

來源

2010-05-25 00:25:05

非常感謝丹尼爾，我照你說的和將我查詢到的位置變化並輸出一個數組裏面。像魅力一樣工作！ – knawlejj 2010-05-25 03:07:42

@ knawlejj：這是個好消息。我很高興它的工作:) – 2010-05-25 03:09:42

您需要使用addOverlay方法標記實際添加到地圖：

var point = new GLatLng(...); 
map.addOverlay(new GMarker(point));

您也可以將標記該類的實例添加到您的地圖：

map.addOverlay(marker);

查看地圖疊加層文檔：

http://code.google.com/apis/maps/documentation/javascript/v2/overlays.html

來源

2010-05-25 00:09:46

將城市/州從SQL Server加載到Google地圖？

回答

相關問題