Hello, I would like to add a “Cartesian PlotBand Annotation” to a “CartesianChart” at runtime.
This should be done in the MVVM environment. For this I would add a list “List<CartesianPlotBandAnnotation>” as a property to my “MainViewModel”. I then fill the individual elements of this list with the corresponding data. The property “Axis” of type “CartesianAxis” must also be specified. Unfortunately, this object is not known to the “MainViewModel”. What is the solution here?
Hello, I use the chart with binding for the data and the label.
// Model
public class StatisticRowItem
{
public double ValueDouble { get; set; }
public string Value { get; set; }
public string Name { get; set; }
}
// ViewModel
public class ViewModel
{
public ObservableCollection<StatisticRowItem> RowItemList { get; set; }
}
If only the values are bound, the calculation of the percentage values is correct.
<telerik:RadPieChart Grid.Row="1" Palette="{StaticResource customPalette}">
<telerik:RadPieChart.Series>
<telerik:DoughnutSeries
InnerRadiusFactor="0.35"
ItemsSource="{Binding RowItemList}"
RadiusFactor="0.50">
<telerik:DoughnutSeries.ValueBinding>
<telerik:PropertyNameDataPointBinding PropertyName="ValueDouble" />
</telerik:DoughnutSeries.ValueBinding>
<telerik:DoughnutSeries.LabelConnectorsSettings>
<telerik:ChartSeriesLabelConnectorsSettings />
</telerik:DoughnutSeries.LabelConnectorsSettings>
</telerik:DoughnutSeries>
</telerik:RadPieChart.Series>
</telerik:RadPieChart>
However, if the value and the label are linked, the calculation is incorrect.
<telerik:RadPieChart Grid.Row="1" Palette="{StaticResource customPalette}">
<telerik:RadPieChart.Series>
<telerik:DoughnutSeries
InnerRadiusFactor="0.35"
ItemsSource="{Binding RowItemList}"
RadiusFactor="0.50">
<telerik:DoughnutSeries.ValueBinding>
<telerik:PropertyNameDataPointBinding PropertyName="ValueDouble" />
</telerik:DoughnutSeries.ValueBinding>
<telerik:DoughnutSeries.LabelDefinitions>
<telerik:ChartSeriesLabelDefinition Margin="-15,0,0,0">
<telerik:ChartSeriesLabelDefinition.Template>
<DataTemplate>
<StackPanel>
<TextBlock
Foreground="{DynamicResource Brushes.Text.Dark}"
Text="{Binding DataItem.Name}"
Style="{StaticResource ControlBase.FontStyle.ButtonText}" />
<TextBlock
HorizontalAlignment="Center"
Foreground="{DynamicResource Brushes.Text.Dark}"
Style="{StaticResource ControlBase.FontStyle.ButtonText}"
Text="{Binding Value}" />
<TextBlock
HorizontalAlignment="Center"
Foreground="{DynamicResource Brushes.Text.Dark}"
Style="{StaticResource ControlBase.FontStyle.ButtonText}"
Text="{Binding Percent}" />
</StackPanel>
</DataTemplate>
</telerik:ChartSeriesLabelDefinition.Template>
</telerik:ChartSeriesLabelDefinition>
</telerik:DoughnutSeries.LabelDefinitions>
<telerik:DoughnutSeries.LabelConnectorsSettings>
<telerik:ChartSeriesLabelConnectorsSettings />
</telerik:DoughnutSeries.LabelConnectorsSettings>
</telerik:DoughnutSeries>
</telerik:RadPieChart.Series>
</telerik:RadPieChart>
The Telerik version 2024.1.130.45 of the WPF controls is used.
have a chart of (date- value) using Kendo js, the positions were wrong on the xAxis line there's an offset, I used the property baseUnit: "days", it fixed the first one but still seeing an offset for the others (date-value) and can't fix it , here's an image of my chart :
I am using a RadCartesianChart with a ChartSeriesProvider to have multiple ScatterLineSeries plotted. I am controlling the X and Y min and max values displayed programmatically.
I am using a timer so I can change the X axis at some frequency I can set. I am testing it, but I intend to update the X min and max more than once a second so the chart shows a live previous 10 seconds. You can see points when they are created, then move through time until they go off the chart once it's more than 10 seconds old.
I am running into two problems.
I have 4 series. Each one is having points added about once a second. I run until I eventually get
'Collection was modified; enumeration operation may not execute.'
The call stack shows
at System.ThrowHelper.ThrowInvalidOperationException(ExceptionResource resource)
at System.Collections.Generic.List`1.Enumerator.MoveNextRare()
at Telerik.Charting.DataPointCollection`1.<System.Collections.Generic.IEnumerable<Telerik.Charting.DataPoint>.GetEnumerator>d__5.MoveNext()
at Telerik.Charting.NumericalAxisModel.PlotNormal(IEnumerable`1 series)
at Telerik.Charting.NumericalAxisModel.PlotCore(AxisUpdateContext context)
at Telerik.Charting.ChartAreaModelWithAxes.PlotAxisAndCombinedStrategy(AxisModel axis, AxisUpdateContext context)
at Telerik.Charting.ChartAreaModelWithAxes.PlotAxesAndCombinedStrategies(SeriesByAxesTuple seriesByAxes)
at Telerik.Charting.ChartAreaModelWithAxes.ArrangeOverride(RadRect rect)
at Telerik.Charting.ChartNode.Arrange(RadRect rect, Boolean shouldRoundLayout)
at Telerik.Charting.ChartAreaModel.Arrange()
at Telerik.Windows.Controls.ChartView.RadChartBase.CallUpdateUI()
at Telerik.Windows.Controls.ChartView.RadChartBase.OnInvalidated()
...
I think the chart is enumerating through the collection to see if it needs to update the axes every time a point is added. I am setting both axes myself as I have said so I'd think it wouldn't have to do that. If my assumption is correct, is there a way to turn this off? Otherwise should I look at locking the collection, or creating a buffer and adding chunks of data at a time? It does happen when there is just one series, and all 4 series.
Sorry to put two questions in here, but they may be related. I am wondering how much I am overloading the chart. Maybe it's not intended to have the axis updated super frequently so it's view/window moves through time.
The other problem relates to the band annotations I am using. They actually don't change, at least not when the chart is moving through time. I am setting vertical bands. The Y axis range only changes when values come in that are too high. But when that happens, the bands still stay the same. Both upper and lower bands' To and From don't change when the chart is moving through time.
''-1' is not a valid value for 'Width'.'
at System.Windows.DependencyObject.SetValueCommon(DependencyProperty dp, Object value, PropertyMetadata metadata, Boolean coerceWithDeferredReference, Boolean coerceWithCurrentValue, OperationType operationType, Boolean isInternal) in System.Windows\DependencyObject.cs:line 812
The chart bands shouldn't ever have -1 being set as their width. When this exception happens, none of my code is changing the bands. The properties the bands' To and From are bound to aren't changing. I haven't seen this happen when I just comment out the bands in xaml.
I'm using a DefaultVisualStyle Property to set the style in order to control the Fill color of ScatterPointSeries via the DataItem.PointColor property (as seen below)
This works fine, but when I try to use a ChartDataSourceStyle to reduce the number of datapoints using Index-based sampling, something breaks and I no longer see ANY points displayed in the graph, due to this binding failure:
Path Tag.DataItem.PointColor Path.Fill Brush PointColor property not found on object of type DataPointSamplingInfo.
** How can I redirect the DataPointSamplingInfo points to use the PointColor of its DataItems (they'll all have the same value) **
<Style x:Key="ScatterPointStyle" TargetType="Path" >
<Setter Property="Fill" Value="{Binding RelativeSource={RelativeSource Mode=Self}, Path=Tag.DataItem.PointColor}"/>
</Style>
<telerik:ChartSeriesProvider Source="{Binding ChartData}" >
<telerik:ChartSeriesProvider.SeriesDescriptors >
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?
I'm working with the RadCartesianChart and using a BarSeries. In the series I have values that change, items that ger removed, and items that get added. I'd like for them to be sorted. I think I am implementing it correctly but could be mistaken. When the chart updates it displays values that are not sorted
I have attached a demo project to this post. I am using version 2024.2.514. Please let me know if there is anything I need to change or if I'm doing something incorrect.
Thank You,
Giuliano
Hello,
I'm wondering if there is a way to set a fixed height to the bars in a barseries. For example, instead of the bars changing height in the following example, I'd like them to stay up with a fixed height.
The desired outcome would look something like this:
The xaml I used fort the example is this:
<telerik:RadCartesianChart>
<telerik:RadCartesianChart.Series>
<telerik:BarSeries ShowLabels="False"
CategoryBinding="Category"
ValueBinding="Value">
<telerik:BarSeries.DataPoints>
<telerik:CategoricalDataPoint Category="Apples" Value="20"/>
<telerik:CategoricalDataPoint Category="Bananas" Value="28"/>
<telerik:CategoricalDataPoint Category="Oranges" Value="17"/>
<telerik:CategoricalDataPoint Category="Strawberries" Value="30"/>
</telerik:BarSeries.DataPoints>
</telerik:BarSeries>
</telerik:RadCartesianChart.Series>
<telerik:RadCartesianChart.HorizontalAxis>
<telerik:LinearAxis x:Name="horizontalAxis1"/>
</telerik:RadCartesianChart.HorizontalAxis>
<telerik:RadCartesianChart.VerticalAxis>
<telerik:CategoricalAxis/>
</telerik:RadCartesianChart.VerticalAxis>
</telerik:RadCartesianChart>
Is this possible using the BarSeries? Any help is appreciated.
Thank You,
Giuliano
Hello,
I'm trying to see if there is a way to align a chart label so that it shows up inside the bar but left aligned. Here is what I have right now:
I'd like for the numbers to be left aligned but still in the bar:
Here is the xaml I have:
<Window x:Class="TestRadCartesianChart.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns:local="clr-namespace:TestRadCartesianChart"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<telerik:RadCartesianChart>
<telerik:RadCartesianChart.Series>
<telerik:BarSeries ShowLabels="True"
CategoryBinding="Category"
ValueBinding="Value">
<telerik:BarSeries.LabelDefinitions>
<telerik:ChartSeriesLabelDefinition HorizontalAlignment="Center" VerticalAlignment="Center">
<telerik:ChartSeriesLabelDefinition.Template>
<DataTemplate>
<TextBlock Text="{Binding Value}"/>
</DataTemplate>
</telerik:ChartSeriesLabelDefinition.Template>
</telerik:ChartSeriesLabelDefinition>
</telerik:BarSeries.LabelDefinitions>
<telerik:BarSeries.DataPoints>
<telerik:CategoricalDataPoint Category="Apples" Value="20"/>
<telerik:CategoricalDataPoint Category="Bananas" Value="28"/>
<telerik:CategoricalDataPoint Category="Oranges" Value="17"/>
<telerik:CategoricalDataPoint Category="Strawberries" Value="30"/>
</telerik:BarSeries.DataPoints>
</telerik:BarSeries>
</telerik:RadCartesianChart.Series>
<telerik:RadCartesianChart.HorizontalAxis>
<telerik:LinearAxis x:Name="horizontalAxis1"/>
</telerik:RadCartesianChart.HorizontalAxis>
<telerik:RadCartesianChart.VerticalAxis>
<telerik:CategoricalAxis/>
</telerik:RadCartesianChart.VerticalAxis>
</telerik:RadCartesianChart>
</Grid>
</Window>
Any help is appreciated.
Thank You,
Giuliano Millan