Understanding ToolTip Element

To see the exact value of each data point, you can mouse over the data point and a ToolTip will be shown near the data point.

<Intersoft:UXChart Intersoft:DockPanel.IsFillElement="True"
                    Title="Climate data in Melbourne"
                    ToolTipPosition="Right">                
    <Intersoft:UXChart.Series>
        <Intersoft:RadarSeries Title="Average Low"
                                ItemsSource="{Binding DataSource}"
                                IndependentValueBinding="{Binding Month}"
                                DependentValueBinding="{Binding AverageLow}" />
        <Intersoft:RadarSeries Title="Average High"
                                ItemsSource="{Binding DataSource}"
                                IndependentValueBinding="{Binding Month}"
                                DependentValueBinding="{Binding AverageHigh}" />
    </Intersoft:UXChart.Series>
</Intersoft:UXChart>

You can control the position of the ToolTip using the following properties:

• ToolTipPosition

  You can set the tooltip position to Bottom, BottomLeft, BottomRight, Left, Right, Top, TopLeft, TopRight, CenterParent, Relative and Absolute.

• ToolTipHorizontalOffset

  If needed you can also set a value that place the popup based on specific offset (the offset can be both positive and negative value).

• ToolTipVerticalOffset

  If needed you can also set a value that place the popup based on specific offset (the offset can be both positive and negative value).

Understanding ToolTip Reposition Behavior

The ToolTip will be shown based on set properties mentioned above. However whenever the ToolTip is positioned outside PlotArea, it will be reposition so that it fit the plot area.

The following figure shows how the tooltip reposition behavior works.

Understanding ToolTip Behavior

In general all tooltips will be shown whenever you mouse over the data point. However, in order to give better user experience the tooltip behavior is enhanced in the following series.

• ToolTip in LineSeries, AreaSeries, BubbleSeries, ScatterSeries, RadarSeries, PolarSeries, StackedLineSeries, StackedAreaSeries

  In the following series you can set the EnableHighlightNearestDataPoint to activate nearest data point finder logic that will highlight the data point when the mouse is near one of the data point.

  When the data point is highlighted it will show the tooltip for that specific data point.

  

  Note that the Highlighted Data Point is stored in HighlightedDataPoint property in each series.

• ToolTip in PieSeries and DoughnutSeries

  In the following series the tooltip will be position at the outer placement of the data point.

  

To further improve the user experience you can also set the ToolTipStaysOpen property to True, and ToolTipAnimationEnabled property to True. By enabling these properties the ToolTip will stays open and will only be hidden if you leave the plot area. If you move to another data point, it will move the tooltip using smooth transition.

If needed, you can customize the ToolTipAnimation duration or key spline from the following properties.

• ToolTipAnimationStartSpline
• ToolTipAnimationEndSpline
• ToolTipAnimationDuration

Customizing ToolTip Template

You can customize the content of the ToolTip using ToolTipTemplate property. This property is available in UXChart and all series type. Specifying the ToolTipTemplate at UXChart means that all series will be using the same template. On the other hand specifying the ToolTipTemplate at series level means that only that specific series use that ToolTipTemplate.

To learn more how to customize tooltip template see How-to: Customize ToolTip Template.

Understanding Data Tracker Mechanism

Data Tracker is a feature specific for LineSeries, AreaSeries, StackedLineSeries and StackedAreaSeries family. This feature enables the user to compare all data point on certain independent value.

You will see that data points in each series are highlighted based on current mouse position. These data points are stored in DataPointItem property in each series and DataPointItems property in UXChart .

<Intersoft:UXChart Intersoft:DockPanel.IsFillElement="True"
                    Title="WebSite Visitors Traffic"
                    LegendTitle="Origin"
                    DataPointItems="{Binding DataPointItems, Mode=TwoWay}">
    <Intersoft:UXChart.Resources>
        <Style TargetType="Intersoft:LineSeries">                        
            <Setter Property="EnableDataPointTracker"
                    Value="True" />                        
        </Style>
    </Intersoft:UXChart.Resources>
    <Intersoft:UXChart.Series>
        <Intersoft:LineSeries Title="Bing"
                                ItemsSource="{Binding BingVisitors}"
                                IndependentValueBinding="{Binding Date}"
                                DependentValueBinding="{Binding Visitor}" />
        <Intersoft:LineSeries Title="Google"
                                ItemsSource="{Binding GoogleVisitors}"
                                IndependentValueBinding="{Binding Date}"
                                DependentValueBinding="{Binding Visitor}" />
    </Intersoft:UXChart.Series>
</Intersoft:UXChart>

You can also enable data tracker when the DataPointVisibility property is set to Collapsed. In this scenario, each series will create data tracker element to help you identify which data point is currently tracked.

Learn More

To learn more about the concepts and more advanced features of the charting control, please refer to the following topics.

• UXChart Overview
• Understanding UXChart Series
• Working with Axis
• Working with Selection and Data Drilling
• Customizing UXChart Elements
• Customizing UXChart User Experiences