Version

Customize Chart ToolTips

This topic explains how to customize the ToolTips displayed in the Chart control.

  1. Before you start writing any code, you should place using/import directives in your code-behind so you don’t need to always type out a member’s fully qualified name.

In Visual Basic:

Imports Infragistics.UltraChart.Shared.Styles

In C#:

using Infragistics.UltraChart.Shared.Styles;

  1. ToolTips can be set so that they will display when the mouse hovers over chart data, when the chart data is clicked, or can be set to not display at all. The following code sets ToolTips to display when the data in the chart is clicked.

In Visual Basic:

Me.UltraChart1.Tooltips.Display = TooltipDisplay.MouseClick

In C#:

this.ultraChart1.Tooltips.Display = TooltipDisplay.MouseClick;

  1. The ToolTips can be set to display a string based on the data point that the mouse is over. This value can be the data value, the axis label and the data value, or the row number, column number and the data value.

In Visual Basic:

Me.UltraChart1.Tooltips.Format = TooltipStyle.LabelPlusDataValue

In C#:

this.ultraChart1.Tooltips.Format = TooltipStyle.LabelPlusDataValue;

  1. The ToolTips can also display a custom string. This can be done by setting the Format property to 'Custom' and the FormatString property to the string that will be displayed.

In Visual Basic:

Me.UltraChart1.Tooltips.Format = TooltipStyle.Custom
Me.UltraChart1.Tooltips.FormatString = "tooltip"

In C#:

this.ultraChart1.Tooltips.Format = TooltipStyle.Custom;
this.ultraChart1.Tooltips.FormatString = "tooltip";

  1. You also have control over the appearance of the tooltips. the following code sets formatting attributes for the background, text and border of the ToolTip.

In Visual Basic:

Me.UltraChart1.Tooltips.BackColor = System.Drawing.Color.Yellow
Me.UltraChart1.Tooltips.FontColor = System.Drawing.Color.Blue
Me.UltraChart1.Tooltips.BorderColor = System.Drawing.Color.Red
Me.UltraChart1.Tooltips.BorderThickness = 3

In C#:

this.ultraChart1.Tooltips.BackColor = Color.Yellow;
this.ultraChart1.Tooltips.FontColor = Color.Blue;
this.ultraChart1.Tooltips.BorderColor = Color.Red;
this.ultraChart1.Tooltips.BorderThickness = 3;