How to let the user define a region? - ios

I'd like to let the user define a region on a map. The region will be represented by a circle defined by a center and its radius.
Here is a picture of the result I'd like to have :
radius: I want the radius to be define with a small circle that the user will drag to set the radius size (and I'd like to be able to draw a dashed line between the center and the circle as well as showing the distance).
center I want to set the center of the map by letting the user drag the map behind to move the red pin to the desired new center.
I know how to get the blue circle, how to add a gesture to get the new radius and to redraw a circle at run time. What I don't know is how to draw dashed line, small black circle and display / update text inside the MKMapView.
Also, I'm completely lost when it's about setting the center. How can I drag the map around by letting all this object (blue circle, red pin center, dashed line, ...) not moving ?
Should I completely forget about MKMapView and draw everything above it in a UIView and then get coordinate by mapping fake touch on MKMapView ?

Related

circular dial using small small buttons in swift

I want to create a circular dial in swift. The entire circle is divided into images and I want to place those images to create a circle. Each image is clickable so that one image placed in centre of the arch could get change.
So I need to create circle using buttons in swift. Please note that I don't want to create a circular button, I want to create circle using button. Something like what is done in below link using labels.
Draw text along circular path in Swift for iOS
Suppose we have n images to arrange around the circumference of a circle of radius r. The circle is 2π radians, so use polar coordinates from the center of the circle to find the points on the circumference at angles that are multiples of 2π/n. Now center the images (buttons) at those points.

Programmatically positioning views in a circle

I'm wanting to have pre-placed circles orbiting a middle circle when a button is pressed. For example, one middle circle, 5 circles evenly spaced in a circle around the middle circle, and then a button is pressed and they start to orbit around.
I'm using a BezierPath and keyframe animation to make a single circle orbit around the middle one. I also understand how to add in more circles and make them start at different starting degrees in the animation.
What I don't understand is how to pre-place the circles in the view before the animation has started. The animation isn't running until a button has been pressed, so the orbiting circles need to be at their "starting locations" before the animation starts, ie:
let circlePath = UIBezierPath(arcCenter: center, radius: 100, startAngle: 360 / 3, endAngle:CGFloat(M_PI)*2, clockwise: true)
the startAngles for each circles would need to be where they already are on the screen before the animation starts.
I can't place the views in the storyboard because I don't see any ways to perfectly set the circles at the different degrees around the circle.
What I'm looking for would be something like using the degrees on the circle path and locating that CGPoint in the superview so I can set the center of my orbiting views on that point. So saying something like :
For the view I want 1/5th of the way on the orbiting circle, grab the CGPoint that is 360/72 and then set the circle.center to whatever that point is.
I don't know if that's possible? If not what would be another approach to this?

MapKit MKCircle Change Radius on Zoom Level

I'm trying to create an MKCircle overlay on a map, however I would like the size of the circle on the screen to remain constant as the user zooms.
So as the user zooms in, the radius gets smaller and as the user zooms out, the radius gets larger.
I'm working in Swift 3. Is there a specific MapKit method I should be using to accomplish this? I know there is an option to use an image of a circle as an annotation, however I want to dynamically change the color of the circle.
In other words, I want the MKCircle to scale the same way an MKPolyline scales as you zoom in and out
So as the user zooms in, the radius gets smaller and as the user zooms out, the radius gets larger
An MKCircle would presumably be part of an overlay (MKOverlay). An overlay works by simulating drawing on the earth itself. Thus, the drawing changes with the zoom level.
So if you don't want that to happen, don't use an MKOverlay. You could, for example, just make a normal view that displays a circle and lay it in front of the map view. Or you could use an annotation instead (MKAnnotation); an annotation's image does not change size as the map is zoomed.

Bottom of Mapbox annotation marker pin does not sit on coordinates

I'm finding that any annotation image marker that is above some undefined size does not align the bottom of the marker to the coordinates. I've been unable to locate any documentation on it. Why is this and can it be fixed?
The coordinates are for the middle of Manhattan, New York City. Note how the green border sits well into the ocean. The coordinates are definitely right. When I use a different smaller image the annotation sits correctly and when I zoom in it sits correctly. But at anything above a 10.0 zoom level it does not sit correctly.
The coordinate will align with the center of the custom image. Since there currently isn't a way to specify a custom offset, you will need an image with its bottom 50% empty so that its center aligns with the coordinate on the map when placed.

MKCircle overlay inverted

I've found this post how to draw circle overlay around location
Draw a circle of 1000m radius around users location in MKMapView
I'm able to set some color, or transparency or whatever for overlay.
but I'd like to do the same for rest of the map area.
F.e outside circle overlay sort of "terra incognita"
One possible solution in my mind is:
get circle coordinates, radius
create UIView overlay above mapView with shadow and blur radius respectively to mapView circle
simply saying I'd like to have something like this:
Any ideas how to achieve this?
I think you're thinking right. Howbeit, for make a blur background u need make screenshot and calculate blur with library GPUImage for example.

Resources