THIS SDK ISDEPRECATED.

We rolled out a new and better SDK for you.

Shapes

Allow your users to draw shapes like circles, polygons, and polylines on your map to mark different areas on the map.

Sample use case: You are developing an app for a delivery company and need to illustrate ranges of the transportation area around different cities. What you need to do, for example, is to render circles around cities with radiuses indicating zones of deliveries. The details on the example implementation of shapes rendering are described below.

A TTMapView supports several shape overlays. These are:

  • TTCircle
  • TTPolygon
  • TTPolyline

Shape overlays are immutable i.e., once they have been created, their shapes cannot be changed ( although you may change their visibility and color). If you want to change a shape, you must remove the existing shape and replace it with a new one.

It is the responsibility of the framework user to be conscientious about performance and how many shape overlays they are using. You should use as few shapes as possible, and hide or dispose of ones that are not being displayed. See the following code examples.

Code examples:

let polygon = TTPolygon(coordinates: &coordiantes, count: UInt(pointsCount), opacity: 1, color: color, colorOutline: color)
mapView.annotationManager.add(polygon)
TTPolygon *polygon = [TTPolygon polygonWithCoordinates:coordinates count:pointsCount opacity:1 color:color colorOutline:color]
[self.mapView.annotationManager addOverlay:polygon];
let polyline = TTPolyline(coordinates: &coordiantes, count: UInt(pointsCount), opacity: 1, width: 8, color: color)
mapView.annotationManager.add(polyline)
TTPolyline *polyline = [TTPolyline polylineWithCoordinates:coordinates count:pointsCount opacity:1 width:8 color:color];
[self.mapView.annotationManager addOverlay:polyline];
let circle = TTCircle(center: TTCoordinate.AMSTERDAM(), radius: 5000, opacity: 1, width: 10, color: color, fill: true, colorOutlet: color)
mapView.annotationManager.add(circle)
TTCircle *circle = [TTCircle circleWithCenterCoordinate:[TTCoordinate AMSTERDAM] radius:5000 opacity:1 width:10 color:color fill:YES colorOutlet:color];
[self.mapView.annotationManager addOverlay:circle];

image

Circle

image

Polygon

image

Polyline

Click delegate

You can implement an observable of shape-clicked event. You can do that with the global delegate TTAnnotationDelegate for all shapes that have to be registered on TTAnnotationManager as in the following examples:

Maps SDK allows to observe a shape-selected event. There is one global delegate TTAnnotationDelegate for all shapes that has to be registered on TTAnnotationManager as follows.

mapView.annotationManager.delegate = self
self.mapView.annotationManager.delegate = self;
1func annotationManager(_: TTAnnotationManager, touchUp _: TTPolyline) {
2 // called when polyline clicked
3}
1- (void)annotationManager:(id<TTAnnotationManager>)manager touchUpPolyline:(TTPolyline *)polyline {
2 // called when polyline clicked
3}
1func annotationManager(_: TTAnnotationManager, touchUp _: TTPolygon) {
2 // called when polygon clicked
3}
1- (void)annotationManager:(id<TTAnnotationManager>)manager touchUpPolygon:(TTPolygon *)polygon {
2 // called when polygon clicked
3}
1func annotationManager(_: TTAnnotationManager, touchUp _: TTCircle) {
2 // called when circle clicked
3}
1- (void)annotationManager:(id<TTAnnotationManager>)manager touchUpCircle:(TTCircle *)circle {
2 // called when circle clicked
3}