Valeria
Valeria

Reputation: 160

Google Maps API doesn't show the map

I'm working on a project and I need to use a google maps API and I saw a few tutorials, read the documentation, and saw the code once. Once again I don't see a mistake.

Code

<div id="map" style="height:500px;width:500px;"></div>

            <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

             <script type="text/javascript">

             var map;

                function ini()
                {
                    var mapOptions =
                    {
                        center: new google.maps.LatLng(37.7831, -122.4039),
                        zoom: 12,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                    }

                    map= new google.maps.Map(document.getElementById("map"), mapOptions);
                }

    </script>

If somebody know how to fix it, would appreciate your help.

Upvotes: 0

Views: 1752

Answers (1)

Mike Kor
Mike Kor

Reputation: 876

You defined function ini but didn't call it. The solution might look like this.

var map;

ini();

function ini()
{
    var mapOptions =
        {
           center: new google.maps.LatLng(37.7831, -122.4039),
           zoom: 12,
           mapTypeId: google.maps.MapTypeId.ROADMAP
        }

    map= new google.maps.Map(document.getElementById("map"), mapOptions);
}

Edit

Following the example from google the right way is to set up callback function

<script src="https://maps.googleapis.com/maps/api/js?callback=ini"
    async defer></script>

Should work just right. If you will have any further problems check this link

Upvotes: 2

Related Questions