title: Google Maps API custom Icons with SSL
body: <p>I have a Google Maps Application and I want to put custom Icons instead of the generic red icon that usually shows up. But no matter what I do I can not set a different icon it always shows up as the red one. I read that you can not have https in the url for icons so I uploaded it to an image host but I still can't  get the icon to change. How do I get a custom icon on the map or do I have to go with bing?</p>
  
  <pre><code>function initialize() {
      geocoder = new google.maps.Geocoder();
      var latlng = new google.maps.LatLng(-34.397, 150.644);
      var mapOptions = {
        zoom: 10,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
      map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
    }
  
    function codeAddress() {
    initialize();
      var address = document.getElementById("address").value;
      range = document.getElementById("distance").value;
      geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          map.setCenter(results[0].geometry.location);
          var marker = new google.maps.Marker({
              map: map,
              icon: "http://labs.google.com/ridefinder/images/mm_20_red.png"
              position: results[0].geometry.location
  
          });
  
          lat1 = results[0].geometry.location.lat();
          lng1 = results[0].geometry.location.lng();
  
        } else {
          alert("Geocode was not successful for the following reason: " + status);
        }
      });
      load();
    }
  </code></pre>
  
  <p>Notice where it says:</p>
  
  <pre><code>icon: "http://labs.google.com/ridefinder/images/mm_20_red.png"
  </code></pre>
  
  <p>Not matter what I change that too it always shows the red generic icon.</p>