Skip to main content

SeriesCrosshairOptions Class

Stores the series’ crosshair cursor settings.

Namespace: DevExpress.XamarinForms.Charts

Assembly: DevExpress.XamarinForms.Charts.dll

NuGet Package: DevExpress.XamarinForms.Charts

Declaration

public class SeriesCrosshairOptions :
    SeriesHintOptions

Example

This example demonstrates how to set up the chart so that it shows a series point hint as a crosshair cursor, and manage each series interaction with the hint.

Line Series Crosshair

  1. Set the chart hint’s Behavior property to the CrosshairHintBehavior class instance.
  2. Set each series’ HintOptions property to the SeriesCrosshairOptions object and specify this object’s properties:

    • ShowInLabel - to specify whether the crosshair label should provide information for points of the current series.
    • PointTextPattern - to define the text pattern used to show information about the series point within a crosshair label.
      You can use the following placeholders to specify text patterns for items of the crosshair label:

      Placeholder

      Description

      {S}

      Displays a series name (DisplayName).

      {A}

      Displays a series point argument.

      {V}

      Displays a series point value.

      Note

      To format these values, you can use default format strings after the $ sign.
      For example, in the {V$#.##} string, V is a placeholder, $ is a format string separator, and #.## is a format string.

    • AxisLineVisible, AxisLabelVisible - to specify whether the crosshair cursor should display axis lines and labels for the series.
<ContentPage.Resources>
    <dxc:SeriesCrosshairOptions x:Key="lineSeriesHintOptions"
                                PointTextPattern="{}{S}: {V$##}M"
                                ShowInLabel="True"
                                AxisLabelVisible="True"
                                AxisLineVisible="True"/>
</ContentPage.Resources>

<dxc:ChartView>
    <dxc:ChartView.Hint>
        <dxc:Hint>
            <dxc:Hint.Behavior>
                <dxc:CrosshairHintBehavior GroupHeaderTextPattern="Year: {A$YYYY}" 
                                           MaxSeriesCount="3"/>
            </dxc:Hint.Behavior>
        </dxc:Hint>
    </dxc:ChartView.Hint>

    <dxc:ChartView.Series>
        <dxc:LineSeries HintOptions="{StaticResource lineSeriesHintOptions}">
            <!--Series Data-->
        </dxc:LineSeries>
        <dxc:LineSeries HintOptions="{StaticResource lineSeriesHintOptions}">
            <!--Series Data-->
        </dxc:LineSeries>
        <dxc:LineSeries HintOptions="{StaticResource lineSeriesHintOptions}">
            <!--Series Data-->
        </dxc:LineSeries>
    </dxc:ChartView.Series>    
</dxc:ChartView>

Note

A crosshair cursor also requests data to display from axes. Use the AxisBase.HintOptions property to specify how the hint interacts with the axis.

See Also