Why isn't my GMaps.js working?

Question

I am having trouble getting GMaps.js working, I followed the instructions on https://hpneo.github.io/gmaps/examples/basic.html but the map does not appear, I am also getting the error message:

" Uncaught ReferenceError: GMaps is not defined"

in Chrome's developer tools.

Demo: http://jsfiddle.net/q80xqxxo/1/

HTML

<div id="map">MAP</div>

CSS

#map {
height:500px;
width:500px;
background-color:darkblue

}

Javascript

new GMaps({
div: '#map',
lat: -12.043333,
lng: -77.028333
});

Answer 1

Where are you loading in Gmaps.js?

The link in JSFiddle says http://bitsofinternet.com/massif/js/gmaps.js which gives a 404. Fix that and Gmaps will probably start working

working fiddle

added https://hpneo.github.io/gmaps/gmaps.js, probably should copy that to your server.

Answer 2

Have you included the gmaps.js script

 <script type="text/javascript" src="YOURPATH/gmaps.js"></script>

and document ready?

var map;
$(document).ready(function() {
    prettyPrint();
    map = new GMaps({
        div: '#map',
        lat: -12.043333,
        lng: -77.028333
    });
});