[member=Locke] has been a great asset to the Dream.In.Code community, and an extremely helpful Mentor so we have decided that he should now be a Moderator. So please congratulate [member=Locke] on his promotion to Moderator.
Congrats, well deserved ” />
<div>
<a onclick=)
Go here to read the rest:
New Moderator => Locke in Dream.in.code News
[b]Put Your Company On the Map![/b]
[img]http://vhirsch.com/blog/wp-content/uploads/2009/09/Google-maps_logo.gif[/img]
Challenge submitted by [member=arthurakay]
[b]Challenge:[/b] Use the Google Maps API to create an interactive map or mashup.
The Google Maps API has been around for a few years and is one of the more frequently used APIs offered by Google. The benefits of using the Google Maps API are obvious: it's free, simple to use, and (most importantly) visually impressive. In order to use the Google Maps API, you only need a basic understanding of HTML, CSS and JavaScript – so almost anyone involved in web development can find ways to use it!
[b]Ideas:[/b]
- Mark Your House
- Include your Avatar in your marker
- Create custom markers
[b]Ideas for Advanced Users:[/b]
– try adding the various map overlays (Traffic, StreetView, etc.)
– explore the GMap2() class methods (enableDoubleClickZoom, enableGoogleBar, etc.)
– try adding more than one location and marker
[b]Example:[/b] Adding a map to your website.
[code]
[/code]
In the example above, you will see that we create a 500×500 pixel map that has centered on the White House.
We use the JavaScript method getElementById() to locate the DIV element where the map will be rendered. We then provide the Google Maps API with the appropriate address for our map location, and finally place a marker on the map with an info window listing our company for the world to see.
To build your own map you need to do two things:
(1) you need to get your own API “key” [url=http://code.google.com/apis/maps/signup.html]here[/url] (If you're just testing this out on a file:// or localhost address, you don't need a key), replacing the “XXXXXXXXXX” in my example
(2) you need to replace the White House address with your own
[i](Note: Be sure to use the onload() and onunload() event handlers on the BODY tag – the map won't work correctly without them!)[/i]
[b]Resources:[/b]
– Google Maps API: [url="http://code.google.com/apis/maps/"]http://code.google.com/apis/maps/[/url]
View original post here:
Week #9 Challenge: Google Maps API in 52 Weeks Of Code