Hello guys,
I'm trying to create a google map page that with display hotels and I want that the infow window to contain the site of that hotel and when people click on it I want them to be linked to tat particular site. The code tha i used the below :
var cityHotel = [
['HOTEL OLYMPOS', 37.6740392, 21.4361431, 10, 'img/pink.png'],
['HOTEL MARILY', 37.675677, 21.436359, 11, 'img/pink.png'],
['HOTEL ΠΑΝΘΕΟΝ', 37.674106, 21.4372605, 12, 'img/pink.png']
],
demoCenter = new google.maps.LatLng(37.6719964,21.4443562),
map;
function initialize()
{
map = new google.maps.Map(document.getElementById('myMap'), {
zoom: 7,
center: demoCenter,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
}
function addMarkers2()
{
var marker,
i,
infowindow = new google.maps.InfoWindow({
content:
"<b>"
+
Olympos Hotel
+
"</a></b> <br/>"
+
address
+
"<br /><a href='http://www.hotel-olympos.gr/"
+
id
+
"'>View Listing</a><br /><b></b>"
;
});
for (i = 0; i < cityHotel.length; i++)
{
marker = new google.maps.Marker({
position: new google.maps.LatLng(cityHotel[i][1], cityHotel[i][2]),
map: map,
icon:cityHotel[i][4],
title: cityHotel[i][0],
animation: google.maps.Animation.DROP
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(cityHotel[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
}
$(document).on("pageinit", "#mappage", function() {
initialize();
});
$(document).on('click', '.add-markers', function(e) {
e.preventDefault();
addMarkers();
});