Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p><a href="http://www.codeproject.com/Articles/291499/Google-Maps-API-V3-for-ASP-NET" rel="nofollow">Start with this tutorial.</a></p> <p><a href="https://developers.google.com/maps/documentation/javascript/tutorial" rel="nofollow">Documentation is here.</a></p> <p><a href="http://briancray.com/posts/how-to-calculate-the-distance-between-two-addresses-with-javascript-and-google-maps-api/" rel="nofollow">How to calculate distance is here.</a></p> <p>EDIT:</p> <p>This is distance calculation example with Google Maps API v3 and ASP.NET.</p> <p>Client code:</p> <pre><code>&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&amp;v=3&amp;libraries=geometry"&gt;&lt;/script&gt; &lt;style type="text/css"&gt; #map{width:800px;height:500px} &lt;/style&gt; &lt;/head&gt; &lt;body style="font-family: Arial; font-size: 13px; color: red;"&gt; &lt;form id="Form1" runat="server"&gt; &lt;div id="map"&gt;&lt;/div&gt; &lt;input runat="server" type="hidden" id="DistanceValue" name="DistanceValue" /&gt; &lt;script type="text/javascript"&gt; var latlng = new google.maps.LatLng(54.40708, 18.667485); var latlng2 = new google.maps.LatLng(54.40708, 18.667485); var myOptions = { zoom:4, center:latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map= new google.maps.Map(document.getElementById('map'),myOptions); var marker = new google.maps.Marker({ position: latlng, title: "Westerplatte - first battle of WW2 in Europe", clickable: true, map: map }); var marker2 = new google.maps.Marker({ position: latlng2, title: "Westerplatte - first battle of WW2 in Europe", clickable: true, map: map }); google.maps.event.addListener(map, "click", function (event) { latlng2 = new google.maps.LatLng(event.latLng.lat(), event.latLng.lng()); marker2.setMap(null); marker2 = new google.maps.Marker({ position: latlng2, title: "selected by user", clickable: true, map: map }); var hidden = document.getElementById("DistanceValue"); hidden.value = google.maps.geometry.spherical.computeDistanceBetween(latlng, latlng2) / 1000; }); &lt;/script&gt; &lt;asp:Button ID="Button1" runat="server" Text="Send distance" onclick="Button1_Click" /&gt; &lt;asp:Label ID="Label1" runat="server" Text="Label"&gt;&lt;/asp:Label&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Server code:</p> <pre><code> protected void Button1_Click(object sender, EventArgs e) { if (Request.Form["DistanceValue"] != null) { string myHiddenFiledValue = Request.Form["DistanceValue"].ToString(); Label1.Text = myHiddenFiledValue.Split(',','.')[0] + " [km]"; } } </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

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