How to add point on each chart data point

[berry]

Please see my attach screenshot.

I want to add little point over each point in my chart view

[berry]

Please see this example: http://docs.roguewave.com/jviews/8.9/jviews-charts89/codefragments/chart/rendering-hint/data/sample.gif

[berry]

BTW i want to add it via code behind

 

[Martin Ivanov]

Hello Berry,

You can use the PointTemplate property of the series to define its visual element. For example:

<telerik:LineSeries.PointTemplate>
    <DataTemplate>
        <Ellipse Fill="Red" Width="10" Height="10" />
    </DataTemplate>
</telerik:LineSeries.PointTemplate>

To add this in code you can define the template in XAML and get it through the Resources' dictionary of the view:

<Window.Resources>
    <DataTemplate x:Key="pointTemplate">
        <Ellipse Fill="Red" Width="10" Height="10" />
    </DataTemplate>
</Window.Resources>

series.PointTemplate = (DataTemplate)this.Resources["pointTemplate"];

Or you can define the template as string and use the XamlReader.Parse() method.

string pointTemplateString = @"<DataTemplate xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml"">"+
                      @"<Ellipse Fill=""Red"" Width=""10"" Height=""10"" /></DateTemplate>";

series.PointTemplate = (DataTemplate)XamlReader.Parse(pointTemplateString);

I hope this is useful.

Regards,
Martin
Telerik

[berry]

When i try the lase option using "define the template as string and use the XamlReader.Parse() method":

string pointTemplateString = @"<DataTemplate xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml"">"+
                      @"<Ellipse Fill=""Red"" Width=""10"" Height=""10"" /></DateTemplate>";

series.PointTemplate = (DataTemplate)XamlReader.Parse(pointTemplateString);

XamlParseException occurred:

A first chance exception of type 'System.Windows.Markup.XamlParseException' occurred in PresentationFramework.dll
Additional information: The 'DataTemplate' start tag on line 1 position 2 does not match the end tag of 'DateTemplate'. Line 1, position 183.

 

 

[Martin Ivanov]

Hello,

This is caused by a typo in my code snippet. The closing tag in the string should be </DataTemplate> instead of </DateTemplate>.

Regards,
Martin
Telerik

[berry]

OK that's works now.

BTW how can i replave the "Red" with string of my own ? (i want each pointTemplateSeries i have will be the same color as my Series Stroke)

[Martin Ivanov]

Hello Berry,

In order to do this you can just modify the string. Here is an example:

string series1Color = "#FF0000";
string series2Color = "Green";

string series1pointTemplateString = @"<DataTemplate xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml"">"+
@"<Ellipse Fill=""" + series1Color + """ Width=""10"" Height=""10"" /></DatаTemplate>";

string series2pointTemplateString = @"<DataTemplate xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml"">"+
@"<Ellipse Fill=""" + series2Color + """ Width=""10"" Height=""10"" /></DatаTemplate>";

I hope this helps.

Regards,
Martin
Telerik