Il y a 1 an    Notes    google maps  gmaps api  développement  
« Previous post Next post »

plugin jQuery GmapAddress

Un plugin jquery permettant d’afficher une google map avec un marker pointant sur une adresse que vous lui passé en paramètre.

Utilisation :

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=fr®ion=FR"></script>
<script type="text/javascript">
$(function(){
  $('#gmap').gmapAddress({
    address: '33000 Bordeaux, France',
    height: 200,
    width: 200,
    zoomLevel: 15
  });
});
</script>
<div id="gmap"></div>

Code source:

if(jQuery)(function() {
  $.extend($.fn, {
    gmapAddress: function( options ) {
      /**
       * @author Thierry Poinot http://thi3rry.fr
       */
      var gmap_height = options.height ? options.height : 400;
      var gmap_width = options.width ? options.width : 400;
      var zoom_level = options.zoomLevel ? options.zoomLevel : 13;
      var address = options.address ? options.address : '';
      
      var city = null;
      var waiting = 0;
      var $map_container = null;
      var map = null;
      var geocoder = null;
      
      
      //init the map
      $map_container = $(this);
      $map_container.css({
        height: gmap_height,
        width: gmap_width
      });
      var opt = {
        size: new google.maps.Size(gmap_width, gmap_height),
        // center on Bordeaux
        center: new google.maps.LatLng(44.83736927811443, -0.5757522583007812),
        navigationControlOptions: {
          style: google.maps.NavigationControlStyle.SMALL
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        'zoom': zoom_level,
        scaleControl: true
      };
      map = new google.maps.Map($map_container.get(0), opt);
      geocoder = new google.maps.Geocoder();
      // get LatLng of the address
      // and add a marker
      if (geocoder) {
        waiting ++;
        geocoder.geocode(
            {'address': address},
            function(response) {
              if (!response) {
                waiting --;
                //alert(address + " not found");
              } else {
                try{
                  point = response[0].geometry.location;
                  map.setCenter(point, 14);
    //              city = place.AddressDetails.Country.AdministrativeArea.SubAdministrativeArea.Locality.LocalityName;
                  var marker = new google.maps.Marker({
                    'position': point,
                    'map': map,
                    'title': address
                  });
                }
                catch(e){
                  waiting --;
                }
              }
            }
        );
      }
    }
  });  
})(jQuery);  

jquery.gmapAddress.js