For my AP Computer Science class, we can do anything we want for our final project and I was thinking about doing something in web design. In my Marine Ecology class we are learning about fish right now and obviously the topic of overfishing is coming up a lot. I was thinking maybe it would be cool to make a website that uses the Google Maps API to keep a database of restaurants that people would give grades to based on how sustainable the fish on their menu is. Basically a place to check what restaurants you should be eating at if you care at all about the ocean. I know html, css, and JavaScript pretty well. Anyways, I was just wondering if anyone has advice. If anyone knows how hard that would be. Or if anyone knows any good resources. I've been reading the Google Maps API and searching for tutorials but I figured it wouldn't hurt asking here too.

Thanks in advance

  • And your design related question is? Nathan Duran over 6 years ago
  • "I was just wondering if anyone has advice. If anyone knows how hard that would be. Or if anyone knows any good resources." Basically can someone tell me how hard doing something like that would be. Or, even better, help me start with some sort of resource. I guess it's not a design related question, but it's not out of the realm of this site. Michael Gates over 6 years ago

1 answer

0
points
This was chosen as the best answer

Your back-end is obvious: You have a database with restaurant names and addresses, their map coordinates and the ratings. Choice of database and server processing language is totally up to you, although a framework (e.g. codeigniter, cake, rails) would speed up development if you are familiar with it.

Lets assume you want this to scale to possibly thousands of restaurants - so you can't send google your entire database with the page request as you might if you have 10 or fewer locations. For the initial page load, you simply draw the map, with some initial location and scale. A script sent with the page gets the coordinate bounds from the map object and sends them to the server via xmlhttprequest. The server extracts all the restaurants within those bounds and sends their details back formatted in xml. Your page script passes them to the map object via google API calls. This script process is fired on page launch (once the google map is ready) and every time the user pans or zooms the map. You will probably find that most of the javascript libraries (jquery, mootools, prototype etc.) now have google map modules and all the pieces you need to build this.

that's the theory (although my actual experience with google API stops at the specifying a few points in the page load stage).

Answered over 6 years ago by Richard Grevers
  • Thank you. It sounded intimidating at first, but I've been doing some research and it seems possible. Does anybody have a suggestion on where to start. Michael Gates over 6 years ago