Get latitude and longitude from Routeboxer?

1,805 views
Skip to first unread message

KP

unread,
Feb 3, 2013, 3:47:05 PM2/3/13
to google-map...@googlegroups.com

In my Ruby on Rails website, I have a tool that lets users create a driving route with Google Maps API V3. My goal is to give the user an option of clicking a "Show Nearby Points-of-Interest" checkbox before loading the map. If he does, I want the map to show POIs along the route.

I've implemented RouteBoxer, which I believe is my best option for finding Points of Interest along the route. Routeboxer is working for me; it draws boxes around any route I create. This is where I'm stuck, however. I've just got my route and a bunch of boxes on the screen. How can I actually get the latitude and longitude bounds from RouteBoxer? 

I'm fairly new to both Ruby and Google Maps API V3, so sorry if I'm blowing past an obvious way of doing this. Any detail or code you can provide / link to would be fantastic! Thanks again for your time!

Barry Hunter

unread,
Feb 3, 2013, 4:38:35 PM2/3/13
to google-maps-js-api-v3
The website for routeboxer
http://google-maps-utility-library-v3.googlecode.com/svn/trunk/routeboxer/docs/examples.html
has a pretty good example.

var boxes = routeBoxer.box(path, distance);

for (var i = 0; i < boxes.length; i++) {
var bounds = boxes[i];
// Perform search over this bounds
}

The "bounds" variable is now a LatLongBounds object
https://developers.google.com/maps/documentation/javascript/reference#LatLngBounds
can get the coordinates from that.

If you've just coped the example, you probably have a 'drawBoxes'
which you want to convert from just plotting a rectangle, to doing a
search.



There is a prototype I built to play with the routeboxer class,
http://ww2.scenic-tours.co.uk/serve.php?t=WoNlXJvolbMVJL5405ot8OhtaNhlXhwONXM
(can just click the "Submit" button top right to see it in action)
But I suspect wading though the code of a full application might just
confuse you further, than starting from the basics. However if you do
go wading, the getImages(bounds) function shows the basics, accept
some bounds, and send them to the server via ajax.
> --
> You received this message because you are subscribed to the Google Groups
> "Google Maps JavaScript API v3" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to google-maps-js-a...@googlegroups.com.
> To post to this group, send email to google-map...@googlegroups.com.
> Visit this group at
> http://groups.google.com/group/google-maps-js-api-v3?hl=en.
> For more options, visit https://groups.google.com/groups/opt_out.
>
>

KP

unread,
Feb 5, 2013, 1:42:20 PM2/5/13
to google-map...@googlegroups.com
Thanks, Barry! I really appreciate your response.

So, do I just include this in my javascript:

getNorthEast(bounds);
getSouthWest(bounds);

below my original code:

// Box the overview path of the first route
var path = response.routes[0].overview_path;
var boxes = routeBoxer.box(path, rdistance);
clearBoxes();
drawBoxes(boxes);
for (var i = 0; i < boxes.length; i++) {
var bounds = boxes[i];
// Perform search over this bounds 
}

//Get the Lat and Long of the RouteBoxer

var northeast = getNorthEast(bounds);
var southwest = getSouthWest(bounds);
var coordinatesnortheast = northeast.split(',');
var lateast = coords[0];
var longnorth = coords[1];
var coordinatessouthwest = southwest.split(',');
var latwest = coords[0];
var longsouth = coords[1];

My goal is to get the four points that encompass my route so that I can find points of interest nearby.

Thanks!
Kevin

Barry Hunter

unread,
Feb 5, 2013, 1:56:21 PM2/5/13
to google-maps-js-api-v3
That should work, but it would be more robust to do - you avoid a
messy conversion to string.

var northeast = bounds.getNorthEast();
var southwest = bounds.getSouthWest();
var lateast = northeast.lat();
var longnorth = northeast.lng();
var latwest = southwest.lat();
var longsouth = southwest.lng();

KP

unread,
Feb 5, 2013, 2:42:33 PM2/5/13
to google-map...@googlegroups.com
Awesome, Barry. Thanks for cleaning it up. I've included the below code just under the // Perform search over this bounds, as part of my 

function calcRoute() {

I wanted to see if this was working. So, at the very end of my script, I added:

document.getElementById("south").innerHTML = longsouth;
document.getElementById("west").innerHTML = latwest;

and I added to the body of my page:

<div id="south"></div><br> 
<div id="west"></div> 

However, after I create a route, no information is written to these divs. I just want to make sure that I'm getting the lat and long from Routeboxer before proceeding with the next step. Am I doing something wrong?

Again, thanks for all your help!

- Kevin

Barry Hunter

unread,
Feb 5, 2013, 2:46:10 PM2/5/13
to google-maps-js-api-v3
 as part of my 

function calcRoute() {

I wanted to see if this was working. So, at the very end of my script, I added:

document.getElementById("south").innerHTML = longsouth;
document.getElementById("west").innerHTML = latwest;


Sounds like a scope issue. You trying to use the variables when they have gone out of scope. Can only 'use' them inside the loop. 
 

KP

unread,
Feb 6, 2013, 8:28:53 PM2/6/13
to google-map...@googlegroups.com
Okay! All I had to do was include the "document" code directly underneath the "varsouth" code, as you suggested. Now, the lats and longs appear on the webpage. Thanks so much!

I've been reviewing the site you provided, but I'm having trouble making the leap to my next phase: querying a MySQL database with these lats and longs to show points of interest in my map. 

I'm using Ruby on Rails, and I know that I can hard-code a latitude and longitude to find locations by doing this in my controller:

@nearbylocations = Masterlocation.find(:all, :conditions => ["latitude > 25 AND latitude < 30"], :order => ['nickname asc'])

Can you provide a link to a tutorial or a suggestion of how I can get where I am now to actually including these POIs in the map? The "Using PHP/MySQL with Google Maps" is good, but it's difficult to make the leap from that code to doing it in Rails. 

I really appreciate the help, Barry!

- Kevin

Barry Hunter

unread,
Feb 7, 2013, 7:28:35 AM2/7/13
to google-maps-js-api-v3
I don't know Ruby, but maybe the missing link is you need to use a
'AJAX' style programming model
http://en.wikipedia.org/wiki/Ajax_(programming)

Maybe:
http://guides.rubyonrails.org/ajax_on_rails.html
?

The actual database querying happens in a server script accessed from
the webpage. The demo I showed queries an API from the Geograph
website (the host of the images being displayed) - so you needs your
server to expose a similar API.

Source for one, I made a long time ago...
http://nearby.org.uk/google/googleMaps.xml.phps

KP

unread,
Feb 7, 2013, 9:37:01 AM2/7/13
to google-map...@googlegroups.com
Thanks, Barry. Heading out of town for a week, but will explore and report back. I really appreciate it.


On Thursday, February 7, 2013 7:28:35 AM UTC-5, barryhunter wrote:
I don't know Ruby, but maybe the missing link is you need to use a
'AJAX' style programming model
http://en.wikipedia.org/wiki/Ajax_(programming)

Maybe:
http://guides.rubyonrails.org/ajax_on_rails.html
?

The actual database querying happens in a server script accessed from
the webpage. The demo I showed queries an API from the Geograph
website (the host of the images being displayed) - so you needs your
server to expose a similar API.

Source for one, I made a long time ago...
http://nearby.org.uk/google/googleMaps.xml.phps

Barry Hunter

unread,
Mar 26, 2013, 3:43:10 PM3/26/13
to google-maps-js-api-v3
You have the drawBoxes(boxes) funciton that takes the array of boxes - and in this case draws them on the map 

The code that AP posted, he put in a for loop like that function - looping over the boxes and then decomposing the coordiantes of the box. 

So you can eitehr modify that function, or duplicate it and make another function say searchBoxes(boxes) that uses the same sort of loop, and does something with the box coordinates (such as forwarding them to a server ajax style) 


On Tue, Mar 26, 2013 at 7:07 PM, Garrett Dow <garre...@gmail.com> wrote:
I am trying to follow along here, but don't understand where you moved the code to. I don't see "varsouth" anywhere. Can you post your code? Here is mine...trying to follow along:
 
      // Perform search over this bounds
  
    }
   
   
//Get the Lat and Long of the RouteBoxer
getNorthEast(bounds);
getSouthWest(bounds);
var northeast = bounds.getNorthEast();
var southwest = bounds.getSouthWest();
var lateast = northeast.lat();
var longnorth = northeast.lng();
var latwest = southwest.lat();
var longsouth = southwest.lng();
 
   
--
Reply all
Reply to author
Forward
0 new messages