Line Marker

LineMarker displays the precise data values for a given position on the chart by dragging horizontal and/or vertical lines over the plot with an attached label. It is useful in scenarios, where a user has a lot of data in a line or area chart, or if a user wants to display data from multiple series in a single label. With built-in interactions, such as Drag and Move. a user can drag the line marker and more precisely select the data point on the chart.

To create a line marker and use it in FlexChart, you need to create an instance of the C1.WPF.Chart.Interaction.C1LineMarker class and add it to the Layers collection of the chart by using the Layers property of C1FlexChart.

You need to use the Lines property provided by C1LineMarker to set the visibility of the LineMarker lines. The Lines property accepts the following values from the LineMarkerLines enumeration:

Both: Shows both vertical and horizontal lines
Horizontal: Shows a horizontal line
Vertical: Shows a vertical line
None: Shows no line

The C1LineMarker class also provides the Alignment property to set the alignment of the line marker. In addition, you can set the interaction mode of the line marker by setting the Interaction property to any of the following values in the LineMarkerInteraction enumeration:

Drag: The line marker moves when the user drags the line
Move (Default): The line marker moves with the pointer
None: The user specifies the position by clicking.

If you set the Interaction property to Drag, you need to set the DragContent and the DragLines property to specify whether the content and values linked with the line marker lines are draggable or not.

Below is the code snippet with the implementation.

XAML
Code

<Chart:C1FlexChart.Layers>
    <Chart:C1LineMarker x:Name="lineMarker" Lines="Vertical" 
    Grid.Row="2" PositionChanged="OnLineMarkerPositionChanged" 
    VerticalAlignment="Top"/>
</Chart:C1FlexChart.Layers>

C#	Copy Code
private void OnLineMarkerPositionChanged(object sender, PositionChangedArgs e) { if (flexChart != null) { var info = flexChart.HitTest(e.Position); int pointIndex = info.PointIndex; var tb = new TextBlock(); tb.Inlines.Add(new Run() { Text = info.X.ToString() }); for (int index = 0; index < flexChart.Series.Count; index++) { var series = flexChart.Series[index]; var value = series.GetValues(0)[pointIndex]; var fill = (int)((IChart)flexChart).GetColor(index); string content = string.Format("{0}{1} = {2}", "\n", series.SeriesName, value.ToString()); tb.Inlines.Add(new Run() { Text = content, Foreground = new SolidColorBrush() { Color = FromArgb(fill) } }); } lineMarker.Content = tb; } }

Copy Code

private void OnLineMarkerPositionChanged(object sender, PositionChangedArgs e)
{
    if (flexChart != null)
    {
        var info = flexChart.HitTest(e.Position);
        int pointIndex = info.PointIndex;
        var tb = new TextBlock();
        tb.Inlines.Add(new Run()
        {
            Text = info.X.ToString()
        });
        for (int index = 0; index < flexChart.Series.Count; index++)
        {
            var series = flexChart.Series[index];
            var value = series.GetValues(0)[pointIndex];
            var fill = (int)((IChart)flexChart).GetColor(index);
            string content = string.Format("{0}{1} = {2}", "\n", 
            series.SeriesName, value.ToString());
            tb.Inlines.Add(new Run()
            {
                Text = content,
                Foreground = new SolidColorBrush() { Color = FromArgb(fill) }
            });
        }
        lineMarker.Content = tb;
    }
}

VB	Copy Code
Private Sub OnLineMarkerPositionChanged(sender As Object, e As PositionChangedArgs) If flexChart IsNot Nothing Then Dim info = flexChart.HitTest(e.Position) Dim pointIndex As Integer = info.PointIndex Dim tb = New TextBlock() tb.Inlines.Add(New Run() With { .Text = info.X.ToString() }) For index As Integer = 0 To flexChart.Series.Count - 1 Dim series = flexChart.Series(index) Dim value = series.GetValues(0)(pointIndex) Dim fill = CInt(DirectCast(flexChart, IChart).GetColor(index)) Dim content As String = String.Format("{0}{1} = {2}", vbLf, series.SeriesName, value.ToString()) tb.Inlines.Add(New Run() With { .Text = content, .Foreground = New SolidColorBrush() With { .Color = FromArgb(fill) } }) Next lineMarker.Content = tb End If End Sub

Copy Code

    Private Sub OnLineMarkerPositionChanged(sender As Object, e As PositionChangedArgs)
        If flexChart IsNot Nothing Then
            Dim info = flexChart.HitTest(e.Position)
            Dim pointIndex As Integer = info.PointIndex
            Dim tb = New TextBlock()
            tb.Inlines.Add(New Run() With {
                .Text = info.X.ToString()
            })
            For index As Integer = 0 To flexChart.Series.Count - 1
                Dim series = flexChart.Series(index)
                Dim value = series.GetValues(0)(pointIndex)
                Dim fill = CInt(DirectCast(flexChart, IChart).GetColor(index))
                Dim content As String = String.Format("{0}{1} = {2}", 
vbLf, series.SeriesName, value.ToString())
                tb.Inlines.Add(New Run() With {
                    .Text = content,
                    .Foreground = New SolidColorBrush() With {
                    .Color = FromArgb(fill)
                    }
                })
            Next
            lineMarker.Content = tb
        End If
    End Sub