Google Maps
<style>
#map_canvas {
height: 800px;
margin: 0px;
padding: 0px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key=AIzaSyBjt7bjLLGOWjfQUlU_HDeeSFp-Vee-TzY&sensor=false"></script>
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(-28.0846686,153.4759664);
var mapOptions = {
zoom: 12,
center: myLatlng
};
// instatiate map
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
// create marker options
var marker = new google.maps.Marker({
position: myLatlng,
title:"Hello World!"
});
var infoWindow = new google.maps.InfoWindow({
content: "Shark!"
});
google.maps.event.addListener(marker, 'click', function(e){
infoWindow.open(map, marker);
});
// To add the marker to the map, call setMap(); (after map is istantiated)
marker.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="map_canvas"></div>