function is not defined error javascript?

501 Views Asked by At

I am trying to generate a very simple map using kartograph.js. But some how my code is not working. I looked at it in web developers tools and it gives the

error: Uncaught RefrenceError: loadmap is not defined

    <html>
<head>
     <script src="jquery-1.8.3.min.js"></script>
     <script src="raphael-min.js"></script>
     <script src="kartograph.min.js"></script>


<!---starting karograph.js-->   

    <script language="JavaScript">
function loadmap(){
var map = Kartograph.map('#map', 900, 0);

map.loadmap('map.svg', function() {
    // add layers.
        map.addLayer('countries');
        map.addLayer('depth');
        map.addLayer('trees');
        map.addLayer('crops');
        map.addLayer('rivers');
        map.addLayer('canals');
        map.addLayer('city');
        map.addLayer('states');
        map.addLayer('coast');
        map.addLayer('coast');
});
}
</script>
</head>
<body onLoad = "loadmap()">
<div id = "map">
</div>
</body>
</html>
1

There are 1 best solutions below

0
On BEST ANSWER

Couple things:

Try not to use the same function names, it will make debugging easier (though it would technically work in this case).

map.loadmap should be map.loadMap http://kartograph.org/docs/kartograph.js/

Try this:

$(document).ready(function () {

var map = Kartograph.map('#map', 900, 0);

map.loadMap('map.svg', function() {

    // add layers.
        map.addLayer('countries');
        map.addLayer('depth');
        map.addLayer('trees');
        map.addLayer('crops');
        map.addLayer('rivers');
        map.addLayer('canals');
        map.addLayer('city');
        map.addLayer('states');
        map.addLayer('coast');
        map.addLayer('coast');
});
});

And remove onLoad from body.