Binding ScatterPointSeries.XValueBinding to DateTime

3 posts, 0 answers
  1. Jinyan
    Jinyan avatar
    23 posts
    Member since:
    Jul 2012

    Posted 09 Aug 2012 Link to this post

    Hi all,

    I am having trouble with trying to bind the x-value for a ScatterPointSeries to DateTime variable. The chart is based on live data, so I know that the data binding in general is working because the Y-axis is adjusting correctly. However, no tick marks are showing up for the X-axis, and thus no scatter points are showing up on the graph. Below is the code snippet for the dynamic data binding.

    def = new ScatterPointSeries()
                        {
                            XValueBinding = new PropertyNameDataPointBinding("Time"),
                            YValueBinding = new PropertyNameDataPointBinding("Value")
                             
                        };
    ...
    (def as ScatterPointSeries).PointTemplate = (DataTemplate)System.Windows.Markup.XamlReader.Parse(
                            @"<DataTemplate xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"">
                            <Ellipse Width=""5"" Height=""5"" Fill=""" + BrushColor.ToString() + @""" Opacity=""" + WPConstants.DEFAULT_LINE_FILL_OPACITY + @"""/>
                            </DataTemplate>");


    Thanks,
    Jin
  2. Jinyan
    Jinyan avatar
    23 posts
    Member since:
    Jul 2012

    Posted 13 Aug 2012 Link to this post

    Bump any updates on this?
  3. UI for WPF is Visual Studio 2017 Ready
  4. Petar Kirov
    Admin
    Petar Kirov avatar
    425 posts

    Posted 14 Aug 2012 Link to this post

    Hello Jinyan,

    The ScatterPoint series does not support Categorical Axis. You may have read this help topic, but it is incorrect and we will fix it. We're sorry for the troubles it may have caused you.

    However what you want to accomplish can be easily done by using LineSeries with a Transparent Stroke, and a custom PointTemplate. Here is an example:
    <telerik:RadCartesianChart x:Name="chart">
        <telerik:RadCartesianChart.VerticalAxis>
            <telerik:LinearAxis/>
        </telerik:RadCartesianChart.VerticalAxis>
        <telerik:RadCartesianChart.HorizontalAxis>
            <telerik:DateTimeContinuousAxis LabelFormat="mmm/yyyy"
                          PlotMode="OnTicksPadded"/>
        </telerik:RadCartesianChart.HorizontalAxis>
        <telerik:RadCartesianChart.Series>
            <telerik:LineSeries x:Name="Series1" ValueBinding="Value"
                     CategoryBinding="Time" Stroke="Transparent">
                <telerik:LineSeries.PointTemplate>
                    <DataTemplate>
                        <Ellipse Fill="Red" Width="20" Height="20"/>
                    </DataTemplate>
                </telerik:LineSeries.PointTemplate>
            </telerik:LineSeries>
        </telerik:RadCartesianChart.Series>
    </telerik:RadCartesianChart>

    Feel free to customize it to your needs.

    Regards,
    Petar Kirov
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top