title: KML not shown when loaded with javascript API to google maps
body: <p>I want to load a KML file with the API provided by GoogleMaps, but can't make it work.</p>
  
  <p>I have a KML file that works correctly and displays all the points when loaded manually from my computer to GoogleMaps. However, when I try to do it with the API, it doesn't work. I uploaded my file to Google drive and I am using the example provided by Google (I only change coordinates, file and API key).
  What am I doing wrong?</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no"&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;GeoRSS Layers&lt;/title&gt;
      &lt;style&gt;
        #map {
          height: 100%;
        }
        html, body {
          height: 100%;
          margin: 0;
          padding: 0;
        }
      &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="map"&gt;&lt;/div&gt;
      &lt;script&gt;
        function initMap() {
          var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 12,
            center: {lat: 40.45, lng: -3.8}
          });
          var georssLayer = new google.maps.KmlLayer({
            url: 'https://drive.google.com/file/d/1rvb4xvwAZGj4gwrQLH7mjZtPBGzv97WQ',
          });
          georssLayer.setMap(map);
        }
      &lt;/script&gt;
      &lt;script async defer
      src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&amp;callback=initMap"&gt;
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>code snippet:</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 12,
      center: {
        lat: 40.45,
        lng: -3.8
      }
    });
    var georssLayer = new google.maps.KmlLayer({
      url: 'https://drive.google.com/open?id=15OVgNwtVbLVARkHJD3F8P_bEfG9oJ4Lu',
    });
    georssLayer.setMap(map);
  }</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#map {
    height: 100%;
  }
  
  html,
  body {
    height: 100%;
    margin: 0;
    padding: 0;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;title&gt;GeoRSS Layers&lt;/title&gt;
  &lt;div id="map"&gt;&lt;/div&gt;
  &lt;script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&amp;callback=initMap"&gt;
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>