Using Custom Markers
Send Feedback

Glossary Item Box

Topic Overview

Purpose

This topic provides an introductory overview of using custom markers on the IGChartView™ control and provides a code example demonstrating its configuration.

In this topic


Introduction

Custom markers summary

The use of custom markers allows you to insert a UIView in place of a marker on a data point. To enable custom markers, adopt the IGChartViewDelegate protocol, and handle the chartView:viewForMarkerInSeries:withItem: method.


Configuring Custom Markers – Code Example

Description

The code example demonstrates how the IGChartViewDelegate handles the chartView:viewForMarkerInSeries:withItem: delegate method. The method returns a rounded UILabel containing the value of the category point. The chart using custom markers illustrated in the preview is a column chart using the IGThemeDark gradient theme.

Prerequisites

This code example requires the inclusion of the Chart framework; details about how to add this framework are available in the Adding the Chart Framework File topic.

Preview

Code

In Objective-C:

- (UIView *)chartView:(IGChartView *)chartView viewForMarkerInSeries:(IGSeries *)series withItem:(NSObject *)item
{
    UILabel *label = [[UILabel alloc] init];
    IGCategoryPoint *pt = (IGCategoryPoint *)item;
    if (pt == nil) return nil;
    label.backgroundColor = [UIColor lightGrayColor];
    label.text = [NSString stringWithFormat:@" %.1f ", pt.value];
    label.layer.cornerRadius = 8.0;
    [label sizeToFit];
    return label;
}

In C#:

public class ChartDelegate : IGChartViewDelegate
{
      public override UIView ResolveMarkerView (IGChartView chartView, IGSeries series, NSObject item, int index, NSObject originalSourceItem)
      {
            UILabel label = new UILabel ();
            IGCategoryPoint pt = item as IGCategoryPoint;
            if (pt == null) return null;
            label.BackgroundColor = UIColor.LightGray;
            label.Text = String.Format (" {0:0.0} ", pt.Value);
            label.Layer.CornerRadius = 8.0f;
            label.SizeToFit ();
            return label;
      }
}

Related Content

Topics

The following topic provides additional information related to this topic.

Topic

Purpose

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