mostrar puntos google maps api desde base de datos Tengo esta pagina asp, en donde busco y listo desde una base de datos ciertas direcciones con sus respectivas coordenadas x,y pero quisiera que al hacerle click en algún resultado este muestre un marcador en el mapa de google.
Código HTML:
<%@ Language=VBScript %> <html> <head> <title>PRUEBA FIN</title> <!-- mapainicio--> <style> #mapa{ width: 700px; height: 450px; float:left; background: white; } #infor{ width: 700px; height: 450px; float:left; } .auto-style1 { height: 26px; } .auto-style4 { width: 90px; } .auto-style5 { width: 98px; } .auto-style6 { width: 100px; } .auto-style7 { width: 103px; } </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js" ></script> <script> var marcadores_nuevos = []; function quitar_marcadores(lista) { for (i in lista) { lista[i].setMap(null); } } $(document).on("ready", function () { var formulario = $("#formulario"); var punto = new google.maps.LatLng(-12.0873389,-77.0257161); var config = { zoom: 10, center: punto, mapTypeId: google.maps.MapTypeId.ROADMAP }; var mapa = new google.maps.Map($("#mapa")[0], config); google.maps.event.addListener(mapa, "click", function (event) { var coordenadas = event.latLng.toString(); coordenadas = coordenadas.replace("(", ""); coordenadas = coordenadas.replace(")", ""); var lista = coordenadas.split(","); var direccion = new google.maps.LatLng(lista[0], lista[1]); var marcador = new google.maps.Marker({ position: direccion, map: mapa, animation: google.maps.Animation.DROP, draggable: true }); formulario.find("OUTPUT[NAME='LONGITUDE']").val(lista[0]); formulario.find("OUTPUT[NAME='LATITUDE']").val(lista[1]); marcadores_nuevos.push(marcador); google.maps.event.addListener(marcador, "click", function () { }); quitar_marcadores(marcadores_nuevos); marcador.setMap(mapa); }); }); </script> <!-- mapafin--> </head> <!--mapainicio--> <div id="mapa"> <h2> mapa</h2> </div> <div id="infor"> <!--mapafin--> <% If Not Request.QueryString("Message") = "True" Then %> <p> <FORM NAME="Buscar" METHOD="GET" ACTION="PruebaFin.asp"> <table> </tr><tr> <td class="auto-style1"><font face="arial">Nombre Via:</td><td class="auto-style1"><INPUT TYPE="TEXT" NAME="via" size="30"></td> </tr> <tr> <td class="auto-style1"><font face="arial">Distrito:</td><td class="auto-style1"><INPUT TYPE="TEXT" NAME="dis" size="30"></td> </tr> <tr> <td class="auto-style1"><font face="arial">Provincia:</td><td class="auto-style1"><INPUT TYPE="TEXT" NAME="pro" size="30"></td> </tr> </table> </p> <p> <INPUT TYPE="HIDDEN" NAME="Message" VALUE="True"> <INPUT TYPE="SUBMIT" VALUE="Buscar" style="height: 35px; width: 80px"> </FORM> </p> <!--<% Else dim strTB1, strCommand strTB1 = Server.HTMLEncode(Request.QueryString("tit")) strProvider = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=C:\Users\DISEÑO GRAFICO\Desktop\LIMABASE\VIALIMACOOR.mdb;" Set objConn = server.createobject("ADODB.Connection") objConn.Open strProvider strCommand = "select * FROM ViaLima where NOMBRE_VIA ='" & request.querystring("via")&"'" objConn.Execute strCommand Response.Write("Resultado") End If %>--> <BR><BR> <!-- tabla donde liste los marcadores agregados en BD --> <center> <TABLE BORDER="2"> <!--<TD class="auto-style4"><B>UBIGEO</B></TD>--> <TD class="auto-style5"><B>CATEG_VIA</B></TD> <TD class="auto-style6"><B>NOMBRE_VIA</B></TD> <TD class="auto-style6"><B>NOMBRE_ALT</B></TD> <TD class="auto-style7"><B>CUADRA</B></TD> <TD class="auto-style6"><B>URBANIZACI</B></TD> <TD class="auto-style7"><B>DISTRITO</B></TD> <TD class="auto-style6"><B>PROVINCIA</B></TD> <TD class="auto-style7"><B>DEPARTAMEN</B></TD> <!--<TD class="auto-style6"><B>PAIS</B></TD> --> <% Dim conexion, registros, basedatos, strTB12, strTB13, strTB14,strCommand1 strTB12 = Server.HTMLEncode(Request.QueryString("via")) strTB13 = Server.HTMLEncode(Request.QueryString("dis")) strTB14 = Server.HTMLEncode(Request.QueryString("pro")) basedatos = "C:\Users\DISEÑO GRAFICO\Desktop\LIMABASE\VIALIMACOOR.mdb" Set conexion = Server.CreateObject("ADODB.Connection") conexion.Open "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & basedatos & ";" Set registros = conexion.Execute("SELECT * FROM ViaLima where ((NOMBRE_VIA) LIKE '" & request.querystring("via")&"%') and ((DISTRITO) LIKE'" & request.querystring("dis")&"%') and PROVINCIA='" & request.querystring("pro")&"'" ) Do While Not registros.EOF %> <TR> <!--<TD class="auto-style4"><%= registros.Fields("UBIGEO").Value %></TD> --> <TD class="auto-style5"><%= registros.Fields("CATEG_VIA").Value %></TD> <TD class="auto-style6"><%= registros.Fields("NOMBRE_VIA").Value %></TD> <TD class="auto-style6"><%= registros.Fields("NOMBRE_ALT").Value %></TD> <TD class="auto-style7"><%= registros.Fields("CUADRA").Value %></TD> <TD class="auto-style4"><%= registros.Fields("URBANIZACI").Value %></TD> <TD class="auto-style5"><%= registros.Fields("DISTRITO").Value %></TD> <TD class="auto-style6"><%= registros.Fields("PROVINCIA").Value %></TD> <TD class="auto-style7"><%= registros.Fields("DEPARTAMEN").Value %></TD> <!--<TD class="auto-style6"><%= registros.Fields("PAIS").Value %></TD> --> </TR> <% registros.MoveNext Loop registros.Close Set registros = Nothing conexion.Close Set conexion = Nothing %> </TABLE> </center> <BR><BR><BR><BR> <!--<center> <a href="borrar.asp">Eliminar otro registro</a><br><br> <a href="index.html">Volver ala página de Inicio</a> </center>--> </font> <body> </body> </html>
