We've just released an update to our Native Maps ANE, with some more features and some slight changes to the API.
Read on for details about the new version, or head on over to our Native Extensions page for more info.
Firstly, we'll go over the new features.
Polygon and Polyline Overlays
We've added the capability to draw custom line and shape overlays on the map. This is useful for creating your own custom items or shape representations in the map. You'll notice two new classes in the ANE API, Polyline and Polygon.
Polygon objects also have the capability to contain "holes", or gaps in the shape, which allow you to create more complex shapes if required.
Polylines and Polygons contain options for stroke colour, stroke width, opacity, Z index, fillColour (for Polygons only) and on Android, the option to use geodesic lines (lines that follow the Earth's surface) instead of lines drawn with the mercator projection.
Creating a polyline is as simple as:
// Add a red line roughly from Melbourne to Sydney var polyline:Polyline = new Polyline(2, 0xFFFF000); polyline.addPoint( new LatLng(-37, 144) ); polyline.addPoint( new LatLng(-33.8, 151.2) ); NativeMaps.service.addPolyline(polyline);
For a Polygon, the interface is similar:
// Add a box with a blue stroke and semi-transparent red fill var polygon:Polygon = new Polygon(2, 0xFF0000FF, 0xAAFF0000); polygon.addPoint(new LatLng(-25, 133.0)); polygon.addPoint(new LatLng(-34, 133.0)); polygon.addPoint(new LatLng(-34, 147.0)); polygon.addPoint(new LatLng(-25, 147.0)); polygon.addPoint(new LatLng(-25, 133.0)); NativeMaps.service.addPolygon(polygon);
Note that for polygons, adding a final point the same as the origin is optional. If you don't, the polygon will be automatically completed so that it is an enclosed shape anyway.
To add a hole to a polygon, you simply create another Polygon object and pass it to the addHole() method.
// Add a hole to a polygon object. var hole:Polygon = new Polygon(); hole.addPoint(new LatLng(-27, 135.0)); hole.addPoint(new LatLng(-32, 135.0)); hole.addPoint(new LatLng(-32, 145.0)); hole.addPoint(new LatLng(-27, 145.0)); hole.addPoint(new LatLng(-27, 135.0)); polygon.addHole( hole );
Note, polygons used as holes will ignore any properties other than their LatLng points (i.e. colour, stroke, etc). Holes must be enclosed completely within their parent polygon, and cannot overlap any other holes defined.
The first version of the ANE included a "zoomToSpan" method for setting the visible bounding area of the map. This method has been removed from the API, and replaced with a more full-featured implementation using the new LatLngBounds class.
The LatLngBounds class allows you to specify regions and contains helpful methods.
Setting the bounding area of the map is now accomplished like so:
var bounds:LatLngBounds = new LatLngBounds( new LatLng(-39, 111), new LatLng(-12, 160) ); NativeMaps.service.setBounds( bounds, 10, true );
You can also use the NativeMaps.service.getBounds() method to return the current LatLngBounds object for the map.
Other additions to the API in this version include:
- NativeMapEvent.MAP_ZOOM_CHANGED event added
- showMarker() method added which allows you to show or hide a specific marker
- Duration parameter added for setZoom() on Android, specifies the animation length of the zoom
- Added methods for Android to get and set the "tilt" and "bearing" properties of the map