I used a Google Maps Distance Finder API that comes with two textboxes, one for the source, and one for the destination. It also comes with a button, that when clicked, will find the distance between the two locations using the funciton GetDistance(). The code before the function initializes the map. I created another button and used VB.Net to run SQL code first, and then to automatically populate the two textboxes, then I had it call the function GetDistance(). The issue I ran into is that the function won't calculate the distance, and the map never changes from its default state. I believe it's because it's not running the code that initializes the map. (I could be wrong) I have tried WebBrowser1, to call the click of the button, but I had to Inherit Forms, which I can't do, and I have also tried adding the top code into the GetDistance() function. Is it possible to call the initializing code before GetDistance()?
Here is the JS function code:
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
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() {
var mumbai = new google.maps.LatLng(18.9750, 72.8258);
var mapOptions = {
zoom: 7,
center: mumbai
};
map = new google.maps.Map(document.getElementById('dvMap'), mapOptions);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById('dvPanel'));
//*********DIRECTIONS AND ROUTE**********************//
source = document.getElementById("txtSource").value;
destination = document.getElementById("txtDestination").value;
var request = {
origin: source,
destination: destination,
travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function (response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
}
});
//*********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;
var dvDistance = document.getElementById("dvDistance");
dvDistance.innerHTML = "";
dvDistance.innerHTML += "Distance: " + distance + "<br />";
dvDistance.innerHTML += "Duration:" + duration;
} else {
alert("Unable to find the distance via road.");
}
});
}
</script>
Here is the VB Code I use to call the JS Function:
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click
Dim cn As New OleDb.OleDbConnection("Provider = Microsoft.ACE.OleDb.12.0;" & _
"Data Source=|DataDirectory|\Address Database One Calculation.mdb")
cn.Open()
Dim cmd1 As OleDb.OleDbCommand
Dim sqlconnection1 As String
sqlconnection1 = "INSERT INTO [DISTANCE] ([Address2], [City2], [State2], [ZipCode2], [Priority]) SELECT [Address], [City], [State], [ZipCode], [Priority] FROM [ADDRESS] WHERE [Priority] <> 0"
cmd1 = New OleDb.OleDbCommand(sqlconnection1, cn)
cmd1.ExecuteScalar()
Dim cmd2 As OleDb.OleDbCommand
Dim sqlconnection2 As String
sqlconnection2 = "UPDATE [DISTANCE], [ADDRESS] SET Address1 = [ADDRESS].Address, City1 = [ADDRESS].City, State1 = [ADDRESS].State, ZipCode1 = [ADDRESS].ZipCode WHERE [ADDRESS].Priority = 0;"
cmd2 = New OleDb.OleDbCommand(sqlconnection2, cn)
cmd2.ExecuteScalar()
Dim cmd3 As OleDb.OleDbCommand
Dim sqlconnection3 As String
sqlconnection3 = "SELECT [ADDRESS1] FROM [DISTANCE]"
cmd3 = New OleDb.OleDbCommand(sqlconnection3, cn)
cmd3.ExecuteScalar()
Dim cmd4 As OleDb.OleDbCommand
Dim sqlconnection4 As String
sqlconnection4 = "SELECT [CITY1] FROM [DISTANCE]"
cmd4 = New OleDb.OleDbCommand(sqlconnection4, cn)
cmd4.ExecuteScalar()
Dim cmd5 As OleDb.OleDbCommand
Dim sqlconnection5 As String
sqlconnection5 = "SELECT [STATE1] FROM [DISTANCE]"
cmd5 = New OleDb.OleDbCommand(sqlconnection5, cn)
cmd5.ExecuteScalar()
Dim cmd6 As OleDb.OleDbCommand
Dim sqlconnection6 As String
sqlconnection6 = "SELECT [ZipCode1] FROM [DISTANCE]"
cmd6 = New OleDb.OleDbCommand(sqlconnection6, cn)
cmd6.ExecuteScalar()
Dim cmd7 As OleDb.OleDbCommand
Dim sqlconnection7 As String
sqlconnection7 = "SELECT [ADDRESS2] FROM [DISTANCE]"
cmd7 = New OleDb.OleDbCommand(sqlconnection7, cn)
cmd7.ExecuteScalar()
Dim cmd8 As OleDb.OleDbCommand
Dim sqlconnection8 As String
sqlconnection8 = "SELECT [CITY1] FROM [DISTANCE]"
cmd8 = New OleDb.OleDbCommand(sqlconnection8, cn)
cmd8.ExecuteScalar()
Dim cmd9 As OleDb.OleDbCommand
Dim sqlconnection9 As String
sqlconnection9 = "SELECT [STATE1] FROM [DISTANCE]"
cmd9 = New OleDb.OleDbCommand(sqlconnection9, cn)
cmd9.ExecuteScalar()
Dim cmd10 As OleDb.OleDbCommand
Dim sqlconnection10 As String
sqlconnection10 = "SELECT [ZipCode1] FROM [DISTANCE]"
cmd10 = New OleDb.OleDbCommand(sqlconnection10, cn)
cmd10.ExecuteScalar()
txtSource.Text = cmd3.ExecuteScalar() + ", " + cmd4.ExecuteScalar() + ", " + cmd5.ExecuteScalar() + " " + cmd6.ExecuteScalar()
txtDestination.Text = cmd7.ExecuteScalar() + ", " + cmd8.ExecuteScalar() + ", " + cmd9.ExecuteScalar() + " " + cmd10.ExecuteScalar()
Dim dis As String
dis = distance.Value
Label1.Text = dis
Page.ClientScript.RegisterStartupScript(GetType(Page), "Script", "GetDistance();", True)
End Sub
For reference, here is the explanation of the full API Code:
http://www.aspsnippets.com/Articles/Google-Maps-API-V3-DirectionsService-Driving-Directions-example.aspx
Thanks in advance to everyone that helps!