<html>
<head>
<title>Google Map!</title>
<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">
var map = null;
function initialize() {
var latlng = new google.maps.LatLng(31.536648, 74.343443);
var myOptions = {
zoom: 12,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_area"), myOptions);
}
</script>
</head>
<body onload="initialize()" style="width: 98%; height: 100%;">
<div id="map_area" style="width: 100%; height: 520px;">
</div>
</body>
</html>
Now create another java script function AddMarker() to add pin on google map, in this function we will set basic properties of pin like its position ( coordinate: latitude and longitude) and its title. Add following code in <script> </script> tag inside head section of web page.
function AddMarker() {
var myLatlng = new google.maps.LatLng(31.5136648, 74.343443);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Lahore, Pakistan.'
});
}
Now create a new button in html and call this function on onclick event of button. Add following code immediately before </bode> tag.
<input type="submit" onclick="AddMarker()" name="button" title="Add marker" />
Complete code of all steps is
 |
| Add Marker/Pin on Google Map |
This is all. You have done. Save file and view in browser.
ReplyDeleteIf they are a reliable web site design Massachusetts they will listen to your needs and take all your input into consideration.
The most important thing is to be honest with your web site designer Massachusetts and to provide constructive feedback.
More details: web site design Massachusetts