+ Diseño de Aplicaciones Web +: * Manejo de XML, Google Maps(Marcadores) *

Código del servlet (proccesRequest):



    protected void processRequest(HttpServletRequest request, HttpServletResponse response)


    throws ServletException, IOException {


        response.setContentType("text/xml;charset=UTF-8");


        PrintWriter out = response.getWriter();





        ArrayList<Universidad> lista = new ArrayList();


        Universidad u = new Universidad();





        lista = u.allUniversities();





        String xml="<?xml version=\"1.0\" encoding=\"ISO-8859-1\"?>";





        int i;





        try {


            //TODO output your page here





            xml=xml + "<universidades>";


            for(i=0;i<lista.size();i++){


              xml=xml +"<universidad>";


              xml=xml +"<nombre>"+lista.get(i).getNombre()+"</nombre>";


              xml=xml +"<latitud>"+lista.get(i).getLatitud()+"</latitud>";


              xml=xml +"<longitud>"+lista.get(i).getLongitud()+"</longitud>";


              xml=xml +"<imagen>"+lista.get(i).getImagen()+"</imagen>";


              xml=xml +"</universidad>";


            }


            xml=xml +"</universidades>";





            out.write(xml);





            /*for(ind=0;ind<lista.size();ind++){


                out.println("<p>"+lista.get(ind).getNombre()+ "-"+ lista.get(ind).getPais() +"</p>");


            }*/


            


        } finally { 


            out.close();


        }


    }

CreateMarket (Funcion para crear marcadores):



  function createMarker(point, nombre,imagen) {


        var marker = new GMarker(point);


        GEvent.addListener(marker, 'click', function() {


            var myHtml = "<b>"+nombre+"</b><br/><a href='"+imagen+"'><img style='width:100px;height:100px' src='"+imagen+"'.jpg"+"'/></a>";


            marker.openInfoWindowHtml(myHtml);


        });


        return marker;


    }

initialize (Funcion con parametros iniciales para el mapa):



 function initialize() {


        map = new GMap2(document.getElementById("map"));





        map.setCenter(new GLatLng(-2.14996,-79.957687), 12);


        map.addControl(new GSmallMapControl());


        map.addControl(new GMapTypeControl());





        //ESPOL


        var point = new GPoint (-79.957687,-2.14996);


        var nombre = "ESPOL - Campus Gustavo Galindo";


        var imagen = "http://blog.espol.edu.ec/iaorella/files/2010/07/espol1-300x299.png"


        var marker = createMarker (point, nombre,imagen);


        var myHtml = "<b>"+nombre+"</b><br/><a href='"+imagen+"'><img style='width:100px;height:100px' src='"+imagen+"'.jpg"+"'/></a>";


        map.addOverlay(marker);


        map.openInfoWindowHtml(map.getCenter(),myHtml);





    }

Mostrar (Genera y muestra los marcadores):



    function  mostrar(){





        if (request.readyState == 4)  {





            if (request.status == 200)  {





                var xml= request.responseXML.getElementsByTagName("universidades");





                var i;


                map = new GMap2(document.getElementById("map"));





                map.setCenter(new GLatLng(-2.14996,-79.957687), 2);


                map.addControl(new GSmallMapControl());


                map.addControl(new GMapTypeControl());








                //ESPOL


                var point = new GPoint (-79.957687,-2.14996);


                var nombre = "ESPOL - Campus Gustavo Galindo";


                var imagen = "http://blog.espol.edu.ec/iaorella/files/2010/07/espol1-300x299.png"


                var marker = createMarker (point, nombre,imagen);


                var myHtml = "<b>"+nombre+"</b><br/><a href='"+imagen+"'><img style='width:100px;height:100px' src='"+imagen+"'.jpg"+"'/></a>";


                map.addOverlay(marker);


                map.openInfoWindowHtml(map.getCenter(),myHtml);








                var universidad=xml[0].getElementsByTagName("universidad");


                for(i=0;i<universidad.length;i++){





                    var nombre=universidad[i].getElementsByTagName("nombre");


                    var snombre = nombre[0].firstChild.nodeValue;





                    var longitud=universidad[i].getElementsByTagName("longitud");


                    var slon = longitud[0].firstChild.nodeValue;





                    var latitud=universidad[i].getElementsByTagName("latitud");


                    var slat = latitud[0].firstChild.nodeValue;





                    var imagen=universidad[i].getElementsByTagName("imagen");


                    var simagen = imagen[0].firstChild.nodeValue;





                    var point = new GPoint (slon,slat);


                    var marker = createMarker (point,snombre,simagen);





                    map.addOverlay(marker);


                }


            }


        }


    }