[Solved] Uncaught ReferenceError: google is not defined

I want to use geolocation and direction function, but there is google is not defined error. the code is as below:

function loadScript() {
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.src = "" + "&callback=initialize";

It seems that the loadScript does not work!

var mapOptions = {
                zoom : 13,
                mapTypeId : google.maps.MapTypeId.ROADMAP
            map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);

The error jumps out from here. Is anyone who know how to figure it out? I need to use key to get the geolocation service, so I cannot use simple

<script src=""></script>

Solution #1:

If you people are getting Error in console then here is the simple solution that I applied.

include the script files in given sequence..

<script type="text/javascript" src=""></script>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>

You must first include ‘’ first then go for jquery library and remove it from below both (it will work.) I hope it will definitely work.

Respondent: Farid Abbas

Solution #2:

I tried it on my own with this code – it worked fine for me

Dynamic with key

<!DOCTYPE html>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        html {  height: 100%; }
            height: 100%;
            margin: 0px;
            padding: 0px;
        #map_canvas { height: 100%;}
    <script type="text/javascript">
        function initialize() {
            var latlng = new google.maps.LatLng(-34.397, 150.644);
            var myOptions = {
                zoom: 8,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            var map = new google.maps.Map(document.getElementById("map_canvas"),
        var myKey = "ENTER_YOUR_KEY_HERE";
        function loadScript() {
            var script = document.createElement('script');
            script.type = 'text/javascript';
            script.src = "" + myKey + "&sensor=false&callback=initialize";
<body onload="loadScript()">
    <div id="map_canvas" style="width: 100%; height: 100%">

Static without key

<script type="text/javascript" src="">
<body onload="initialize()">

When surfing through the net I tumbled over an important note!

Google Maps JavaScript API v3

The Google Maps JavaScript API v3 does not require an API key to
function correctly. However, we strongly encourage you to load the
Maps API using an APIs Console key which allows you to monitor your
application’s Maps API usage. Learn how to use an APIs Console key.

See Google Maps API

So, apparently you no longer need a developer key! I tried it with both – static no key and dynamnic with keyboth worked.

Solution #3:

Google is not defined mean that your google map libary is not loaded which mean you are on https or http and you are requesting via http ot https so change it to https or http ….
mean if you are on http then

<script type="text/javascript" src=""></script>

mean if you are on https then

<script type="text/javascript" src=""></script>
Respondent: zahid ullah

The answers/resolutions are collected from stackoverflow, are licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0 .

Most Popular

To Top
India and Pakistan’s steroid-soaked rhetoric over Kashmir will come back to haunt them both clenbuterol australia bossier man pleads guilty for leadership role in anabolic steriod distribution conspiracy