Google地图加载失败

Question

I need to integrate a google map in my web page. I generated a API. But the map is not displaying. I am testing it in my local server.

<h3>My Google Maps Demo</h3>
<div id="map">
    <span class="labels">Heading</span>
</div>
<script  src="https://maps.googleapis.com/maps/api/js?key=[API]&callback=initMap">
</script>
<script type="text/javascript">
    function initMap() {
                alert("Yes");
                var uluru = { lat: -25.363, lng: 131.044 };
                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 4,
                    center: uluru
                });
                var marker = new google.maps.Marker({
                    position: uluru,
                    map: map
                });
            }
</script>

but no use. Is their any issue in my code? Can i check my API is working or not

Answer 1

I cannot comment, so I write here. Do you have key code?

In console, there are errors:

RefererNotAllowedMapError Error
The current URL loading the Google Maps JavaScript API has not been added to the list of allowed referrers. Please check the referrer settings of your API key on the Google API Console.

See API keys in the Google API Console. For more information, see best practices for securely using API keys.

Maybe this would help you.

Answer 2

You need to have api key to access the maps. Modify your code like this:

JS:

 function initMap() {
   alert("Yes");
   var uluru = {
     lat: -25.363,
     lng: 131.044
   };
   var map = new google.maps.Map(document.getElementById('map'), {
     zoom: 4,
     center: uluru
   });
   var marker = new google.maps.Marker({
     position: uluru,
     map: map
   });

 }
 google.maps.event.addDomListener(window, "load", initMap);

Check this demo: http://jsfiddle.net/lotusgodkk/hLenqzmy/64/

You can get the api key from here: https://developers.google.com/maps/documentation/javascript/get-api-key

Answer 3

Your code is working fine. You need to place a JavaScript Google API there (I guess you placed another Google Maps Key)

Also check out this link for some google examples

Answer 4

另外，将在页面加载时调用initMap，并且在调用该页面时尚未声明MIGHT吗？