GoogleMaps con AJAX y PHP

1,486 views
1,359 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,486
On SlideShare
0
From Embeds
0
Number of Embeds
20
Actions
Shares
0
Downloads
26
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

GoogleMaps con AJAX y PHP

  1. 1. Partes componentes de la API de GoogleMaps con AJAX y PHP M. en G. Enrique Muñoz Goncen Iniciativa SubGeo
  2. 2. Sostiene el XHTML de la página Se encarga de la funcionalidad del JavaScript (del lado del servidor) es usado para almacenar la información marcada en formato XML Crea un arreglo JavaScript y objetos que representan cada localización en el mapa Código usado para dar formato y recuperar los datos del archivo data.xml <ul><li>La función storeMarker() envía la información marcada hacia el servidor vía AJAX. Recupera la información desde el DOM y la envía al código storeMarker.php, usando el objeto GXmlHttp </li></ul>Index.php Map_functions.js map_data.php storeMarker.php retrieveMarker.php
  3. 3. <ul><li>5 Widgets de control: </li></ul><ul><li>GLargeMapControl </li></ul><ul><li>GSmallMapControl </li></ul><ul><li>GScaleControl </li></ul><ul><li>GSmallZoomControl </li></ul><ul><li>GMapTypeControl </li></ul>
  4. 4. <ul><li>Objetos: </li></ul><ul><li>GLatLng </li></ul><ul><li>Gicon </li></ul><ul><li>Gmarker </li></ul><ul><li>GMap2 </li></ul><ul><li>Objetos de AJAX: </li></ul><ul><li>GXmlHttp </li></ul><ul><li>XmlHttpRequest </li></ul>
  5. 5. <ul><li>Clases: </li></ul><ul><li>GOverlay </li></ul>
  6. 6. <ul><li>Métodos: </li></ul><ul><li>Gevent.addListener() </li></ul><ul><li>(reacciona ante los clicks del ususario) </li></ul><ul><li>Gevent.addListener(map,”click”, function (overlay,latlng) </li></ul><ul><li>GMap2openInfoWindow() </li></ul><ul><li>(Crea una ventana de información directamente en el mapa) </li></ul><ul><li>map.openInfoWindow(latlng,document.createTextNode(you clicked here) </li></ul><ul><li>Gmarker.openInfoWindow() </li></ul><ul><li>(crea una ventana de información en una marca, no en el mapa) </li></ul><ul><li>GMap2.showMapBlowup() </li></ul><ul><li>GMarker.showMapBlowup() </li></ul><ul><li>Map.showMapBlowup(New GLatLng(37.4,-122),3, terreno) </li></ul>Qué objeto mirar Qué evento escuchar Qué función ejecutar
  7. 7. <ul><li>Métodos: </li></ul><ul><li>document.getElementById() </li></ul><ul><li>(ingresa datos y recupera los valores del DOM (forma); y concatena cada uno de los valores en el GET del objeto GXmlHttp) </li></ul><ul><li>onreadystatechange() </li></ul><ul><li>(procesa la petición del usuario cuando esta completa) </li></ul>

×