I'm struggling to figure out how to connect my map markers with data from a SQL server database. The idea is to display markers on the map, each containing information that can be clicked to navigate to a specific ASPX page. However, I'm facing difficulty in passing the required data between them. Any suggestions or guidance would be greatly appreciated!
The markers are generated using a repeater
<asp:Repeater ID="rptMarkers" runat="server">
<ItemTemplate>
{
"title": '<%# Eval("LandmarkName") %>',
"lat": '<%# Eval("LandmarkLat") %>',
"lng": '<%# Eval("LandmarkLong") %>',
"description": '<%# Eval("LandmarkDesc") %>',
"id": '<%# Eval("LandmarkID")%>'
}
Below is the accompanying JavaScript code
window.onload = function () {
var mapOptions = {
center: new google.maps.LatLng(14.581, 120.976),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
for (i = 0; i < markers.length; i++) {
var data = markers[i];
var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: data.title
});
(function (marker, data) {
var infotext = data.description + "<a href='#'>More Info</a>";
var id = data.id;
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(infotext);
infoWindow.open(map, marker);
document.getElementById("landmark").value = id;
});
})(marker, data);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
window.onload = InitializeMap;
Here's how the repeater gets filled
DataTable dt = this.GetData(sql);
rptMarkers.DataSource = dt;
rptMarkers.DataBind();
}
protected DataTable GetData(string query)
{
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["DefaultConnection"].ConnectionString);
SqlCommand cmd = new SqlCommand(query);
con.Open();
using (SqlDataAdapter sda = new SqlDataAdapter())
{
cmd.Connection = con;
sda.SelectCommand = cmd;
using (DataTable dt = new DataTable())
{
sda.Fill(dt);
return dt;
}
}
}
In essence, the SQL query retrieves an ID which I intend to use to fetch data from the database in another ASPX page. I've attempted to utilize session state through a hidden input field, but haven't been able to get it functioning properly.
Thank you for any assistance provided! :D