i have created a map with custom marker, but I am not sure how I can allow my users to click on the marker to get directions.
<script type="text/javascript">
jQuery(document).ready(function($) {
var latlng = new google.maps.LatLng(51.443054, -2.077167);
var settings = {
zoom: 13,
center: latlng,
mapTypeControl: true,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
navigationControl: true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), settings);
var companyLogo = new google.maps.MarkerImage('<?php bloginfo('template_url'); ?>/images/map-marker.png',
new google.maps.Size(100,50),
new google.maps.Point(0,0),
new google.maps.Point(50,50)
);
var companyShadow = new google.maps.MarkerImage('<?php bloginfo('template_url'); ?>/images/map-marker-shadow.png',
new google.maps.Size(100,50),
new google.maps.Point(0,0),
new google.maps.Point(50, 50)
);
var companyPos = new google.maps.LatLng(51.443054, -2.077167);
var companyMarker = new google.maps.Marker({
position: companyPos,
map: map,
icon: companyLogo,
shadow: companyShadow,
title:"Fitzgraham",
zIndex: 4,
clickable: true
});
});
</script>