CODEWITHSUNDEEP
javascriptapigoogle-maps
MalMonk
MalMonk

Reputation: 29

How to use Google Maps API -- Meteor

As a CS student who is relatively new to web development and javascript/html, I've been having troubles figuring out the basics of how to use the Google Maps Javascript API.

My end goal is to be able to enter two addresses and calculate the distance between them, and I found a few examples of doing this using the google maps API. However, I'm having difficulties figuring out how to actually download/install/include the API code.

I found a couple links giving examples like this:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script>

Another link mentioned needing a key from the google developer's console (which I have).

So how exactly do I include the API code so I can start using it and start following examples and such?

Thanks

Upvotes: 0

Views: 199

Answers (1)

user6338637
user6338637

Reputation:

According to W3Schools, you will want to include <script src="http://maps.googleapis.com/maps/api/js"></script> in order to include the API script.

They give examples on how to use on the website. Here's an example on something you could do:

<!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
  var mapProp = {
    center:new google.maps.LatLng(51.508742,-0.120850),
    zoom:5,
    mapTypeId:google.maps.MapTypeId.ROADMAP
  };
  var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>

<body>
<div id="googleMap" style="width:500px;height:380px;"></div>
</body>

</html>

More information and a starter's guide here: http://www.w3schools.com/googleapi/google_maps_basic.asp

Upvotes: 1

Related Questions