-
May 11th, 2015, 05:54 AM
#1
Thread Starter
Fanatic Member
[RESOLVED] google MAP question
i want to know how is it possible to display google map same like this attached image?
Display that line from source country to destination country?
-
May 11th, 2015, 07:13 PM
#2
Re: google MAP question
Hi there chunk,
here is an example...
Code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<title>Iraq to North Carolina</title>
<style>
html, body{
background-color:rgba(240,240,240,1.0);
}
#map-canvas {
width:60vw;
height:40vw;
margin:auto;
border:1px solid #999;
box-shadow:8px 8px 8px rgba(153,153,153,0.75);
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>
(function() {
'use strict';
function initialize() {
var iraq=new google.maps.LatLng(32.502399, 44.620955);
var ncarolina=new google.maps.LatLng(35.753538, -79.015545);
var mapOptions = {
zoom:2,
center: new google.maps.LatLng(34.957995,-36.210937),
mapTypeId:google.maps.MapTypeId.TERRAIN
};
var map=new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
var marker=new google.maps.Marker({
position:iraq,
title:'This is Iraq!'
});
var marker1=new google.maps.Marker({
position:ncarolina,
title:'This is North Carolina!'
});
var coordinates=[
new google.maps.LatLng(35.753538,-79.015545),
new google.maps.LatLng(32.502399,44.620955)
];
var flightPath=new google.maps.Polyline({
path:coordinates,
geodesic:true,
strokeColor:'#ff0000',
strokeOpacity:1.0,
strokeWeight:2
});
flightPath.setMap(map);
marker.setMap(map);
marker1.setMap(map);
}
google.maps.event.addDomListener(window,'load',initialize);
})();
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
...and here are a few useful links...
- Simple Polylines
- Markers
- Find Latitude and Longitude
~ the original bald headed old fart ~
-
May 12th, 2015, 09:00 AM
#3
Thread Starter
Fanatic Member
Re: google MAP question
Originally Posted by coothead
Hi there chunk,
here is an example...
Code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<title>Iraq to North Carolina</title>
<style>
html, body{
background-color:rgba(240,240,240,1.0);
}
#map-canvas {
width:60vw;
height:40vw;
margin:auto;
border:1px solid #999;
box-shadow:8px 8px 8px rgba(153,153,153,0.75);
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>
(function() {
'use strict';
function initialize() {
var iraq=new google.maps.LatLng(32.502399, 44.620955);
var ncarolina=new google.maps.LatLng(35.753538, -79.015545);
var mapOptions = {
zoom:2,
center: new google.maps.LatLng(34.957995,-36.210937),
mapTypeId:google.maps.MapTypeId.TERRAIN
};
var map=new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
var marker=new google.maps.Marker({
position:iraq,
title:'This is Iraq!'
});
var marker1=new google.maps.Marker({
position:ncarolina,
title:'This is North Carolina!'
});
var coordinates=[
new google.maps.LatLng(35.753538,-79.015545),
new google.maps.LatLng(32.502399,44.620955)
];
var flightPath=new google.maps.Polyline({
path:coordinates,
geodesic:true,
strokeColor:'#ff0000',
strokeOpacity:1.0,
strokeWeight:2
});
flightPath.setMap(map);
marker.setMap(map);
marker1.setMap(map);
}
google.maps.event.addDomListener(window,'load',initialize);
})();
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
...and here are a few useful links...
- Simple Polylines
- Markers
- Find Latitude and Longitude
code works exactly how i need it...
but can you please tell me how can i get 34.957995,-36.210937 LAT LNG values for USA and Canada and any other countries?
-
May 12th, 2015, 09:04 AM
#4
Re: google MAP question
Google has a list available with the long and lat of all countries here: https://developers.google.com/public.../countries_csv
-
May 12th, 2015, 09:17 AM
#5
Thread Starter
Fanatic Member
Re: google MAP question
Originally Posted by kfcSmitty
thanks a lot :-)
my problem seems to be resolved now :-)
if still i get any problem i will get back to you here :-)
-
May 12th, 2015, 09:54 AM
#6
Re: google MAP question
Hi there chunk,
the third link in my previous post gives mouseover latitude and longitude values.
~ the original bald headed old fart ~
-
May 12th, 2015, 10:10 AM
#7
Thread Starter
Fanatic Member
Re: google MAP question
Originally Posted by coothead
Hi there chunk,
the third link in my previous post gives mouseover latitude and longitude values.
yes i noticed it :-)
and this solved my problems :-)
thanks a lot for your time my friend :-)
-
May 12th, 2015, 10:15 AM
#8
Re: [RESOLVED] google MAP question
No problem, you're very welcome.
~ the original bald headed old fart ~
-
Jul 24th, 2015, 05:38 AM
#9
Thread Starter
Fanatic Member
Re: [RESOLVED] google MAP question
Originally Posted by coothead
No problem, you're very welcome.
hi coothead
why title is not working in the code you provided
Code:
title:'This is Iraq!'
also is there a way to display same text as title when marker is clicked. But in the same code if some flags can be added?
-
Jul 24th, 2015, 07:35 AM
#10
Re: [RESOLVED] google MAP question
Hi there chunk,
the "title" appears to work in IE, Chrome and Opera but not Firefox.
I have no explanation for this, as the code is Google's code not mine.
I cannot answer your second question for the same reason.
Here, though, are two useful google links...
~ the original bald headed old fart ~
-
Jul 24th, 2015, 08:05 AM
#11
Thread Starter
Fanatic Member
Re: [RESOLVED] google MAP question
Originally Posted by coothead
Hi there chunk,
the "title" appears to work in IE, Chrome and Opera but not Firefox.
I have no explanation for this, as the code is Google's code not mine.
I cannot answer your second question for the same reason.
Here, though, are two useful google links...
hi coothead
i have found the solution.
thank you :-)
-
Jul 24th, 2015, 08:17 AM
#12
Re: [RESOLVED] google MAP question
I am pleased that you have found the solution.
But sorry that I was unable to find it myself.
~ the original bald headed old fart ~
-
Jul 24th, 2015, 09:02 AM
#13
Thread Starter
Fanatic Member
Re: [RESOLVED] google MAP question
Originally Posted by coothead
I am pleased that you have found the solution.
But sorry that I was unable to find it myself.
Thanks a lot for these kind words
-
Aug 31st, 2015, 06:49 PM
#14
New Member
Re: [RESOLVED] google MAP question
I need help, I am writing a CMS program that utilizes google maps. I need to plan routes based off of a MySql query that I wrote. The query works but I am having trouble pulling the data from the DataGridView to the WebBrowser control that handles the google maps URL.
Here is my Code:
Imports MySql.Data.MySqlClient
Imports System.Text
Public Class mapplotroute
Dim MysqlConn As MySqlConnection
Dim COMMAND As MySqlCommand
Dim address1 As String
Dim address2 As String
Dim dvcity As String
Dim dvstate As String
Dim dvzip As String
Private Sub mapplotroute_Load(sender As Object, e As EventArgs) Handles Me.Load
MysqlConn = New MySqlConnection
Dim txtreader As New System.IO.StreamReader("C:\tradesman\db\tmdb.txt")
Dim dbcon As String
dbcon = txtreader.ReadLine()
MysqlConn.ConnectionString = dbcon
Dim SDA As New MySqlDataAdapter
Dim dbDataSet As New DataTable
Dim bSource As New BindingSource
Dim DV As New DataView(dbDataSet)
Try
MysqlConn.Open()
Dim Query As String
Query = "select concat(cmf_first_name, ' ', cmf_last_name)as 'Customer Name',cmf_address1 as 'Address 1'," _
& " cmf_address2 as 'Address 2'," _
& " cmf_city as 'City'," _
& " cmf_state as 'State'," _
& " cmf_zip as 'Zip'" _
& " from schedule, Customer" _
& " WHERE cmf_customer_no = sdf_customer" _
& " AND sdf_start_date = '" & Schedule.dateselect.Text & "'" _
& " AND sdf_ee_id = '" & Schedule.emptext.Text & "'"
COMMAND = New MySqlCommand(Query, MysqlConn)
SDA.SelectCommand = COMMAND
SDA.Fill(dbDataSet)
bSource.DataSource = dbDataSet
DataGridView1.DataSource = bSource
SDA.Update(dbDataSet)
MysqlConn.Close()
Catch ex As Exception
MessageBox.Show(ex.Message)
Finally
MysqlConn.Dispose()
End Try
End Sub
Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click
Try
Dim street As String = String.Empty
Dim city As String = String.Empty
Dim state As String = String.Empty
Dim zip As String = String.Empty
Dim queryaddress As New StringBuilder()
queryaddress.Append("http://maps.google.com/maps/dir/")
'build street query
If address1 <> String.Empty Then
street = address1.Replace(" ", "+")
queryaddress.Append(street + "," & "+")
End If
'build baddress query
If address2 <> String.Empty Then
street = address2.Replace(" ", "+")
queryaddress.Append(street + "," & "+")
End If
'build city query
If dvcity <> String.Empty Then
city = dvcity.Replace(" ", "+")
queryaddress.Append(city + "," & "+")
End If
'build state query
If dvstate <> String.Empty Then
state = dvstate.Replace(" ", "+")
queryaddress.Append(state + "," & "+")
End If
'build zip query
If dvzip <> String.Empty Then
zip = dvzip.Replace(" ", "+")
queryaddress.Append(zip + "," & "+")
End If
map.WebBrowser1.Navigate(queryaddress.ToString())
Catch ex As Exception
MessageBox.Show(ex.Message.ToString(), "Unable to Get Map")
End Try
map.Show()
End Sub
Private Sub lvAppoint_SelectedIndexChanged(sender As Object, e As EventArgs)
End Sub
Public Sub DataGridView1_CellContentClick(sender As Object, e As DataGridViewCellEventArgs) Handles DataGridView1.CellContentClick
If e.RowIndex >= 0 Then
Dim row As DataGridViewRow
row = Me.DataGridView1.Rows(e.RowIndex)
address1 = row.Cells("Address 1").Value.ToString
address2 = row.Cells("Address 2").Value.ToString
dvcity = row.Cells("City").Value.ToString
dvstate = row.Cells("State").Value.ToString
dvzip = row.Cells("Zip").Value.ToString
End If
End Sub
Private Sub Timer1_Tick(sender As Object, e As EventArgs)
End Sub
End Class
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|