Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Add text on custom marker on google map for ios

Am trying to put marker with Textview .Is there any posibility to add text over marker on google map in ios.

  • Like This

Like this

like image 233
Abhishek Singh Avatar asked Jun 30 '14 10:06

Abhishek Singh


People also ask

How do I start a custom image on Google Maps marker for mobile app?

For adding a custom marker to Google Maps navigate to the app > res > drawable > Right-Click on it > New > Vector Assets and select the icon which we have to show on your Map. You can change the color according to our requirements. After creating this icon now we will move towards adding this marker to our Map.

Can you mark stuff on Google Maps?

You can now pinpoint locations manually by clicking the marker icon and placing it directly onto the map, or search for locations using the search box at the top of the screen. If you're adding locations manually, you can name the location and save to add it to the map.


2 Answers

You must make a view, where you must create an imageView (with your marker image) and Label (with your text) and take a screenshot of that view, and set as icon to your GMSMarker. Something like this:

- (void)foo
{
    GMSMarker *marker = [GMSMarker new];

    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0,0,60,60)];
    UIImageView *pinImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"myPin"]];
    UILabel *label = [UILabel new];
    label.text = @"1";
    //label.font = ...;
    [label sizeToFit];

    [view addSubview:pinImageView];
    [view addSubview:label];
    //i.e. customize view to get what you need    


    UIImage *markerIcon = [self imageFromView:view];
    marker.icon = markerIcon;        
    marker.map = self.mapView;      
}

- (UIImage *)imageFromView:(UIView *) view
{
    if ([[UIScreen mainScreen] respondsToSelector:@selector(scale)]) {
        UIGraphicsBeginImageContextWithOptions(view.frame.size, NO, [[UIScreen mainScreen] scale]);
    } else {
        UIGraphicsBeginImageContext(view.frame.size);
    }
    [view.layer renderInContext: UIGraphicsGetCurrentContext()];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}
like image 87
arturdev Avatar answered Sep 28 '22 13:09

arturdev


enter image description here

If you want to display something like this , then just follow these steps. It is very simple, You can use this method.

-(UIImage *)createImage:(NSUInteger)count{   //count is the integer that has to be shown on the marker 


UIColor *color = [UIColor redColor]; // select needed color
NSString *string = [NSString stringWithFormat:@"%lu",(unsigned long)count]; // the string to colorize
NSDictionary *attrs = @{ NSForegroundColorAttributeName : color };
NSAttributedString *attrStr = [[NSAttributedString alloc] initWithString:string attributes:attrs]; // add Font according to your need

UIImage *image = [UIImage imageNamed:@"ic_marker_orange"]; // The image on which text has to be added
UIGraphicsBeginImageContext(image.size);
[image drawInRect:CGRectMake(0,0,image.size.width,image.size.height)];

CGRect rect = CGRectMake(20,5, image.size.width, image.size.height);// change the frame of your text from here
[[UIColor whiteColor] set];
[attrStr drawInRect:rect];
UIImage *markerImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

return markerImage;}

and when you set marker to the map then just set

    GMSMarker *marker = [[GMSMarker alloc] init];
    marker.icon = [self createImage:[model.strFriendCount integerValue]]; // pass any integer to the method.
like image 21
Kunal Gupta Avatar answered Sep 28 '22 14:09

Kunal Gupta