title: Google KmlLayer not displaying custom marker
body: <p>I've written an R script to create a KML file and the resultant KML below loads icon18.png fine when viewed in Google Earth:</p>
  
  <pre><code>   &lt;kml xmlns:xsd="http://schemas.opengis.net/kml/2.2.0/ogckml22.xsd" xmlns:xmlns="http://www.opengis.net/kml/2.2/" version="1.0"&gt;
        &lt;Document&gt;
          &lt;name&gt;Member locations&lt;/name&gt;
      &lt;open&gt;1&lt;/open&gt;
      &lt;Folder&gt;
        &lt;name&gt;SpatialPointsDataFrame&lt;/name&gt;
        &lt;Style id="pnt1"&gt;
          &lt;IconStyle&gt;
            &lt;Icon&gt;
              &lt;href&gt;http://maps.google.com/mapfiles/kml/pal2/icon18.png&lt;/href&gt;
            &lt;/Icon&gt;
          &lt;/IconStyle&gt;
          &lt;BalloonStyle&gt;
            &lt;text&gt;$[description]&lt;/text&gt;
          &lt;/BalloonStyle&gt;
        &lt;/Style&gt;
        &lt;Placemark&gt;
          &lt;name&gt;1&lt;/name&gt;
          &lt;styleUrl&gt;#pnt1&lt;/styleUrl&gt;
          &lt;Point&gt;
            &lt;extrude&gt;1&lt;/extrude&gt;
            &lt;altitudeMode&gt;clampToGround&lt;/altitudeMode&gt;
            &lt;coordinates&gt;151.26250,-33.89374,0&lt;/coordinates&gt;
          &lt;/Point&gt;
        &lt;/Placemark&gt;
      &lt;/Folder&gt;
    &lt;/Document&gt;
  &lt;/kml&gt;
  </code></pre>
  
  <p>However when loaded into a KmlLayer using the maps API and the following code it displays as the default blue 'teardrop' marker:</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;style type="text/css"&gt;
        html { height: 100% }
        body { height: 100%; margin: 0; padding: 0 }
        #map_canvas { height: 100% }
      &lt;/style&gt;
      &lt;script type="text/javascript"
        src="https://maps.googleapis.com/maps/api/js?key=mykey&amp;sensor=false"&gt;
      &lt;/script&gt;
      &lt;script type="text/javascript"&gt;
        function initialize() {
          var mapOptions = {
            center: new google.maps.LatLng(-34.397, 150.644),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
          };
          var map = new google.maps.Map(document.getElementById("map_canvas"),
              mapOptions);
      var ctaLayer = new google.maps.KmlLayer('http://www.peter-johnson.com.au/test.kml');
      ctaLayer.setMap(map);
        }
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body onload="initialize()"&gt;
      &lt;div id="map_canvas" style="width:100%; height:100%"&gt;&lt;/div&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Looking at other questions here I could only see ones posted without code that went unanswered or some related to the web server not being publically available.
  A few indiciated there problem was now OK so I guess loading custom icons into a KmlLayer is supported but I have some problem with the KML format or the way I'm loading it?</p>
  
  <p>As suggested in a comment I've just placed the KML in a publically available area here:</p>
  
  <p><a href="http://www.peter-johnson.com.au/test.kml" rel="nofollow">http://www.peter-johnson.com.au/test.kml</a></p>
  
  <p>And here is the HTML:</p>
  
  <p><a href="http://www.peter-johnson.com.au/test.htm" rel="nofollow">http://www.peter-johnson.com.au/test.htm</a></p>