How to get values from google map in a web application

Question

I want to integrate google map into my web application and need to save both starting and ending locations duration and distance in a datagrid. Can anyone helps. Thank you in advance

Malvik Bhavsar · Answer

Check this solution file. this worked for me

Dhilu Das · Answer

Thanks Malvik Bhavsar  Its working fine. But i need the value 'hdnDistance' in code behind for further calculations. I just added one more function inside the button click like this. 'onclick=Button1_Click'. Inside the Button1_Click provided a code like this. protected void Button1_Click(object sender EventArgs e) { var distance = hdnDistance.Value; TextBox1.Text = dis.ToString(); } Buti failed to fetch that value into variable. Please help me.

Dhilu Das · Answer

I tried that but not working

Malvik Bhavsar · Answer

Hello Dhilu  try this var x = document.getElementById(' '); x.value = dvDistance.innerHTML; alert(hdnDistance.value);

Dhilu Das · Answer

Hello Malvik Bhavsar  body { font-family: Arial; font-size: 10pt; } var source destination; var directionsDisplay; var directionsService = new google.maps.DirectionsService(); google.maps.event.addDomListener(window 'load' function () { new google.maps.places.SearchBox(document.getElementById('txtSource')); new google.maps.places.SearchBox(document.getElementById('txtDestination')); directionsDisplay = new google.maps.DirectionsRenderer({ 'draggable': true }); }); function GetRoute() { //*********DIRECTIONS AND ROUTE**********************// source = document.getElementById(txtSource).value; destination = document.getElementById(txtDestination).value; var request = { origin: source destination: destination travelMode: google.maps.TravelMode.DRIVING }; //*********DISTANCE AND DURATION**********************// var service = new google.maps.DistanceMatrixService(); service.getDistanceMatrix({ origins: [source] destinations: [destination] travelMode: google.maps.TravelMode.DRIVING unitSystem: google.maps.UnitSystem.METRIC avoidHighways: false avoidTolls: false } function (response status) { if (status == google.maps.DistanceMatrixStatus.OK && response.rows[0].elements[0].status != ZERO_RESULTS) { var distance = response.rows[0].elements[0].distance.text; var duration = response.rows[0].elements[0].duration.text; dvDistance.innerHTML = ; dvDistance.innerHTML +=  + distance + ; document.getElementById('hdnDistance').value = dvDistance; alert(hdnDistance); } else { alert(Unable to find the distance via road.); } }); } Source : Destination : Distance : --%> I did like this. It is calculating the distance. But i need that value in code behind and i used a hidden field for that but its not working.

Malvik Bhavsar · Answer

Hello Dhilu Use google geocoding api in your webapplication. https://developers.google.com/maps/documentation/geocoding/