Private: Home › Forums › HTML Templates › Mixed Modern and Professional HTML Template › logo as a map pin in Google Maps › Reply To: logo as a map pin in Google Maps
Hello,
You can change the pin icon by modifying the jQuery code at the end of the contact.html document.
Find the code which says:
//CREATE A CUSTOM PIN ICON
var marker_image = 'img/pin.png';
var pinIcon = new google.maps.MarkerImage(marker_image, null, null, null, new google.maps.Size(21, 34));
And change the “img/pin.png” location so it points to your new marker icon image. Also, don’t forget to modify the dimensions new google.maps.Size(21, 34)
where 21 is 21px width and 34 is 34px height.
OR you can open the existing pin.png file located in img/ folder in e.g. Photoshop and change to look of the icon. That way you won’t have to change the code variables (if you don’t modify the pin.png original size, of course).
To change the pin location, you only need to modify the following code:
var nottingham = new google.maps.LatLng(52.934658, -1.131450);
That is, you have to input the valid latitude and longitude values. For example, to change the pin location to London, use the following code:
var nottingham = new google.maps.LatLng(51.5286416, -0.1015987);
You can obtain the latitude and logitude values from the google maps URL (https://www.google.hr/maps/place/London,+Ujedinjeno+Kraljevstvo/@51.5286416,-0.1015987,11z/data=!3m1!4b1!4m2!3m1!1s0x47d8a00baf21de75:0x52963a5addd52a99?hl=hr)
Robert