Hola, lectores de datanoia.com, desde hoy un amigo nuestro, Juan Caro (a.k.a. JoTa) empezará a apoyarnos en las publicaciones de éste blog. Hoy nos contará sobre Geolocalización, usando las APIs de Google Maps y las integrará con una aplicación web sencilla hecha en Visual Studio 2008 .NET, Lenguaje C#. Buscaremos convencerlo para que su aporte sea continuo y forme parte del blog. Desde aquí empieza su post:

Como ustedes saben Google tiene entre sus servicios gratuitos a Google Maps una poderosa aplicación que muestra imágenes de mapas satelitales de cualquier parte del mundo. Explicaremos como incrustar un mapa de Google Maps en una página web aspx.

Paso 1.- Comenzamos agregando un nuevo tab donde pondremos el .dll de GoogleMaps

Agregamos un nuevo tab

Paso 2.- Damos click derecho y seleccionamos “choose items” para agregar el dll de GoogleMaps, lo buscamos y lo agregamos.Vamos a gregar el dll de googlemaps a nuestro nuevo tab

Buscamos nuestro dll, lo seleccionamos ypresionamos en el boton "Open"

Se agregaron los controles de googlemaps a nuestro tab

Paso 3.- Para este primer ejemplo, vamos a usar el control GMap, lo arrastramos hasta nuestra pantalla…

Arrastramos el control "Gmap" hacia nuestra pantalla para nuestro ejemplo

Paso 4.- Corremos la aplicacion y vemos que nos muestra un error, esto ocurre porque no tenemos una “Key”.

Este error nos aparece, ya que no tenemos una key de googlemaps, lo que haremos ahora es obtener una key.

Ingresamos a esta web para obtener nuestra Key “http://code.google.com/intl/es/apis/maps/signup.html“, copiamos la dirección que esta en el cuadro rojo.

Paso 05.- Cuando estemos en la web mencionada, en la parte de abajo hay un recuadro para ingresar una url, ahi colocamos la dirección que copiamos y damos click en el botón “Generar clave de API”

En esta pagina obtendremos nuestra key, pero para ello, debemos tener una cuenta gmail, ya que ahi, nos enviara la key

Paso 06.- Nos aparece la página de gmail para loguearnos, lo hacemos y luego nos obtendremos la key que necesitamos.

Paso 7.- Ingresamos al webconfig de nuestra aplicación para colocar nuestra key (la obtenida en el paso anterior), debemos ponerla en el “appSettings” de esta forma:

<appSettings>
<add key="googlemaps.subgurim.net" value="ABQIAAAA89923VOr7Zlagkq6PzSl1hTFz8_PmpUdau86ETNxVP9oKgr3JRQiGtvIqP8-E_e3PvJF1lwKB0frew"/>
</appSettings>

En el webconfig dentro del appSettings colocaremos la key que nos han enviado.

Paso 8.- Corremos nuestra aplicación y nos mostrará la región de España por defecto

Nos muestra en el control gmap la region de Espana

Paso 9.- Como yo me ubico en estos momentos en Lima, deseo que aparezca dicha provincia por defecto. Por tal motivo debemos crear un método que lo llamaremos “MostrarLima” y lo pondremos en el Load() de nuestra página. No olvidar agregar “using Subgurim.Controles” para poder usar los métodos de googlemaps. Tal como muestra la siguiente imagen:

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using Subgurim.Controles;

namespace SolicionGoogleMaps
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
MostrarLima();
}
}

public void MostrarLima()
{
GMapPrueba.Height = 600;
GMapPrueba.Width = 400;
GMapPrueba.setCenter(new GLatLng(-12.0876672627387, -77.0416259765625), 12);
GMapPrueba.enableHookMouseWheelToZoom = true;
GMapPrueba.enableGKeyboardHandler = true;
}
}
}

Espero sirva de ayuda este ejemplo. Buen Día.

Enlaces de Interés:

Dll Google Maps | Solucion del Proyecto en C#

→ Entradas Relacionadas:

1. GoogleMaps con Visual Studio 2008 (C#) – Parte 02
2. Visual Studio 2010 – Callback – Jquery
3. Visual Studio 2010 – Validación JQuery vía Callback
4. Tutorial: Como implementar jQuery en VisualStudio 2008 (C#)
5. Consumir Servicio Web desde Netbeans