1

I'm following a tutorial on the Google Maps API and I get the code of API but its still not showing me the map

I get this error :

Google Maps API error: Google Maps API error: RefererNotAllowedMapError

Header.php

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDLDV40Ut-yGLG9r4N629K8-Rv0dtQsZzQ"></script>

<body   onload="initialize">

map.php

<script type="text/javascript">

    function initialize() {
        var myLatLng = { lat: 42.52501, lng: 2.938979 };
        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 12,
            center: myLatLng,
            scrollwheel: false,
            draggable: true,
        });

        var image = 'logo.png';
        var marker = new google.maps.Marker({
            position: myLatLng,
            map: map,
            icon: image
        });
    }

</script>
duncan
  • 31,401
  • 13
  • 78
  • 99
letseasy
  • 47
  • 1
  • 3
  • 11

1 Answers1

2

I could not see any clear reason why your code is not working.

The only reason can be if your API key is registered with your domain name it will not allow any Google Maps element in the development environment/localhost.

If you are running this on local machine remove your API key from the script 

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?"></script>

Also, use http when developing on local machine rather than https. Try changing the Google Maps script's src with http as there might be a security reason due to which you might be getting this error.

So your script for non-https site will be 

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?"></script>

If you are getting this problem in your live instance then make sure that script and your domain both use the same protocol which is either http or https. Do not mix the combinations.

Further suggestion: Give a more qualified name to the logo.png

You should be up and running.

ihimv
  • 1,308
  • 12
  • 25