Iframe google Map - Lat/Long Coords -to- JS var (ultimately for php)


M

mikethestone

Here's what I have so far.
1) I know if I'm on a google map page for a location, I can paste
"javascript:prompt(window.gApplication.getMap().getCenter());" into
the address bar and copy the lat/long out

2) I can also make an iframe google map for location: "Belarus" on an
html
page with code like this:

<iframe width="300" name='iframe' height="300" frameborder="0"
scrolling="no" marginheight="0" marginwidth="0" src="http://
maps.google.com/maps?
f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Belarus&amp;z=10&amp;iwloc=A&amp;output=embed"></
iframe>

How do I do the below... but on from an iframe'd-google map?

I want to pass lat/long values FROM: a google map inside an iframe...
TO: the PHP page that has the iframe code


--I think I'll have to have a form that will put the vars in the
address bar, from JS, on submit
HERE'S AN EXAMPLE OF WHAT I HAVE & WHAT I WANT TO DO:

<script type="text/javascript">
var latitude =
some_google_code_that_pulls_lat_coord_from_iframe_google_map;
var longitude =
some_google_code_that_pulls_long_coord_from_iframe_google_map;
function submitform() { document.forms["myform"].submit(); }
</script>
<form id="myform" action="submit-form.php">
<input type='hidden' name='JS_LATITUDE' value='JS_LATITUDE'>
<input type='hidden' name='JS_LONGITUDE' value='JS_LONGITUDE'>
<a href="javascript: submitform()">Submit</a>
</form>




....
This is an example that was previous talked about on the google maps
group, but they said my q wasn't topical... but this example wasn't
referring to a map in an iframe
....

----------------------------------------
 var center = map.getCenter();
 var centerLat = center.lat();
 var centerLong = center.lng();

Then, as jon mentioned before, you can set the values to hidden
fields.
Or you can simply add the values to a query string.
e.g.http://foo.com/your_code.php?centerLat=...¢erLong=...

When the user submits the form, your PHP codes get the lat/long values
like

<?php
 $centerLat = $_REQUEST['centerLat'];
 $centerLong = $_REQUEST['centerLong'];

 // Store the values in your database.
?>



THANKS!!!!!! A million times over!
 
Ad

Advertisements

B

Bart Van der Donck

mikethestone said:
Here's what I have so far.
1) I know if I'm on a google map page for a location, I can paste
"javascript:prompt(window.gApplication.getMap().getCenter());" into
the address bar and copy the lat/long out

2) I can also make an iframe google map for location: "Belarus" on an
html
page with code like this:

<iframe width="300" name='iframe' height="300" frameborder="0"
scrolling="no" marginheight="0" marginwidth="0" src="http://
maps.google.com/maps?
f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Belarus&amp;z=10
&amp;iwloc=­A&amp;output=embed"></iframe>

How do I do the below... but on from an iframe'd-google map?

You cannot use an iframe at google.com, since you cannot access its
data from another domain. You will need to get your (free) Google Maps
API key first:
http://code.google.com/apis/maps/signup.html
I want to pass lat/long values FROM: a google map inside an iframe...
TO: the PHP page that has the iframe code

--I think I'll have to have a form that will put the vars in the
address bar, from JS, on submit
HERE'S AN EXAMPLE OF WHAT I HAVE & WHAT I WANT TO DO:

<script type="text/javascript">
var latitude =
some_google_code_that_pulls_lat_coord_from_iframe_google_map;
var longitude =
some_google_code_that_pulls_long_coord_from_iframe_google_map;
function submitform() { document.forms["myform"].submit(); }
</script>
<form id="myform" action="submit-form.php">
<input type='hidden' name='JS_LATITUDE' value='JS_LATITUDE'>
<input type='hidden' name='JS_LONGITUDE' value='JS_LONGITUDE'>
<a href="javascript: submitform()">Submit</a>
</form>

- <form> must have a "method"-argument (POST or GET).
- document.forms would refer to the form's "name"-argument,
document.getElementById would refer to the form's "id"-argument; you
mix up both.
- your markup is not valid, please see http://validator.w3.org/

Your problem is known as so-called "reverse geo-coding" (searching lat/
lon coordinates from a given place name).

Put the following in an HTML-document, replace XXX with your Google
Maps API key, put it on a domain where your Google Maps API key is
valid for, and put submit-form.php in the same directory:

-----------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Reverse geo-coding</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript"
src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=XXX">
</script>
<script type="text/javascript">
var map = null;
var geocoder = null;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById('map'));
map.setCenter(new GLatLng(50, 5), 3);
map.addControl(new GSmallMapControl());
geocoder = new GClientGeocoder();
}
}
function getLatLng(point) {
var matchll = /\(([-.\d]*), ([-.\d]*)/.exec( point );
if (matchll) {
var lat = parseFloat( matchll[1] );
var lon = parseFloat( matchll[2] );
lat = lat.toFixed(6);
lon = lon.toFixed(6);
}
else {
var message = "Error extracting info from: " + point;
var messagRoboGEO = message;
}
return new GLatLng(lat, lon);
}
function searchPlace(place) {
if (geocoder) {
map.clearOverlays();
geocoder.getLatLng(place, function(point) {
if (!point) {
alert(place + " not found");
}
else {
var latLng = getLatLng(point);
var marker = new GMarker(point);
map.addOverlay(marker);
map.panTo(latLng);
}
});
}
}
</script>
</head>
<body onload="initialize(); searchPlace('Belarus');"
onunload="GUnload();">
<div id="map" style="width: 300px; height: 300px;"></div>
<form method="get" name="myform" action="submit-form.php"
onSubmit="
var c = map.getCenter();
document.myform.JS_LATITUDE.value = c.lat();
document.myform.JS_LONGITUDE.value = c.lng();
">
<input type="hidden" name="JS_LATITUDE" value="">
<input type="hidden" name="JS_LONGITUDE" value="">
<input type="submit" value="submit">
</form>
</body>
</html>
-----------------------------------------------------

I have put a demo for you here:
http://216.92.131.147/dotserv/dotinternet/temp/form.htm

Hope this helps,
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top