title: Leaflet GeoJASON layer control not work in this script?
body: <p>I am using Leaflet library recently, i find it very easy to work and learn, the tutorials are very good with GeoJSON and Control Layers, but i not find one tutorial about the use of control layers with GeoJASON files, i write this script:</p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;html&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;link rel="stylesheet" type="text/css" href="leaflet.css"/&gt;
    &lt;script src="leaflet-src.js"&gt;&lt;/script&gt;
  
  
  &lt;script src="GeoJason/mpios.geojson"type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="GeoJason/roads.geojson"type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="GeoJason/city.geojson"type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="GeoJason/towns.geojson"type="text/javascript"&gt;&lt;/script&gt; 
  
  
  &lt;style&gt;
          html, body, #map {
              height: 100%;
          }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="map"&gt;&lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  
    var map = L.map('map').setView([20.990584, -98.65644], 12);
  
      L.geoJson(mpios).addTo(map);
      L.geoJson(roads).addTo(map);
      L.geoJson(city).addTo(map);
      L.geoJson(towns).addTo(map);
  
  
  var baseLayers = {
      "roads": roads,
          "mpios": mpios
  };
  
  
  var overlays = {
         "city": city,
          "towns": towns
  };
  
  L.control.layers(baseLayers, overlays).addTo(map);
      &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>but it display the layers and the control buttons not work, thx.</p>