title: Google Map Centers at top left corner
body: <p>I've been looking at many different examples, problems, and other things regarding this and I can't seem to find anything, so i'll finally ask a question.</p>
  
  <p>The map I have does not center the marker and doesn't even display it. The point it the very top left corner. See here: <a href="https://i.imgur.com/Cc1ZK.png" rel="noreferrer">http://i.imgur.com/Cc1ZK.png</a></p>
  
  <p>I have a tab system for contact information. When someone clicks a tab, the map and info slides down and shows up the proper marker (4 separate maps), however I can't get the first one to work so I can't copy/paste it.</p>
  
  <p>Here is my code:</p>
  
  <p>Script:</p>
  
  <pre><code>var latlng = new google.maps.LatLng(42.3535727, -83.0591444);
  var options = {  
        zoom: 14,  
        center: latlng,  
        mapTypeId: google.maps.MapTypeId.ROADMAP,
      };
  var map = new google.maps.Map(document.getElementById('detroit_map'), options);
  marker1 = new google.maps.Marker({  
              position: new google.maps.LatLng(42.3535727, -83.0591444),
              map: map
            }); 
  map.setCenter(latlng);
  </code></pre>
  
  <p>Html:</p>
  
  <pre><code>&lt;div id="detroit_map" style="width:270px;height:170px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>P.S, I get no errors in chrome developer tools.</p>
  
  <p>It's hopefully something really simple that I overlooked. </p>
  
  <p>Thanks</p>
  
  <p><strong>Found the answer for future viewers</strong>:</p>
  
  <p>Turns out, my tabs causing the display between block, and none were making my map load weird. I made an initialize function for each, and called setTimout('functionName', 1000); to call the maps to load.</p>
  
  <p>I changed my map code a little bit, but everything can we found on w3schools under their tutorial.</p>