CODEWITHSUNDEEP
javascriptproj4js
Daniel Kvist
Daniel Kvist

Reputation: 3042

How to include JavaScript libraries?

I'm having trouble with including the proj4.js JavaScript library in my code. The code looks like this:

<!DOCTYPE html>
<html>
<head>
    <title>Proj4js Testing</title>
</head>
<body onload="convertCoordinates()">
    <script type="text/javascript" src="proj4.js">
        function convertCoordinates() {
            var sourceProjection = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
            var targetProjection = "+proj=utm +zone=33 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs";
            proj4(sourceProjection, targetProjection, [15, 55]);
            alert("Done!");
        }
    </script>
</body>
</html>

But it never gives me a message saying "Done!". I'm having very little knowledge about JavaScript, but I can't see the problem in this code. I followed the user guide on GitHub.

Upvotes: 3

Views: 1789

Answers (2)

Alan
Alan

Reputation: 3002

You cannot combine inline JavaScript code along with an externally loaded script. Instead, simply split your scripts into two seperate blocks:

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

<script type="text/javascript">
        function convertCoordinates() {
            var sourceProjection = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
            var targetProjection = "+proj=utm +zone=33 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs";
            proj4(sourceProjection, targetProjection, [15, 55]);
            alert("Done!");
        }
</script>

Upvotes: 3

Spencer Wieczorek
Spencer Wieczorek

Reputation: 21575

They need to be separate <script> tags:

<script type="text/javascript" src="proj4.js"></script>
<script type="text/javascript" >
    function convertCoordinates() {
        var sourceProjection = "+proj=longlat +ellps=WGS84 +datum=WGS84 +no_defs";
        var targetProjection = "+proj=utm +zone=33 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs";
        proj4(sourceProjection, targetProjection, [15, 55]);
        alert("Done!");
    }
</script>

Upvotes: 3

Related Questions