respected sir,
I am displaying the employee details in the Google map pin click(They are in different locations).
But only one employee is showing the pin click when many are in same location.
My case all the data I am getting in Marker.
But form each country only the last employee is displaying.
I am displaying data in a table .The code I give below.
Please help me to solve this
<script type="text/javascript">
var markers = [
<asp:Repeater ID="rptMarkers" runat="server">
<ItemTemplate>
{
"CityName": '<%# Eval("CityName") %>',
"lat": '<%# Eval("Latitude") %>',
"lng": '<%# Eval("Longitude") %>',
"email": '<%# Eval("email") %>',
"EmpName": '<%# Eval("EmpName") %>',
"CurrentContactNumber": '<%# Eval("CurrentContactNumber") %>'
}
</ItemTemplate>
<SeparatorTemplate>
,
</SeparatorTemplate>
</asp:Repeater>
];
</script>
<script type="text/javascript">
window.onload = function() {
debugger;
var mapOptions = {
center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
for (i = 0; i < markers.length; i++) {
var image = 'http://192.168.1.68/toshiba/Images/Male.png';
var data = markers[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
icon: image,
title: data.title
});
(function(marker, data) {
google.maps.event.addListener(marker, "click", function(e) {
infoWindow.setContent("<table style='width:400px;'><tr><td>" + "<h3>Name</h3>" + "</td><td>" + "<h3>Email</h3>" + "</td><td>" + "<h3>Contact Number</h3>" + "</td><td>" + "<h3>City</h3>" + "</td></tr><tr><td>" + data.EmpName + "</td><td>" + data.email + "</td><td>" + data.CurrentContactNumber + "</td><td>" + data.CityName + "</td></tr></table>");
infoWindow.open(map, marker);
});
})(marker, data);
}
}
</script>
Thank you