| Please spread the word if you like this content! |
|
|
|
|
| |
Greetings.
I’ve been messing around with the Google Maps API v.3 for a client of mine. I figure I would share my initial findings:
The “app” is ASP.NET 3.5, but really it’s a bunch of auto-generated JavaScript. The big map layout has a good 100+ markers placed designating various Acme Distribution Centers (I had just watched some Looney Tunes…). When you select a state from the dropdown, the map will center and zoom in on that state, and the Acme Distribution Centers for that state will be listed on the right (actually the google.maps.Geocoder JSON result is displayed for each marker in the state selected; I’ll do the address later :) ):
Clicking a marker zooms in on that marker in google.maps.MapTypeId.HYBRID display mode, and puts the google.maps.Geocoder JSON result on the bottom:
You can get the project here. As I said eariler, it’s 99% auto-generated JavaScript with a little ASP.NET on top. Here’s a dump of the generated JavaScript.
I won’t lie to you: I’m really not sure I’m using the API properly, yet. In particular, I created an array of objects that associates a google.maps.Marker instance with a hash of the name of the state it’s in. Then when you select a state in the dropdown, the option’s value – the hash of the state’s name - is used to select those google.maps.Markers from that array that “reside” in that state. I’m sure the API has a built-in way of handling this, but like I said, this is my first stab at this.
Before you think I broke something or whatever, I’ve purposely “fixed” the map and made it so it does not zoom with the mouse wheel. This is easy to change. Just look for where I’m setting the MapOptions when creating the google.maps.Map object.
Have fun with the code. The online documentation is good, as are the code samples. I’ll keep posting as I garner new aspects of the API. And please comment for other users if you have suggestions, et al.
~ZagNut
posted @ Saturday, September 04, 2010 10:08 PM