I have been using the Google Developers Tutorial on how to add a map to my website:
https://developers.google.com/maps/tutorials/fundamentals/adding-a-google-map#the_finished_code
I cannot seem to find a way to add a pin to the map, I have used the "centre" function so that the map is centred on the lat and long of the pin, but the pin itself is not visible.
Any way to create a pin at that lat and long?
Just need to instantiate a marker Object and place it at the coordinates:
<!DOCTYPE html>
<html>
<head>
<style>
#map {
width: 500px;
height: 400px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
var mapCanvas = document.getElementById('map');
var myLatLng = {lat: 44.5403, lng: -78.5463};
var mapOptions = {
center: new google.maps.LatLng(myLatLng),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(mapCanvas, mapOptions)
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments