0

I am new to IOS programming.

I know how to draw MKCirlcle on map with given coordinates and radius. But, I want to draw a circle like shape but not exactly circle. I want to draw an ellipse like shape on map around MKRoute. This shape will be starting at location one mile before user location and end at location one mile after destination. Height of ellipse will be two miles. One mile above the route and one mile below. This shape should proceed with route direction.

Here is the required shape.

https://i.stack.imgur.com/18QyV.png

In my home controller , I am doing this.

    - (MKOverlayRenderer *)mapView:(MKMapView *)mapView rendererForOverlay:(id < MKOverlay >)overlay

    {
        double ppm  = MKMapPointsPerMeterAtLatitude(RouteDisplayed.polyline.coordinate.latitude);


        CustomOverlayRenderer *renderer = [[CustomOverlayRenderer
                                        alloc] initWithOverlay:overlay];


        renderer.ppm =[NSNumber numberWithDouble:ppm];

        renderer.strokeColor = [UIColor colorWithRed:0.0 green:1.0 blue:0.0 alpha:.3];

         return renderer;

   }

And below is my CustomOverlayRenderer.h extending from MKPolylineRenderer.

     #import <MapKit/MapKit.h>

     @interface CustomOverlayRenderer : MKPolylineRenderer

    - (void)drawMapRect:(MKMapRect)mapRect
           zoomScale:(MKZoomScale)zoomScale
            inContext:(CGContextRef)context;

    @property(nonatomic, strong) NSNumber * ppm;


    @end

And below in CustomOverleyRenderer.m

    @implementation CustomOverlayRenderer

    - (void)drawMapRect:(MKMapRect)mapRect
      zoomScale:(MKZoomScale)zoomScale
      inContext:(CGContextRef)context

    {

            [super drawMapRect:mapRect zoomScale:zoomScale inContext:context];

            double p = [self.ppm doubleValue];

            CGContextSetLineWidth(context, (p * 3200)/zoomScale);

    }
    @end

Hope, I explained my question well.

If there is any ambiguity, you can ask me.

Thanks in advance.

  • So you basically want to draw a slightly bigger ellipse which includes the start, stop and your whole route "inside" ? Or you want to "draw" your route with a one mile thickness ? – Templar Sep 12 '14 at 09:11
  • Your first option is exactly what I want. I want a bigger ellipse which includes the start, stop and whole route inside. – Mutee ur Rehman Oct 09 '14 at 10:41
  • @Templar I have edited the question. You can see the image using given URL. – Mutee ur Rehman Oct 09 '14 at 10:47
  • Do you mean like this: http://stackoverflow.com/questions/21970558/draw-overlapping-overlays-over-mkmapview (create a thick MKPolylineRenderer)? But if the thickness needs to be a constant and precise "two miles", you'll need to create a custom MKOverlayRenderer. Also see http://stackoverflow.com/questions/7767580/how-to-customize-mkpolylineview-to-draw-different-style-lines. –  Oct 09 '14 at 11:00
  • @Anna I dont want to create a thick MKPolylineRenderer. Actually the idea is that I want to search items that are in one mile range from route at any point on route. If I create a thick PolyLineRenderer, its thickness reduces on zoom in. – Mutee ur Rehman Oct 09 '14 at 11:25
  • @Anna Here is the idea. http://i.stack.imgur.com/q6Lwl.png Draw circles on points on route and make a boundary as shown in image provided in the question. I have tried this, but overlapping circles are causing problems. – Mutee ur Rehman Oct 09 '14 at 11:27
  • @MuteeurRehman Well, you could use a polyline with dynamic width, the easiest solution possible. Check this link : [link](http://stackoverflow.com/questions/5274164/custom-mkoverlayview-line-width) . You can subclass the overlayrenderer and define how thick, how transparent you want your view to be. – Templar Oct 09 '14 at 12:09
  • @Templar Thanks for your suggestion. But since I am new to ios development. I am not actually able to control the width even after using subclass. I am subclassing MKPolylineRenderer and overriding drawMapRect function. I am calling drawMapRect of parent class and adding the line "CGContextSetLineWidth(context, 1/zoomScale)", now I want the thickness of myPolyline in meters . In this case, polyline's width should increase on zoom in and decrease on zoom out. But this does not happening. Kindly help me some more so that I can solve my problem. – Mutee ur Rehman Nov 10 '14 at 12:28
  • @MuteeurRehman Check out this answer [link](http://stackoverflow.com/questions/5274164/custom-mkoverlayview-line-width). In your case 1 is the width of your poly (in points) at any zoom levels. For meters you'll need to convert the meter-distance to point-distance. You could use `MKMapPointsPerMeterAtLatitude` or calculate manually the point distance based on zoom level ([link](http://stackoverflow.com/questions/7395925/iphone-convert-mkmappoint-distances-to-meters). I don't really have much time now, but will try to answer later with a solution if it still doesn't work. – Templar Nov 11 '14 at 08:31
  • Thanks that your are giving your precious time. I am editing my question to show some code I tried so far. I am still not able to solve the problem. Kindly help when you will get time. – Mutee ur Rehman Nov 11 '14 at 09:54
  • You can see edited quetion now. – Mutee ur Rehman Nov 11 '14 at 10:08
  • @Templar Can you please tell me what is wrong with my approach? Or the mistake is in code, not approach? – Mutee ur Rehman Nov 25 '14 at 06:16
  • @MuteeurRehman It looks good. The only thing I forgot to mention is that you probably should update it every time the map zooms itself so you should recalculate the ppm and refresh the poly. Also, if you could upload your code somewhere I can see what's wrong with it. Sorry for no response, hard times here. – Templar Nov 25 '14 at 08:57

0 Answers0