Creating a Tag Cloud in Cocoa, Objective C

Created By: Debasis Das (21-Aug-2015)

In this article we will create a simple tag cloud in Cocoa, Objective C using NSAttributedString.

This article focuses only on creating an user interface for the Tag Cloud.

The logic for generating the hashmap/NSDictionary for the tag cloud can be found here Word Frequency Algorithms in Objective C

The output of our sample program is given in the screen shot below

Tag Cloud in Cocoa, Objective C

Cocoa Tag Cloud

Sample Code

-(void)createTagCloud{
    NSArray *tagCloudArray = @[
                               @{@"tagname":@"algorithms",@"tagcount":@15},
  @{@"tagname":@"blocks",@"tagcount":@5},
  @{@"tagname":@"bootstrap",@"tagcount":@10},
  @{@"tagname":@"bubblesort",@"tagcount":@20},
  @{@"tagname":@"canvas",@"tagcount":@30},
  @{@"tagname":@"charts",@"tagcount":@20},
  @{@"tagname":@"cocoa",@"tagcount":@40},
  @{@"tagname":@"cocoa design patterns",@"tagcount":@19},
  @{@"tagname":@"cocoa interview questions",@"tagcount":@43},
  @{@"tagname":@"cocoa touch",@"tagcount":@43},
  @{@"tagname":@"css",@"tagcount":@60},
  @{@"tagname":@"custom drawing",@"tagcount":@2},
  @{@"tagname":@"d3js",@"tagcount":@65},
  @{@"tagname":@"design pattern",@"tagcount":@8},
  @{@"tagname":@"drawing",@"tagcount":@9},
  @{@"tagname":@"games",@"tagcount":@10},
  @{@"tagname":@"graphs",@"tagcount":@11},
  @{@"tagname":@"html5",@"tagcount":@12},
  @{@"tagname":@"ios",@"tagcount":@15},
  @{@"tagname":@"javascript",@"tagcount":@16},
  @{@"tagname":@"logging",@"tagcount":@18},
  @{@"tagname":@"mac osx",@"tagcount":@23},
  @{@"tagname":@"mac screensaver",@"tagcount":@55},
  @{@"tagname":@"memory management",@"tagcount":@56},
  @{@"tagname":@"mongo",@"tagcount":@45},
  @{@"tagname":@"mongodb",@"tagcount":@47},
  @{@"tagname":@"nsbezierpath",@"tagcount":@49},
  @{@"tagname":@"nsblockoperation",@"tagcount":@12},
  @{@"tagname":@"nslog",@"tagcount":@11},
  @{@"tagname":@"nsoutlineview",@"tagcount":@22},
  @{@"tagname":@"nstableview",@"tagcount":@33},
  @{@"tagname":@"objective c",@"tagcount":@15},
  @{@"tagname":@"objective c interview questions",@"tagcount":@44},
  @{@"tagname":@"omnigraffle",@"tagcount":@8},
  @{@"tagname":@"rwd",@"tagcount":@10},
  @{@"tagname":@"selectionsort",@"tagcount":@22},
  @{@"tagname":@"spritekit",@"tagcount":@7},
  @{@"tagname":@"stencils",@"tagcount":@54},
  @{@"tagname":@"svg",@"tagcount":@11},
  @{@"tagname":@"swift",@"tagcount":@18},
  @{@"tagname":@"uitableview",@"tagcount":@19},
  @{@"tagname":@"visualization",@"tagcount":@15},
  @{@"tagname":@"wireframe",@"tagcount":@12},
  @{@"tagname":@"yosemite",@"tagcount":@3}
                                  ];

    

    NSSortDescriptor *descriptor = [[NSSortDescriptor alloc] initWithKey:@"tagname"  ascending:YES];

    NSArray *sortedTagCloud;
    
    sortedTagCloud=[tagCloudArray sortedArrayUsingDescriptors:[NSArray arrayWithObjects:descriptor,nil]];

    NSLog(@"sortedTagCloud %@",sortedTagCloud);
    NSMutableAttributedString *finalTagCloudString = [[NSMutableAttributedString alloc] init];
    float fontSize = 10.0f;
    for (NSDictionary *dict in sortedTagCloud){
        if (([[dict objectForKey:@"tagcount"] floatValue] > 0) && ([[dict objectForKey:@"tagcount"] floatValue] <= 10)){
            fontSize = 12.0f;
        }
        else if (([[dict objectForKey:@"tagcount"] floatValue] > 10) && ([[dict objectForKey:@"tagcount"] floatValue] <= 20)){
            fontSize = 14.0f;
        }
        else if (([[dict objectForKey:@"tagcount"] floatValue] > 20) && ([[dict objectForKey:@"tagcount"] floatValue] <= 30)){
            fontSize = 18.0f;
        }
        else if (([[dict objectForKey:@"tagcount"] floatValue] > 30) && ([[dict objectForKey:@"tagcount"] floatValue] <= 40)){
            fontSize = 24.0f;
        }
        else if (([[dict objectForKey:@"tagcount"] floatValue] > 40) && ([[dict objectForKey:@"tagcount"] floatValue] <= 50)){
            fontSize = 32.0f;
        }
        else if ([[dict objectForKey:@"tagcount"] floatValue] > 50){
            fontSize = 40.0f;
        }
        else{
            fontSize = 42.0f;
        }
        
        NSDictionary *attributes = @{
                                     NSForegroundColorAttributeName : [NSColor blueColor],
                                     NSFontAttributeName : [NSFont fontWithName:@"Helvetica" size:fontSize]
                                     };
        
        NSAttributedString *attrString = [[NSAttributedString alloc] initWithString:[NSString stringWithFormat:@"%@  ",[dict objectForKey:@"tagname"]] attributes:attributes];
        

        [finalTagCloudString appendAttributedString:attrString];
        
        
    }
    [[self.tagCloudTextView textStorage] appendAttributedString:finalTagCloudString];
    [self.tagCloudTextView setEditable:NO];
    [self.tagCloudTextView setSelectable:NO];

}

The above method is called from applicationDidFinishLaunching