var iconBlue = new GIcon(); 
    iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
    iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconBlue.iconSize = new GSize(12, 20);
    iconBlue.shadowSize = new GSize(22, 20);
    iconBlue.iconAnchor = new GPoint(6, 20);
    iconBlue.infoWindowAnchor = new GPoint(5, 1);

    var iconRed = new GIcon(); 
    iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
    iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
    iconRed.iconSize = new GSize(12, 20);
    iconRed.shadowSize = new GSize(22, 20);
    iconRed.iconAnchor = new GPoint(6, 20);
    iconRed.infoWindowAnchor = new GPoint(5, 1);

    var customIcons = [];
    customIcons["ville"] = iconBlue;
    customIcons["adresse"] = iconRed;
    var map2;
    var marker = [];
    var html = [];
    var tooltip;
    var choose_bounds = 0;

    function load() {
      if (GBrowserIsCompatible()) {
        map2 = new GMap2(document.getElementById("map2"));
        map2.addControl(new GLargeMapControl());
        map2.addControl(new GMapTypeControl());
        map2.setCenter(new GLatLng(48.869801, 2.34194));

        // ====== set up marker mouseover tooltip div ======
        tooltip = document.createElement("div");
        map2.getPane(G_MAP_FLOAT_PANE).appendChild(tooltip);
        tooltip.style.visibility="hidden";

		//url
        GDownloadUrl(url, function(data) {
        var xml = GXml.parse(data);
        var markers = xml.documentElement.getElementsByTagName("ville");
        map2.clearOverlays();
        var bounds = new GLatLngBounds();
        var bounds2 = new GLatLngBounds();
          for (var i = 0; i < markers.length; i++) {
            var id = markers[i].getAttribute("id");
            var name = markers[i].getAttribute("nom");
            var codeinsee = markers[i].getAttribute("codeinsee");
            var ville_url = markers[i].getAttribute("ville_url");
            var nb_adresses = markers[i].getAttribute("nb_adresses");
            var type = 'ville';
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lati")),
                                    parseFloat(markers[i].getAttribute("longi")));
            var buf = '<span style="font-weight:bold;">' + name + '</span>';
            buf += '<br />'+nb_adresses+' adresse(s)';
            var tooltipcontent = '<span style="font-weight:bold;">' + name + '</span>';
            tooltipcontent += '<br />'+nb_adresses+' adresse(s)';
            //photos de la ville
            var photos = markers[i].getElementsByTagName("photo");
            var photo_url = null;
            if(photos.length>0) buf += '<br />';
            if(photos.length>0) tooltipcontent += '<br />';
            for (var k = 0; k < photos.length; k++) {
                photo_url = photos[k].getAttribute("url");
                buf += '<img style="margin: 5px 5px 5px 0;" src="resize.php?image=villesGaleries/'+codeinsee+'/'+ photo_url + '&amp;width=50&amp;height=50" width="50" height="50" />';
                tooltipcontent += '<img style="margin: 5px 5px 5px 0;" src="resize.php?image=villesGaleries/'+codeinsee+'/'+ photo_url + '&amp;width=50&amp;height=50" width="50" height="50" />';
            }

            //adresses
            var adresses = markers[i].getElementsByTagName("adresse");
            var adresse_id = null;
            var adresse_nom = null;
            var adresse_nb = null;
            var adresse_url = null;

            for (var l = 0; l < adresses.length; l++) {
                adresse_id = adresses[l].getAttribute("id");
                adresse_nom = adresses[l].getAttribute("nom");
                adresse_nb = adresses[l].getAttribute("nb");
                adresse_url = adresses[l].getAttribute("url");
                //buf += '<br /><a href="'+ adresse_url + '">' + adresse_nom + '</a> : x' + adresse_nb;
                var type2 = 'adresse';
                var point2 = new GLatLng(parseFloat(adresses[l].getAttribute("lati")),
                parseFloat(adresses[l].getAttribute("longi")));
                bounds2.extend(point2);
                choose_bounds = 1;
                type = 'adresse';
            }
            buf += '<br /><a href="'+ville_url+'">voir les adresses</a>';
            html[id] = buf;
            marker[id] = createMarker(point, name, html[id], tooltipcontent, type);
            map2.addOverlay(marker[id]);
         	bounds.extend(point);
            type = 'ville';
          }
        if(choose_bounds==0) {
            if(map2.getBoundsZoomLevel(bounds) > 11) {
                zoom = 11;
            } else {
                zoom = map2.getBoundsZoomLevel(bounds);
            }
            map2.setCenter(bounds.getCenter(), zoom);
        } else {
            map2.setCenter(bounds2.getCenter(), 11);
        }
        });
      }
    }

    function createMarker(point, name, html, tooltipcontent, type) {
        var marker = new GMarker(point, customIcons[type]);
        marker.tooltip = '<div class="tooltip nobr">'+tooltipcontent+'<br />cliquez pour voir les adresses</span></div>';
        GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
        });
        //  ======  The new marker "mouseover" and "mouseout" listeners  ======
        GEvent.addListener(marker,"mouseover", function() {
          showTooltip(marker);
        });
        GEvent.addListener(marker,"mouseout", function() {
        tooltip.style.visibility="hidden"
        });
      return marker;
    }

      // ====== This function displays the tooltip ======
      // it can be called from an icon mousover or a side_bar mouseover
      function showTooltip(marker) {
      	tooltip.innerHTML = marker.tooltip;
        var point=map2.getCurrentMapType().getProjection().fromLatLngToPixel(map2.fromDivPixelToLatLng(new GPoint(0,0),true),map2.getZoom());
        var offset=map2.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map2.getZoom());
        var anchor=marker.getIcon().iconAnchor;
        var width=marker.getIcon().iconSize.width;
        var height=tooltip.clientHeight;
        var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offset.x - point.x - anchor.x + width, offset.y - point.y -anchor.y -height));
        pos.apply(tooltip);
        tooltip.style.visibility="visible";
      }