Google Maps - How do I efficiently create a polygon with many points?

Question

I need a polygon for every German state. I go all the GeoPoints in one JavaScript-file but the file is because of the amout of points about 4MB. I've been googling and thinking about this problem all day but couldn't figure out a solution...

How can I use Google Maps polygons without forcing the user to download a huge js-file with the coordinates?

Thanks! Ron

Answer 1

You can encode the polygon points to vastly reduce the size of the javascript file. To do this, you must include the geometry library.

https://developers.google.com/maps/documentation/javascript/reference#encoding

https://developers.google.com/maps/documentation/javascript/geometry#Encoding

Answer 2

One option is to use a FusionTablesLayer to display the polygons. They are available in the Natural Earth data set that is publicly available.

Example

You could do the same with your points and a KmlLayer if you convert your data to KML.

Answer 3

Well... somehow the points have to get to the user. You could think of the following solutions to reduce the data usage:

• Use different polygons for different zoom levels. For example zoomed out you won't need the full details.
• only send parts of your polygon back to the user. You can for example send the viewport coordinates to an AJAX script. This one queries your database and/or shapefile and only returns the polygon parts that are visible in the user's viewport
• preprocess tiles. If you can generate images from your shape, you can overlay these on Google Maps.