Google Map does not appear

Question

Google Map does not appear

Navigation

#1 by (2 votes)

1

The google map is not showing up on my site.

Code:

<div class="row"> //O ERRO OCORRE QUANDO INCLUO A DIV MAP DENTRO DESSA DIV ROW
    <div id="map" class="col-6"></div>
    <div class="col-6">teste</div>
</div>

    <script>
      var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -8.607014, lng: -35.951444},
          zoom: 15
        });
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=XXXXX&callback=initMap" async defer></script>

If I do not use the ROW div, the map appears normally, but since I want to split the screen into two parts, I want to do it the way it is above.

Any tips?

javascript html google-maps bootstrap

asked by anonymous 10.12.2017 / 21:21

1 answer

Using "from x import y" in python reduces the size of the application? Firebase data reading always returns null

score 2 · Accepted Answer

The grid system should be conflicting with the height of the map, change this:

<div class="row">
    <div id="map" class="col-6"></div>
    <div class="col-6">teste</div>
</div>

For this reason:

<div class="row">
    <div class="col-6">
         <div id="map"></div>
    </div>
    <div class="col-6">teste</div>
</div>