CODEWITHSUNDEEP
javascripthtmlgoogle-maps
João Guerreiro
João Guerreiro

Reputation: 135

Google map not displaying in the page

Already have my id="ieatmaps" to call the googlemaps.js. But some how it is not beeing displayed. Maybe I'm doing something wrong.

      function initMap() {
        var map = new google.maps.Map(document.getElementById('ieatmaps'), {
          center: {lat: 40.674, lng: -73.945},
          zoom: 12,
          styles: [
]

        });
      }
.ieatmaps {
    border:0;
    height: 100%;
    width: 200px;
}
<section id="map">
  <div id="ieatmaps"></div>
      <script src="js/googlemaps.js"></script>
      <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB-aH4ym18aYYe86IiamWV88X-JrVhFLt8&callback=initMap"
      async defer></script>
</section>

Upvotes: 0

Views: 121

Answers (2)

CraigRodrigues
CraigRodrigues

Reputation: 86

Use # instead of . for ids in CSS.

Upvotes: 1

Zaid Bin Khalid
Zaid Bin Khalid

Reputation: 763

#ieatmaps not a class

function initMap() {
        var map = new google.maps.Map(document.getElementById('ieatmaps'), {
          center: {lat: 40.674, lng: -73.945},
          zoom: 12,
          styles: [
]

        });
      }
#ieatmaps {
    height: 200px;
    width: 200px;
    border:1px solid #000;
}
<section id="map">
  <div id="ieatmaps"></div>
      <script src="https://maps.googleapis.com/maps/api/js?sensor=false&key=AIzaSyB-aH4ym18aYYe86IiamWV88X-JrVhFLt8&callback=initMap"
      async defer></script>
</section>

Upvotes: 2

Related Questions