Cargando ciudad/estado de SQL Server a Google Maps?

Estoy tratando de hacer una pequeña aplicación que tome una ciudad & estado y códigos geográficos que se dirijan a una ubicación lat/long. En este momento estoy utilizando Google Map's API, ColdFusion y SQL Server. Básicamente, los campos de ciudad y estado están en una tabla de base de datos y quiero tomar esos lugares y colocar un marcador en un mapa de Google que muestre dónde se encuentran.Cargando ciudad/estado de SQL Server a Google Maps?

Este es mi código para hacer la geocodificación, y ver el origen de la página muestra que está pasando por mi consulta y colocando una ubicación ("Omaha, NE") en el campo de dirección, pero sin marcador, o mapa para el caso, está apareciendo en la página:

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

Y aquí está el código para inicializar el mapa:

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

tengo un trabajo mapa que utiliza latitud/longitud que era difícil codificado en la tabla de la base de datos, pero quiero poder usar la ciudad/estado y convertir eso a lat/long. ¿Alguna sugerencia o dirección? También es posible almacenar lat/long en la base de datos, pero no sé cómo hacerlo en SQL.

Fuente

2010-05-24 knawlejj

Es posible que desee para co nsiderar el siguiente ejemplo:

Utilizando el 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>

Utilizando el 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>

Todo lo que necesita hacer es hacer que la matriz de JavaScript locations de ColdFusion, en lugar de utilizar el codificado en el ejemplo.

Captura de pantalla del ejemplo anterior:

Google Maps API Geocoding Demo

Fuente

2010-05-25 00:25:05

Muchas gracias Daniel, hice lo que usted ha dicho y convertido mi consulta a un array dentro de las ubicaciones variables y salida de la misma. ¡Trabajado como un encanto! – knawlejj

@knawlejj: Son buenas noticias. Me alegro de que funcionó :) –

Es necesario añadir en realidad el marcador al mapa con el método addOverlay:

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

También puede agregar instancias de la clase del marcador a su mapa:

map.addOverlay(marker);

Ver las superposiciones Mapa docs:

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

Fuente

2010-05-25 00:09:46

Cargando ciudad/estado de SQL Server a Google Maps?

Respuesta

Cuestiones relacionadas