{"id":977,"date":"2022-08-30T15:10:20","date_gmt":"2022-08-30T15:10:20","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2013\/11\/09\/jquery-getscript-and-google-maps-api-error-message-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:10:20","modified_gmt":"2022-08-30T15:10:20","slug":"jquery-getscript-and-google-maps-api-error-message-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/jquery-getscript-and-google-maps-api-error-message-collection-of-common-programming-errors\/","title":{"rendered":"jQuery getScript and Google Maps API Error message-Collection of common programming errors"},"content":{"rendered":"

I got a problem with loading the google maps api.<\/p>\n

I got my own object with a function that initializes the map, and the google maps api gets loaded via jquery.getscript. but i always get an error message in the callback function:<\/p>\n

var MyGMap = {\n    GMapScriptURL: \"http:\/\/maps.google.com\/maps?file=api&v=2&async=2&key=\",\n    Map: null,\n    Geocoder: null,\n    InitiazlizeMaps: function () {\n        if (GBrowserIsCompatible()) {\n            this.Map = new GMap2(document.getElementById(\"map_canvas\"));\n            this.Map.setCenter(new GLatLng(37.4419, -122.1419), 13);\n            this.Geocoder = new GClientGeocoder();\n        }\n    }\n}\n\n$(function(){\n    var CurrentKey = \"MY_KEY\";\n\n    $.getScript(MyGMap.GMapScriptURL + CurrentKey, function () {\n        MyGMap.InitiazlizeMaps();\n        \/\/ throws GMap2 is undefined\n\n    });\n});\n<\/code><\/pre>\n
whats wrong? why is this not running?<\/p>\n
    \n
  1. \n
    You’ve got async=2<\/code> in the script URL line which means load the mapping core asynchronously too – you need to wait for it to complete that before you can call InitializeMaps. You can either try dropping the async=2<\/code> from the URL, or using Google Map’s async and callback instead of the getScript callback function, e.g.<\/p>\n
    $.getScript(MyGMap.GMapScriptURL + CurrentKey + \"&callback=MyGMap.InitializeMaps\");\n<\/code><\/pre>\n<\/li>\n
  2. \n
    you can also use the async mode, but you need to provide a callback function.<\/p>\n
    Here http:\/\/lucamanzo-soluzione-software.it\/wp\/?p=5 you can find a simple jquery plugin showing all the steps to use the async loading and jquery, and building a map with just a few lines of code:<\/p>\n
    $.gmapstools.init();\n$(\"#my_map_canvas\").gmap({lat:37.4221913, lng:-122.08458530000001, draw_marker:true, zoom_level:13});\n<\/code><\/pre>\n<\/li>\n<\/ol>\n
    Originally posted 2013-11-09 23:10:06. <\/small><\/p>","protected":false},"excerpt":{"rendered":"
    I got a problem with loading the google maps api. I got my own object with a function that initializes the map, and the google maps api gets loaded via jquery.getscript. but i always get an error message in the callback function: var MyGMap = { GMapScriptURL: “http:\/\/maps.google.com\/maps?file=api&v=2&async=2&key=”, Map: null, Geocoder: null, InitiazlizeMaps: function () […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-977","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/977","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=977"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/977\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=977"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=977"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=977"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}