Hi ivinraj25,
Refer the below code to get lat long based on location and add the marker to map.
Add the Newtonsoft dll in your project.
Namespace
using Newtonsoft.Json;
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAV8AiebjdcoS-Ratewz-HDkFt7XCq3zOM&libraries=places"></script>
<script type="text/javascript">
var markers = [
<asp:Repeater ID="rptMarkers" runat="server">
<ItemTemplate>
{
"title": '<%# Eval("Name") %>',
"Type": '<%# Eval("Type") %>',
"Location": '<%# Eval("Location") %>',
"description": '<%# Eval("Description") %>',
"lat": '<%# Eval("Latitude") %>',
"lng": '<%# Eval("Longitude") %>'
}
</ItemTemplate>
<SeparatorTemplate>
,
</SeparatorTemplate>
</asp:Repeater>
];
</script>
<script type="text/javascript">
window.onload = function () {
var mapOptions = { center: new google.maps.LatLng(markers[0].lat, markers[0].lng), zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP };
var infoWindow = new google.maps.InfoWindow();
var latlngbounds = new google.maps.LatLngBounds();
var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
var legend = document.getElementById("legend");
legend.innerHTML = "";
for (var 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, icon: data.icon });
(function (marker, data) {
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent("<div style = 'width:100px;height:40px'>" + data.Location + "</div>");
infoWindow.open(map, marker);
});
})(marker, data);
latlngbounds.extend(marker.position);
legend.innerHTML += "<div style = 'margin:5px'><img align = 'middle' src = '" + marker.icon + "' /> " + marker.title + "</div>";
}
var bounds = new google.maps.LatLngBounds();
map.setCenter(latlngbounds.getCenter());
map.fitBounds(latlngbounds);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<div id="dvMap" style="width: 500px; height: 500px">
</div>
</td>
<td id="legend" style="display: none;">
</td>
</tr>
</table>
</form>
</body>
</html>
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
DataTable dt = GetData(); // Get the datatable from database.
dt.Columns.Add("Latitude");
dt.Columns.Add("Longitude");
foreach (DataRow dr in dt.Rows)
{
RootObject jsonData = FindCoordinates(dr["Location"].ToString());
dr["Latitude"] = Convert.ToString(jsonData.results[0].geometry.location.lat, CultureInfo.InvariantCulture);
dr["Longitude"] = Convert.ToString(jsonData.results[0].geometry.location.lng, CultureInfo.InvariantCulture);
}
rptMarkers.DataSource = dt;
rptMarkers.DataBind();
}
}
private DataTable GetData()
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[]
{ new DataColumn("Id", typeof(int)), new DataColumn("Name"), new DataColumn("Type"), new DataColumn("Description"), new DataColumn("Location") });
dt.Rows.Add(1, "IVIN", "P", "I m a Pharmacy Employee", "Saidapet");
dt.Rows.Add(2, "Ratheesh", "D", "I m a Doctor", "Guindy");
dt.Rows.Add(3, "Assen", "H", "I m a Hospital Employee", "Pallavaram");
dt.Rows.Add(4, "Mani", "D", "I m a Doctor", "T.Nager");
dt.Rows.Add(5, "Prabha", "H", "I m a Hospital Employee", "Ramapuram");
dt.Rows.Add(6, "Ajith", "P", "I m a Pharmacy Employee", "Porur");
return dt;
}
protected RootObject FindCoordinates(string loc)
{
string url = "https://maps.googleapis.com/maps/api/geocode/json?address=" + loc + "&sensor=false";
WebRequest request = WebRequest.Create(url);
RootObject jsonData = new RootObject();
using (WebResponse response = (HttpWebResponse)request.GetResponse())
{
using (StreamReader reader = new StreamReader(response.GetResponseStream(), Encoding.UTF8))
{
var result = reader.ReadToEnd();
if (!string.IsNullOrEmpty(result))
{
jsonData = JsonConvert.DeserializeObject<RootObject>(result);
}
}
}
return jsonData;
}
public class AddressComponent
{
public string long_name { get; set; }
public string short_name { get; set; }
public List<string> types { get; set; }
}
public class Northeast
{
public double lat { get; set; }
public double lng { get; set; }
}
public class Southwest
{
public double lat { get; set; }
public double lng { get; set; }
}
public class Bounds
{
public Northeast northeast { get; set; }
public Southwest southwest { get; set; }
}
public class Location
{
public double lat { get; set; }
public double lng { get; set; }
}
public class Northeast2
{
public double lat { get; set; }
public double lng { get; set; }
}
public class Southwest2
{
public double lat { get; set; }
public double lng { get; set; }
}
public class Viewport
{
public Northeast2 northeast { get; set; }
public Southwest2 southwest { get; set; }
}
public class Geometry
{
public Bounds bounds { get; set; }
public Location location { get; set; }
public string location_type { get; set; }
public Viewport viewport { get; set; }
}
public class Result
{
public List<AddressComponent> address_components { get; set; }
public string formatted_address { get; set; }
public Geometry geometry { get; set; }
public string place_id { get; set; }
public List<string> types { get; set; }
}
public class RootObject
{
public List<Result> results { get; set; }
public string status { get; set; }
}
To find nearby doctors, pharmacy,hospital using google map api and javascript refer the below link.
http://stackoverflow.com/questions/18722477/how-to-find-nearby-hospitals-using-google-map-api-and-javascript