Databases
StackOverflow2013
Postsdbo
POIntegrating Google Maps with ASP.NET website
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POIntegrating Google Maps with ASP.NET website
    text
    copied!<p> Hi, yes I have battled with the Google Documentation, and no, I was not asking anybody to write an application for me FoC! I do quite a lot of SQL forum answering myself on MSDN, and get how the forums work, just probably asked the question quite badly. I appreciate you pointing this out, as hopefully it will lead to more chance of the question being answered. As mentioned, I was really just hoping that somebody could post some working samples of the things I was discussing with, that I could then tinker with. The code that I have so far is below, but is in a bit of a state. Passing in the parameters to the Javascript is not working and I can't figure out how to even start making it accept user interactions with the map as inputs. The sample my code is based on came from a forum thread as I found this much more helpful than the official Google documentation!</p> <pre><code>&lt;%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %&gt; &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"/&gt; &lt;title&gt;Calculate Distance&lt;/title&gt; &lt;script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt; &lt;/head&gt; &lt;body style="font-family: Arial; font-size: 13px; color: red;"&gt; &lt;form runat="server"&gt; &lt;div id="map" style="width: 400px; height: 300px;"&gt;&lt;/div&gt; &lt;script type="text/javascript"&gt; var startlocation = document.getElementById('Start').textcontent; var endlocation = document.getElementById('End').textContent; var directionsService = new google.maps.DirectionsService(); var directionsDisplay = new google.maps.DirectionsRenderer(); var myOptions = { zoom:7, mapTypeId: google.maps.MapTypeId.ROADMAP } var map = new google.maps.Map(document.getElementById("map"), myOptions); directionsDisplay.setMap(map); var request = { origin: startlocation, destination: endlocation, travelMode: google.maps.DirectionsTravelMode.DRIVING }; directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { // Display the distance: document.getElementById('Distance').innerHTML += response.routes[0].legs[0].distance.value / 1609.344 + " miles"; directionsDisplay.setDirections(response); } }); &lt;/script&gt; &lt;asp:Label ID="Distance" runat="server" Text="Distance: "&gt;&lt;/asp:Label&gt; &lt;asp:TextBox ID="Start" runat="server" Text="hedge end"&gt;&lt;/asp:TextBox&gt; &lt;asp:TextBox ID="End" runat="server" Text="fareham"&gt;&lt;/asp:TextBox&gt; &lt;asp:Button ID="CalcDistance" runat="server" Text="Button" /&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p></p> <p>I am new to javascript and pretty new to ASP.NET and I have been fiddling with this for days and can't get anywhere.</p> <p>I want to integrate Google Maps into an ASP.NET page, so that the user can choose to either click 2 points on the map, or instead choose to insert one or both of the addresses into text boxes.</p> <p>Once the two locations have either been entered or plotted on the map, I then need to return the shortest driving distance in miles to an ASP.NET control.</p> <p>If somebody could help me out by posting a working sample of this or something similar, I would be really greatful.</p> <p>Many thanks in advance for your help.</p> <p>Pete</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload