Google Maps API – Place A Marker On The Map
Last modified on May 11th, 2021
Raja Tamil
The first step is to instantiate the Google Maps map object where you want to place a marker onto.
var map = new google.maps.Map(document.getElementById("map"), {
zoom: 13
center: new google.maps.LatLng(45.424721, -75.695000),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
In this example, the map is centered based on latitude and longitude values of a random place in Ottawa, Canada.

Now, let’s place a marker using exact latitude and longitude values.
[blog-in-between-card]
Instantiate Marker Object
let marker = new google.maps.Marker({
position: new google.maps.LatLng(45.424807 -75.699234),
map: map
});
property name | value |
---|---|
position | The value is the LatLng object with the actual latitude and longitude values of a place where the marker is going to be pinned. For example, 45.424807 -75.699234 are the latitude and longitude values of Parliament Hill in Ottawa. |
map | The actual Google Maps map object. |
There you have it!

Animate Marker
new google.maps.Marker({
...
animation: google.maps.Animation.DROP
})
Show/Post Comments