title: Google Map API marker not appearing on map on mobile
body: <p>I am using Google Map Javascript API with marker clustering and InfoBox on a Laravel Website</p>
  
  <p><a href="https://developers.google.com/maps/documentation/javascript/marker-clustering" rel="nofollow noreferrer">https://developers.google.com/maps/documentation/javascript/marker-clustering</a></p>
  
  <p>The native red marker shows properly on desktop but doesnt appear on mobile.
  However if i click at the location where it should be, my infobox does appear and everything else if ok.</p>
  
  <p>Is there a special setting to be taken into account (as maybe the png used for this marker on mobile display or else?)</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;style&gt;
         /* Set the size of the div element that contains the map */
        #map {
          height: 400px;  /* The height is 400 pixels */
          width: 100%;  /* The width is the width of the web page */
         }
      &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;h3&gt;My Google Maps Demo&lt;/h3&gt;
      &lt;!--The div element for the map --&gt;
      &lt;div id="map"&gt;&lt;/div&gt;
      &lt;script&gt;
  // Initialize and add the map
  function initMap() {
    // The location of Uluru
    var uluru = {lat: -25.344, lng: 131.036};
    // The map, centered at Uluru
    var map = new google.maps.Map(
        document.getElementById('map'), {zoom: 4, center: uluru});
    // The marker, positioned at Uluru
      var image = 'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png';
   
    var marker = new google.maps.Marker({position: uluru, map: map,icon: image});
  }
      &lt;/script&gt;
      &lt;!--Load the API from the specified URL
      * The async attribute allows the browser to render the page while the API loads
      * The key parameter will contain your own API key (which is not needed for this tutorial)
      * The callback parameter executes the initMap() function
      --&gt;
      &lt;script async defer
      src="https://maps.googleapis.com/maps/api/js?callback=initMap"&gt;
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>