In this recipe, you have seen how to use the Leaflet JavaScript API library to add a map in an HTML page. First, you created one layer from an external server to use as the base map. Then, you created another layer using the MapServer WMS you implemented in a previous recipe to expose a PostGIS layer to the web. Then, you created a new map object and added it to these two layers. Finally, using jQuery, you implemented an AJAX call to the GetFeatureInfo WMS request and displayed the results in a Leaflet Popup object.

Leaflet is a very nice and compact alternative to the OpenLayers library and gives very good results when your webGIS service needs to be used from mobile devices, such as tablets and smart phones. Additionally, it has a plethora of plugins and can be easily integrated with JavaScript libraries, such as Raphael and JS3D.