ComponentOne Chart for WPF and Silverlight
Chart for WPF and Silverlight / Chart Features / Markers Labels
In This Topic
    Markers Labels
    In This Topic

    Chart for WPF and Silverlight has special support for displaying bound and interactive markers and labels. There is no single approach to creating or displaying markers in a chart, so our strategy is to provide an extensible object model for the C1Chart control to help you create the exact setup you need.

    This topic will cover the ChartPanelObject and the ChartView.Layers collection and how you can use these to provide a customized assortment of markers and labels for your chart.

    To use chart panel with chart it’s necessary to add the panel to the Layers collection of ChartView:

    Copy Code
    <c1chart:C1Chart x:Name="chart">
             <c1chart:ChartPanel >
              <!-- ChartPanelObjects -->

    Through the ChartView.Layers collection you can add any number of ChartPanels. Each panel can have any number of ChartPanelObjects, which are basically UI elements that define our markers. The ChartPanelObject has a few key properties:

    You can set the ChartPanelObject.Content property to any UIElement. This allows you to define the look of your marker as well as provide binding to the data point. You can also use the Alignment properties to help define the look of your marker – you may want to create a centered marker. In that case, you'd set the HorizontalAlignment property to "center".

    The following XAML defines text label with its left-bottom corner at x=0, y=0 in data coordinates:

    Copy Code
     <c1chart:ChartPanelObject DataPoint="0,0" VerticalAlignment="Bottom">
           <TextBlock Text="Zero"/>
    Note: It is not necessary to specify both coordinates. If the coordinate is set to double.NaN then the element does not have specific x- or y- coordinates.

    We can create horizontal marker at y=0. Note that the HorizontalAlignment property is set to Stretch and the element fills the width of the plot area.

    Copy Code
    <!-- horizontal line -->
       <c1chart:ChartPanelObject DataPoint="NaN,0"
         <Border BorderBrush="Red" BorderThickness="0,2,0,0"
    Margin="0,-1,0,0" />

    The following sample here creates a vertical marker:

    Copy Code
       <!-- vertical line -->
       <c1chart:ChartPanelObject DataPoint="0,NaN" VerticalAlignment="Stretch">
         <Border BorderBrush="Red" BorderThickness="2,0,0,0"
    Margin="-1,0,0,0" />
    Note: The chart panel objects support only the main axes. For auxiliary axes you need to perform coordinate conversion.


    See Also