Make GMSCircle respond to tap? - ios

I am using the Google Maps API for iOS and I want to make it so when you tap on a GMSCircle it pops up a little thing I coded elsewhere. I have set the circle to "tappable" but I cannot find what I need to set or make to listen for the tap. What do I use?
CLLocationCoordinate2D circleCenter = CLLocationCoordinate2DMake(10,10);
GMSCircle *circ = [GMSCircle circleWithPosition:circleCenter
radius:10];
circ.tappable = true;
[circ setFillColor:[UIColor colorWithRed:1 green:0 blue:0 alpha:.5]];
circ.map = mapView_;

You need to use the delegate method didTapOverlay :
- (void) mapView: (GMSMapView *) mapView didTapOverlay: (GMSOverlay *) overlay
Here the parameter overlay indicates the overlay that was tapped. So you need to check if it equals circ.
EDIT : Adding details on how to check for circle within didTapOverlay
When GMSCircle is added to the map, a corresponding GMSPolygon is also created. If the circle is set as tappable, then on tapping it, the overlay passed to the didTapOverlay method is this related polygon and not the circle . So a direct comparison between the overlay and the circle is not possible. Hence as Raspu as pointed out, you can set a value in title using circ.title = and then inside didTapOverlay, you can check if overlay.title is same as circ.title. This works because the title property of the circle is within the corresponding polygon and hence will be present in the overlay parameter.

Related

How to put iOS Magnifying Glass effect on Google Maps (GMSMapKit)

How to put the UITextView texting editing Magnifying Glass on the Google Maps GMSMapView
For example I have a GMSMapView to show my current location
I want to trigger a overlay Magnifying Glass view when calling delegate methods
mapView:didChangeCameraPosition: and mapView:willMove: in GMSMapViewDelegate
The purpose is to provide an overlay zooming subView according to the user tapping coordinates (like github.com/acoomans/iOS-MagnifyingGlass did on ImageView)
Please let me know if this is possible for Google Maps for iOS or if iOS MapKit can support this kind of customization
Update #2: mapView.addSubView(mapSubView) works now. But it pollutes the Main GMSMapView
Update #1: I tried mapView.addSubView, it seems does not work for GMSMapView although inherited from UIView
The intention of below code snippet is to retrieve user's touch point at the map and converts it into CGPoint for creating a second GMSMapView
func mapView(mapView: GMSMapView!, didTapAtCoordinate coordinate: CLLocationCoordinate2D) {
println("Tapping at (\(coordinate.latitude), \(coordinate.longitude))")
// 1. retrieve the user touch position as CLLocationCoordinate2D
let cameraPosition = GMSCameraPosition.cameraWithLatitude(coordinate.latitude, longitude: coordinate.longitude, zoom: 20)
// 2. convert it into CGPoint
let screenTouchPoints = mapView.projection.pointForCoordinate(coordinate)
// 3. set the CGRect for init the mapSubView
let frame = CGRectMake(screenTouchPoints.x, screenTouchPoints.y, 100, 100)
mapSubView = GMSMapView.mapWithFrame(frame, camera: cameraPosition)
// 4. Finally add to the main Map View
mapView.addSubview(mapSubView)
}
It seems plausible with a GMSMapView. Maybe have a second GMSMapView on top of the original(high corner radius to create a circle?) and animate the alpha and scale along with the zoom level within the second map. Do this whenever mapView:didChangeCameraPosition etc is called.
By taking reference to this Github Project, GMSMapView can also be magnified by putting the view hierarchy in this way:
View Controller > Magnifying View > The View want to be zoomed
The core rendering mechanism is
- (void)drawRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextTranslateCTM(context, self.frame.size.width/2, self.frame.size.height/2 );
CGContextScaleCTM(context, scale, scale);
CGContextTranslateCTM(context, -touchPoint.x, -touchPoint.y + (self.scaleAtTouchPoint? 0 : self.bounds.size.height/2));
[self.viewToMagnify.layer renderInContext:context];
}
loupe = ACLoupe()
magnifyingGlass = ACMagnifyingGlass()
magnifyingView = ACMagnifyingView(frame: self.view.frame)
magnifyingView.magnifyingGlass = loupe
magnifyingView.addSubview(Your_Subview_here)
by this method the magnifying view can capture current frame context, because Magnifying View is the container of other views so that the capturing can show the current UI situation and zoom by 1.5 times (default scale factor)

MKPolyline / MKPolylineRenderer changing color without remove it

I working around with map app, I want to ask how to change the polyline color without remove and add it again, I found this topic https://stackoverflow.com/questions/24226290/mkpolylinerenderer-change-color-without-removing-overlay in stackoverflow but this is not involve with my question, I did not touch the line, so no need to do with -[MKMapViewDelegate mapView:didSelectAnnotationView:]
So is it possible to do that?
EDIT: What I want to do is change the polyline color smoothly (by shading a color - sound like an animation) If you have any idea on how to animate this polyline please also tell me too. Thanks
Complex animations or shading/gradients will probably require creating a custom overlay renderer class.
These other answers give ideas about how to draw gradient polylines and animations will most like require a custom overlay renderer as well:
how to customize MKPolyLineView to draw different style lines
Gradient Polyline with MapKit ios
Draw CAGradient within MKPolyLineView
Apple's Breadcrumb sample app also has an example of a custom renderer which you may find useful.
However, if you just want to update the line's color (say from blue to red), then you may be able to do that as follows:
Get a reference to the MKPolyline you want to change.
Get a reference to the MKPolylineRenderer for the polyline obtained in step 1. This can be done by calling the map view's rendererForOverlay: instance method (not the same as the mapView:rendererForOverlay: delegate method.
Update the renderer's strokeColor.
Call invalidatePath on the renderer.
Not sure what you want but you may be able to "animate" the color going from blue to red by changing the color and calling invalidatePath gradually in timed steps.
Another important thing is to make sure the rendererForOverlay delegate method also uses the line's "current" color in case the map view calls the delegate method after you've changed the renderer's strokeColor directly.
Otherwise, after panning or zooming the map, the polyline's color will change back to whatever's set in the delegate method.
You could keep the line's current color in a class-level variable and use that in both the delegate method and the place where you want to change the line's color.
An alternative to a class-level variable (and probably better) is to either use the MKPolyline's title property to hold its color or a custom polyline overlay class (not renderer) with a color property.
Example:
#property (nonatomic, strong) UIColor *lineColor;
//If you need to keep track of multiple overlays,
//try using a NSMutableDictionary where the keys are the
//overlay titles and the value is the UIColor.
-(void)methodWhereYouOriginallyCreateAndAddTheOverlay
{
self.lineColor = [UIColor blueColor]; //line starts as blue
MKPolyline *pl = [MKPolyline polylineWithCoordinates:coordinates count:count];
pl.title = #"test";
[mapView addOverlay:pl];
}
-(void)methodWhereYouWantToChangeLineColor
{
self.lineColor = theNewColor;
//Get reference to MKPolyline (example assumes you have ONE overlay)...
MKPolyline *pl = [mapView.overlays objectAtIndex:0];
//Get reference to polyline's renderer...
MKPolylineRenderer *pr = (MKPolylineRenderer *)[mapView rendererForOverlay:pl];
pr.strokeColor = self.lineColor;
[pr invalidatePath];
}
-(MKOverlayRenderer *)mapView:(MKMapView *)mapView rendererForOverlay:(id<MKOverlay>)overlay
{
if ([overlay isKindOfClass:[MKPolyline class]]) {
MKPolylineRenderer *pr = [[MKPolylineRenderer alloc] initWithPolyline:overlay];
pr.strokeColor = self.lineColor;
pr.lineWidth = 5;
return pr;
}
return nil;
}
Yous hould look at MKOverlayPathRenderer method
- invalidatePath.
From the doc, it says:
Call this method when a change in the path information would require
you to recreate the overlay’s path. This method sets the path property
to nil and tells the overlay renderer to redisplay its contents.
So, at this moment, you should be able to change your drawing color.

How do i rotate an image inside a drawn polygon

I am a beginner programmer and this is my first app(I am still learning). I have overlaid a polygon onto a map view. I have set its fill color to an image because I'm trying to match an image to a satellite picture. I want to rotate it so that the polygon contents match the map. Is it possible to rotate the image? If not, is there an easier way to overlay an image onto a map view that I could use.
Here is my code:
-(MKOverlayView*)mapView:(MKMapView *)mapView viewForOverlay:(id )overlay {
MKPolygonView *polyView = [[MKPolygonView alloc] initWithOverlay:overlay];
polyView.strokeColor = [UIColor whiteColor];
polyView.fillColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"Campus-map labels.jpg"]];
return polyView;
}
Here's what I'm trying to do, if it helps:
http://i.stack.imgur.com/x53HU.jpg
The road which is circled in red should match up. I know that the polygon isn't in the right position -- this is to illustrate how the polygon needs to be rotated.
You can modify the transform property of the polyView object. For example:
polyView.transform = CGAffineTransformMakeRotation(M_PI_4);
will rotate the polygon by pi/4 radians (45 degrees), in a clockwise direction.
You might need to change the polygon's center property to get the effect you want. The center property determines the center of rotation around which the transform rotation takes place.

Geo-Fencing using Google Map in iPhone

I am trying to Geo-fence using Google Map for iPhone app.
A lot of tutorials can be found for MKMapView. But can't find for the GMSMapView.
The basic thing is how to convert the screen coordinate (x,y) to the MapCoordinate lat/lng.
Is there any API available for Google Map in iOS for that conversion?
Thanks
You can use something like this:
GMSMapView* mapView = ...;
CGPoint point = ...;
...
CLLocationCoordinate2D coordinate =
[mapView.projection coordinateForPoint: point];
UPDATE:
The comments on the projection property in GMSMapView.h are:
/**
* The GMSProjection currently used by this GMSMapView. This is a snapshot of
* the current projection, and will not automatically update when the camera
* moves. The projection may be nil while the render is not running (if the map
* is not yet part of your UI, or is part of a hidden UIViewController, or you
* have called stopRendering).
*/
#property (nonatomic, readonly) GMSProjection *projection;
Therefore you can only access the .projection property after the map has rendered. It will be nil if you try to access it during loadView or viewDidLoad.
I don't know if there is a better way to tell if the map has been rendered, but I noticed that the mapView:didChangeCameraPosition: method is called once after the map view is first displayed, and that the map's projection property is valid there.
So, in your view controller's header, add GMSMapViewDelegate:
#interface ViewController : UIViewController <GMSMapViewDelegate>
When you allocate the map view, assign the delegate:
_map = [GMSMapView mapWithFrame: CGRectMake(0, 0, width, height) camera: camera];
_map.delegate = self;
[self.view addSubview: _map];
Then add the delegate method:
- (void)mapView: (GMSMapView*)mapView
didChangeCameraPosition: (GMSCameraPosition*)position
{
CGPoint point = CGPointMake(x, y);
CLLocationCoordinate2D coordinate =
[_map.projection coordinateForPoint: point];
}
Note that mapView:didChangeCameraPosition: is called every time the user changes the camera, so you'd probably need to use a flag, so that you only do your calculations the first time mapView:didChangeCameraPosition: is called.
No need to convert x,y to lat,long.
GMSCircle *fence = [GMSCircle circleWithPosition:locationCord radius:fenceRadius];
[fence setFillColor:[UIColor colorWithRed:102.0/255 green:178.0/255 blue:255.0/255 alpha:0.3]];
[fence setZIndex:100];
[fence setMap: _map];
Add this code when you are making GMSMapView and geo fence will be shown with your location marker.

iOS: How to catch a tap event on a marker on a map that has a CALayer on top of it?

I have a mapView (RouteMe mapView) on which there are annotations (markers).
On the mapView there is a touchesEnded function on which I usually catch all events.
Some markers have an added layer on top of them.
That layer has some animation images and as much as I know this is the only way I can show these animation images on top of the markers.
The problem is that I don't know how I can intercept a touch on a marker that has that layer on top of it. When I test the hit on the touchesEnded I recognize a CALayer class rather than a RMMArker class (obv0iously, because the layer is on top of the marker, therefore is first to intercept the event).
How can I reach the Marker once the top CALayer is tapped?
Thanks
Hackish workaround: Create an RMMapLayer instead of a CALayer. Remember to set the annotation on the sublayer to get things like callouts to work, e.g. in your RMMapLayer subclass:
RMMapLayer *sublayer = [[RMMapLayer alloc] init];
sublayer.annotation = ann;
sublayer.contents = (id)img2.CGImage;
sublayer.contentsScale = img2.scale;
sublayer.position = CGPointMake(CGRectGetWidth(self.bounds)/2, CGRectGetHeight(self.bounds)/2);
sublayer.bounds = CGRectMake(0, 0, img2.size.width, img2.size.height);
[self addSublayer:sublayer];
I don't know how many other things this has potential for breaking though, so you can follow this issue for any updates:
https://github.com/mapbox/mapbox-ios-sdk/issues/190
You can instruct the touches to passthrough. Take a look at this question: How can I click a button behind a transparent UIView?
Since the CALayer was on top of a CALAyer, all it took was to access it ancestor blockingLayer.superlayer.
By checking on the ancestor, I could have all that I needed.
This solved the problem.

Resources