LAURENCE MORONEY: Hi, and welcome to this episode
of Geocast, where we walk you through what you can
do with the Google Maps APIs.
[MUSIC PLAYING]
I'm Laurence Maroney, and in today's episode,
I'm going to talk about one of my favorite parts of the Google
Maps APIs--
the ability to draw on a map with polygons and polylines,
and the new ways that you can style them.
If you aren't already familiar with polygons and polylines,
they're very useful tools to help make your maps work better
for your users.
They allow you to draw shapes on a map
so that you can delineate areas.
So, for example, maybe you want to show
the route of your walkabout in the Australian outback.
You can do that by drawing a polyline
between different geographic points.
Here you can see my desired one from Melbourne to Darwin
through both Adelaide and Perth.
That's a long walk and a bit of a swim, too.
Or maybe you want to play a game on a map
with a square showing an area of interest.
You can do that by drawing a polygon around the area,
like here, where I've defined the boundaries for the world's
biggest game of hide and seek.
In this video, I'll show you how to style these.
If you're interested in custom styling beyond your polys,
we have a video for that, too, and there's a link
to it in the description below.
There are lots of options, including stroke patterns
for outlines, such as dashed, dotted, or mixed, all of which
can be defined the way that you want
to give your users the best possible experience.
You can set different ends for your line,
including having rounded ends, [? butt ?] ends,
and square ends, or indeed a custom end,
like the arrow shown here.
And there's a whole lot more that you
can do, such as line weight and being able to set
the color of lines and fills.
In this example, I have a polyline
which shows my desired walkabout of Australia.
I'm going to zoom into the lovely city of Perth,
and you'll see where my line takes a turn at a bus stop.
I can now customize the color of the line,
its alpha transparency, its width, how the segments join
together, such as having a bevel or rounded corners,
as well as the pattern for the line.
Here are some examples that are built into the sample app,
but you can customize your own.
Polygons are similar.
Let's take a look.
Here you can see my map of the boundaries
for the world's biggest ever game of hide and seek.
It's a polygon with a couple of holes for no go areas.
Eh, lots of dingos there, apparently.
And it's a polygon which can be filled,
and its color can be changed, as can its opacity or alpha.
The weight of the stroke outlining the polygon
can be changed, as can its color and opacity.
If I go to one of the corners, we
can look at the stroke joint.
The joint can be the default, or it could be beveled or rounded.
You can see the default now.
But I can change it to be beveled or rounded,
which really shows up nicely in a contrasting color.
Like with the polygon, the stroke pattern can also be set,
but you aren't limited to these.
You can define your own, and you can
see what some of the options are, like dashed, dotted,
or mixed.
And, of course, changing the weight of the stroke
will impact how these look at different zoom levels.
But wait, there's more!
Not only can you style your polys,
you can also attach custom data to them.
You're probably familiar with custom data being attached
to markers, but now you can put it on polygons, polylines,
circles, and ground overlays.
It's as easy as setting a tag on your shape,
and then in the OnClickListener, you
can read it back and do something with it.
Here's a simple example of a toast.
And here's what it will look like at runtime
where, if someone is using my app,
and they don't know what that polygon is,
a simple click will show them that it's my hide
and seek boundary.
So that's a quick taste of some of the great styling
features found in polygons, polylines, and other shapes
in Google Maps.
We hope you enjoyed this Geocast and can't wait
to see what you build with it.
You can learn more about these features and a whole lot more
on the Google Maps Developer site.
Go check it out.
Don't forget to hit that Subscribe button.
[MUSIC PLAYING]