Styling ChartSeriesProvider LineSeries Point Marks

[j]

Hello,

I am using a ChartSeriesProvider to chart multiple LineSeries. I would like each LineSeries to have the actual points styled instead of just being a plain line.

Styling each LineSeries is a little different since I am using a ChartSeriesProvider. 

<telerik:RadCartesianChart
	Grid.Row="2"
	Background="#FF282828">
		<telerik:RadCartesianChart.SeriesProvider>
			<telerik:ChartSeriesProvider
				Source="{Binding InspectionData}">
					<telerik:ChartSeriesProvider.SeriesDescriptors>
						<telerik:CategoricalSeriesDescriptor
							CategoryPath="InspectionDateTime"
							ValuePath="InspectionValue"
							ItemsSourcePath="CameraChartData"
							CollectionIndex="0">
							<telerik:CategoricalSeriesDescriptor.Style>
								<Style
									TargetType="telerik:LineSeries">
									<Setter
										Property="StrokeThickness"
										Value="2" />
									<Setter
										Property="Stroke"
										Value="DeepSkyBlue" />
								</Style>
							</telerik:CategoricalSeriesDescriptor.Style>
						</telerik:CategoricalSeriesDescriptor>
						<telerik:CategoricalSeriesDescriptor
							CategoryPath="InspectionDateTime"
							ValuePath="InspectionValue"
							ItemsSourcePath="CameraChartData"
							CollectionIndex="1">
							<telerik:CategoricalSeriesDescriptor.Style>
								<Style
									TargetType="telerik:LineSeries">
									<Setter
										Property="StrokeThickness"
										Value="2" />
									<Setter
										Property="Stroke"
										Value="Yellow" />
								</Style>
							</telerik:CategoricalSeriesDescriptor.Style>
						</telerik:CategoricalSeriesDescriptor>

 

This documentation says 

Currently, changing the point marks appearance could be done only via the provided API. Declarative customizations are not supported.

 

But, this documentation shows a LineSeries has property "Fill" (need to also set size) which is exactly what I want. TargetPath is different, in this example it's set to "Path" and in my xaml it's "telerik:LineSeries" because it has to be since it's in a CategoricalSeriesDescriptor.

 

How do I style the points? Is it possible?

 

[Martin Ivanov]

Hello J,

The first article (the one that states that the declarative customizations are not supported) is related to the old charting component (RadChart) which I strongly recommend to avoid. Instead, use the approach in the second documentation link (that points to the RadChartView documentation). 

In your case, you can show mark points in the LineSeries by setting the DefaultVisualStyle property.

<telerik:CategoricalSeriesDescriptor.Style>
	<Style TargetType="telerik:LineSeries">
		<Setter Property="StrokeThickness" Value="2" />
		<Setter Property="Stroke" Value="DeepSkyBlue" />
		<Setter Property="DefaultVisualStyle">
			<Setter.Value>
				<Style TargetType="Path"> 
					<Setter Property="Width" Value="10" /> 
					<Setter Property="Height" Value="10" /> 
					<Setter Property="Fill" Value="#FF5AC3" /> 
				</Style> 
			</Setter.Value>
		</Setter>
	</Style>
</telerik:CategoricalSeriesDescriptor.Style>

Regards,
Martin Ivanov
Progress Telerik

[j]

Thank you so much Martin! This works.

I am curious, as I am always trying to improve my skills, is there any resource or documentation I could have found to help me figure this out? I am wondering how I might have come to this solution without getting the answer from the Telerik team directly?

Thanks again.

[Martin Ivanov]

There is no documentation that is showing this exact setup - CategoricalSeriesDescriptor + DefaultVisualStyle setting in the Style. The Telerik documentation shows how to set the DefaultVisualStyle property directly on the LineSeries object and also it describes what it does. Setting this in a Style that targets the corresponding visual element (the LineSeries) is considered a common WPF knowledge, which is why we don't have covered all property settings of all series in the SeriesDescriptor article. 

However, it could be meaningful to have this specific setting in the CategoricalSeriesDescriptor+LineSeries context, so we will think where we can add something in the documentation.

About resources and documentation about the Telerik UI for WPF product, you can use the following ones:

• Help documentation
• SDK examples
• WPF Demos
• Forums