Configuring the Rendering Mode
Send Feedback

Glossary Item Box

Topic Overview


This topic provides an introductory overview of the rendering modes of the IGTreemapView™ control.

In this topic


Interactions summary

The IGTreemapView provides 2 different types of rendering modes set through the renderingMode property; UIView(s) and Core Graphics.

  • IGTreemapRenderingModeUIView - Renders UIView by default. To add custom content to a node rendered in this mode, implement the IGTreemapViewDelegate method treemapView:viewForLeafWithNode:. Returns a custom UIView
  • IGTreemapRenderingModeImmediate – Draws the Core Graphics geometry of the nodes and labels and is considerably faster at rendering and animating nodes

Displaying Custom Node Content – Code Example


The following code implements the IGTreemapViewDelegate’s treemapView:viewForLeafWithNode: method to display a custom label embedded in a tree map node.


This code example requires the inclusion of the Chart framework, detail about how to add this framework can be found in the Adding the Chart Framework File topic.


In Objective-C:

-(UIView *)treemapView:(IGTreemapView *)treemapView viewForLeafWithNode:(IGTreemapNode *)node
    UILabel *content = [[UILabel alloc]init];
    content.textColor = [UIColor blackColor];
    content.backgroundColor = [UIColor clearColor];
    content.font = [UIFont fontWithName:@"Helvetica" size:30];
    content.numberOfLines = 0;
    content.text = @"Custom Content : A leaf node can have a custom embedded view";
    [content sizeToFit];
    [content setFrame:CGRectMake(node.frame.size.width/2 - content.frame.size.width/2,
                                node.frame.size.height/2 - content.frame.size.height/2,
                                 content.frame.size.width, content.frame.size.height)];
    if (node.finalSize.width < content.frame.size.width || node.finalSize.height < content.frame.size.height)
        return nil;
    return content;

In C#:

public class TreemapDelegate : IGTreemapViewDelegate
      public override UIView ResolveLeafNodeView (IGTreemapView treemapView, IGTreemapNode node)
            UILabel content = new UILabel();
            content.TextColor = UIColor.Black;
            content.BackgroundColor = UIColor.Clear;
            content.Font = UIFont.FromName ("Helvetica", 30.0);
            content.Lines = 0;
            content.Text = "Custom Content : A leaf node can have a custom embedded view";
            content.SizeToFit ();
            content.Frame = new RectangleF(node.Frame.Width/2 - content.Frame.Width/2,
                                           node.Frame.Height/2 - content.Frame.Height/2,
                                           content.Frame.Width, content.Frame.Height);
            if (node.FinalSize.Width < content.Frame.Width || node.FinalSize.Height < content.Frame.Height)
                  return nil;
            return content;

Related Content


The following topic provides additional information related to this topic.



The topics in this group cover enabling, configuring, and using the IGTreemapView control’s supported features.