We've just added Polylines and Polygons to Maps API v3. These allow you to draw lines or filled regions on the map, specify stroke and fill styles, and handle events. They work in all supported browsers.
We've also made a few improvements from Polylines and Polygons in Maps API v2.
Adding a polyline or polygon to a map is easy, as shown in this snippet from the documentation:
var flightPlanCoordinates = [ new google.maps.LatLng(37.772323, -122.214897), new google.maps.LatLng(21.291982, -157.821856), new google.maps.LatLng(-18.142599, 178.431), new google.maps.LatLng(-27.46758, 153.027892) ]; var flightPath = new google.maps.Polyline({ path: flightPlanCoordinates, strokeColor: "#FF0000", strokeOpacity: 1.0, strokeWeight: 2 }); flightPath.setMap(map);
We wanted to launch early and get feedback, so there are still some features to come:
'mouseover'
That said, here's a simple demo of polygon editing to show what you can do.
As always, please provide feedback in the Google Maps JS API v3 Group.
Converting GIS Vector Data to KML: This tutorial walks you through the basics of converting GIS vector data to KML using the OGR open source library.
Creating super-overlays with gdal2tiles: This tutorial walks you through the basics of creating a super-overlay, a set of ground overlays that use region-based NetworkLinks, using the open source gdal2tiles utility.
And of course, if you want to learn more about these utilites or other Google Geo APIs, come to our San Francisco hackathon!
Posted by Mano Marks, Geo APIs team
Hi everyone, my name is Masashi Katsumata. I'm a Maps API expert in Japan. I love playing around with the Maps APIs, and I share everything I learn on my website for Japanese speaking developers. But don't worry, English speakers - I also like to create open-source extensions for the utility library, and share them with you here.
Today, I'm annoucing my newest contribution: SnapshotControl. This control makes it easy to generate an image "snapshot" of your interactive map, using the recently released Google Static Maps API v2.
The default behavior of the control is to add a button on the map, and that button pops up a snapshot when clicked. However, the control can be hidden and the generated snapshot URLs can be programmatically retrieved, so that the library may be used in a more flexible manner. Check out this demo to play with different options and see the generated URL.
This control also knows how to encode polylines, using the Douglas-Peucker algorithm, which means that it can be used on maps with very long paths. For example, the control can create static maps for driving direction routes, as shown in the this demo.
To learn more about this control, check out the reference and more examples. Enjoy!
Let me introduce myself: I'm Billy Rutledge, a manager, tech-lead and advocate for Google Developer Relations. As part of the "Our Favorites" blog series, I want to highlight a few web sites that have done a great job implementing the Google Maps APIs to help people like you and me spend more time under the sun.
It also supports input/export of common GPS file formats. They offer a native mobile phone app that captures GPS points and uploads the data to the site for you.
Additionally, they let you create your own tracks by placing points on the map and rendering them as polylines.
The mobile apps are simple and easy to use, helping you monitor and save your tracks, and then upload them over the air to GPSies where they are visible in your tracks list.
The visualization is a robust JavaScript Maps API implementation that overlays a polyline across the GPS points. Nice additions include mile marker points (also in metric), integrated altitude charts that follow the polyline with mouse-move events, and integration of the DragZoomControl for easier zooming into an area of interest.
Stuart and Jenna, the outdoor enthusiasts who run this terrific site, go the extra mile to include enhanced content like area facts, photography, nearby POI, and location web sites.
Today, they've made this much easier. A free registration gets you access to browse the latest Topo! maps which uses our JavaScript Maps API as a framework to explore their custom map tiles.
My name is Wolfgang Pichler. I have been developing with the Google Maps JS API for a few years now, posting in the forums and publishing my various experiments for others to learn from.
When a user right-clicks on Google Maps, a context menu appears with options like getting directions, zooming in, or finding the address of the center point (reverse geocoding). Since I wanted this helpful feature in my own maps, and the core API does not provide it, I decided to implement a fully open-source version and release it in the utility library: ContextMenuControl.
This control includes all the same items as the native Google Maps control, but I've implemented the directions functionality in a different way. Instead of requiring the developer to provide a panel and inserting the directions steps there, I create infowindows that the user can step through. Now, any developer can use this control and not worry about having to allocate space on their page for the directions steps. The directions functionality also includes the ability to add, remove, and drag points, so that the user can easily customize their query.
The result is a control that's easy for users and easy for developers, and is probably the fastest way to add reverse geocoding and directions functionality to your map (especially if it's a small map). Just include the script tag for the source code, insert this line in your map init function, and you'll get a right-click menu like the screenshot shows below:
map.addControl(new ContextMenuControl());
For more information, read through the reference and developer's guide. For other open-source extensions that can enhance your mashup, check out the utility library. Enjoy giving your users the power of right-click!
Calling all Bay Area coders! We've just finalized another hackathon for late September! On September 24th, 2009, from 1:30 to 8, Google will host a hackathon for our Geo APIs in our San Francisco office. At the hackathon, Google engineers will give one or two API overview presentations and then will be on hand to answer all your geo related questions. You can work on suggested codelabs, or just bring your own project and we'll lend you a hand.
The hackathon will cover the following APIs:
Space is limited, so register now! And remember, this will be a code-heavy event, so bring your laptop and come ready to code!
Posted by Roman Nurik, Geo APIs team
Obviously, we love when we see developers using the Maps API to create sophisticated and innovative applications. It makes us feel good that we put time into creating our APIs, and it excites us that there are so many creative developers in the world. But, we don't always wear our heart on our sleeve, and share our love for great uses of the APIs with everyone. So, we're initiating a series of blog posts about our favorite maps, and this is the first in the lot. We'll also use this series as a way to introduce you to other members of our ever expanding team here. You likely already know me, as I'm something of a regular on this blog - getting started 3 years ago with a post showing how to use the then-just-introduced GPolygon (man, that makes me feel old). So, I'll go straight into my favorites.
I was once asked what I thought the next frontier in maps mashups was, and I responded: "time". Why? It's tricky figuring out how to display layers of data on top of a map, but it's even trickier to squeeze in one more dimension and display time-based data, and I admire those developers that take on the challenge. Here are some examples:
As you can see, there are a lot of ways to show time-based data on maps, and each of them suit different needs. The important thing is that developers are pushing the envelope and experimenting with different interfaces, and putting it out there for all of us to enjoy. For more examples like these, check out the "Timeline" label in the Google Maps Mania directory. Tune in next week to hear about more of our favorites! :)
The Google Maps API v3, our new lightweight version of the JavaScript API, has been out for a few months now, and we want to help developers use this API with server-side scripting and databases. So, we've added an articles section to the documentation with three new articles:
We've also added links to articles from developer Gabriel Svennerberg, who has started a series on Maps API v3 and is in the process of writing a book.
If you have written an article about using any of our APIs, please let us know using this form. We love to see developers adding knowledge to the community.
Give us feedback in our Product Forums.