title: Leaflet.js: detecting when map finishes zooming
body: <p>So i'm making this application with leafet.js.
  This application requires that i have to manually draw grids onto the screen,
  that i've taken care in a <code>draw_grid()</code> function that draws a bunch of polygons to the screen.</p>
  
  <p>i have this function that i'm calling to trigger the change of the leaflet map.
  <code>zoom</code> - the zoom integer and <code>size</code> is a dict like <code>{x:1,y:1}</code> that controls the size of the tiles drawn onto the map. (they need to change as the units the tiles are being drawn under are lat,long points on the map. </p>
  
  <pre><code>function changeZoom(zoom,size){
      map.setZoom(zoom); 
      setSize(size);   
      setTimeout(drawGrid,500)s;
  </code></pre>
  
  <p>}</p>
  
  <p>the reason i have to use the setTimeout is because the leaflet <code>ignores</code> any drawing commands onto the map (which i'm doing as a layer) until the map has finished animating.</p>
  
  <p>how to do this asynchronously instead?</p>