Chart. Cant change color

[JackSH]

I use sample from demo:

<telerik:RadCartesianChart Palette="Windows8" Height="Auto" Width="500">
    <telerik:RadCartesianChart.Behaviors>
        <telerik:ChartTrackBallBehavior ShowIntersectionPoints="True" />
    </telerik:RadCartesianChart.Behaviors>
    <telerik:AreaSeries CategoryBinding="Category" Fill="#7F8EC448" Stroke="#FF8EC442" StrokeThickness="2" ValueBinding="Value" ItemsSource="{Binding Chart1}">
        <telerik:AreaSeries.TrackBallInfoTemplate>
            <DataTemplate>
                <StackPanel Margin="3" Orientation="Horizontal">
                    <TextBlock Text="{Binding DataPoint.Category, StringFormat='Spread at {0:HH:mm:ss.f}:'}" Margin="0,0,3,0" />
                    <TextBlock Text="{Binding DataPoint.Value}" FontWeight="Bold" />
                </StackPanel>
            </DataTemplate>
        </telerik:AreaSeries.TrackBallInfoTemplate>
    </telerik:AreaSeries>
    <telerik:RadCartesianChart.HorizontalAxis>
        <telerik:DateTimeContinuousAxis MajorStepUnit="Second"
                            LabelInterval="10"
                            LabelFormat="HH:mm:ss.f" FontFamily="Segoe UI"
                            PlotMode="OnTicks" />
    </telerik:RadCartesianChart.HorizontalAxis>
    <telerik:RadCartesianChart.VerticalAxis>
        <telerik:LinearAxis FontFamily="Segoe UI">
        </telerik:LinearAxis>
    </telerik:RadCartesianChart.VerticalAxis>
    <telerik:RadCartesianChart.Grid>
        <telerik:CartesianChartGrid MajorLinesVisibility="Y" MajorYLineDashArray="3,4" />
    </telerik:RadCartesianChart.Grid>
</telerik:RadCartesianChart>

I use DataContext  binding:

DataContext = _viewModelMain;

 But i cant change color here: Fill="#7F8EC448" Stroke="#FF8EC442". Output window:

System.Windows.Data Error: 2 : Cannot find governing FrameworkElement or FrameworkContentElement for target element. BindingExpression:Path=Color; DataItem=null; target element is 'SolidColorBrush' (HashCode=1226006); target property is 'Color' (type 'Color')

How fix it?

[Missing User]

Hi Jack,

I used the code you provided to create a project that attempts to reproduce the problem. I only had to implement a simple ViewModel and add sample data. However, the project runs fine on my end and I've attached it to this post, so that you can confirm this.

As far as I can see from the error message, the error is related to a binding. Could you please modify the project and send it back in a new support ticket or simply post the code that breaks the provided application here so that we can reproduce and investigate the issue locally? 

Greetings,
Ivan N.
the Telerik team

[JackSH]

 I think my problem like this: http://stackoverflow.com/questions/7926204/cannot-find-governing-frameworkelement-warning-when-binding-inside-datatemp

I am use ContentControl  in my project.  But I do not understand how to solve it. Can you help me?

This example (with ContentControl) does not work:

viewmodel

public class TestViewModel {

    private Color _color = Colors.Green;

        public Color MyColor
           {

            get { return _color; }

        }

        public TestViewModel() {    }

  }

xaml

<Window x:Class="wpf_678242_Binding.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:local="clr-namespace:wpf_678242_Binding"
        Title="MainWindow"
        Height="350"
        Width="525">
    <Window.DataContext>
        <local:ViewModel />
    </Window.DataContext>

    <Window.Resources>
        <SolidColorBrush x:Key="fill">red</SolidColorBrush>
        <SolidColorBrush x:Key="stroke">yellow</SolidColorBrush>

        <local:ViewModel x:Key="_myTestVM"/>

        <DataTemplate x:Key="testVMDataTemplate">
            <Grid>
                <telerik:RadCartesianChart Palette="Windows8">
                    <telerik:RadCartesianChart.Behaviors>
                        <telerik:ChartTrackBallBehavior ShowIntersectionPoints="True" />
                    </telerik:RadCartesianChart.Behaviors>
                    <telerik:AreaSeries CategoryBinding="Category"
                                Fill="{StaticResource fill}"
                                Stroke="{StaticResource stroke}"
                                StrokeThickness="2"
                                ValueBinding="Value"
                                ItemsSource="{Binding Chart1}">
                        <telerik:AreaSeries.TrackBallInfoTemplate>
                            <DataTemplate>
                                <StackPanel Margin="3"
                                    Orientation="Horizontal">
                                    <TextBlock Text="{Binding DataPoint.Category, StringFormat='Spread at {0:HH:mm:ss.f}:'}"
                                       Margin="0,0,3,0" />
                                    <TextBlock Text="{Binding DataPoint.Value}"
                                       FontWeight="Bold" />
                                </StackPanel>
                            </DataTemplate>
                        </telerik:AreaSeries.TrackBallInfoTemplate>
                    </telerik:AreaSeries>
                    <telerik:RadCartesianChart.HorizontalAxis>
                        <telerik:DateTimeContinuousAxis MajorStepUnit="Second"
                                                LabelInterval="10"
                                                LabelFormat="HH:mm:ss.f"
                                                FontFamily="Segoe UI"
                                                PlotMode="OnTicks" />
                    </telerik:RadCartesianChart.HorizontalAxis>
                    <telerik:RadCartesianChart.VerticalAxis>
                        <telerik:LinearAxis FontFamily="Segoe UI">
                        </telerik:LinearAxis>
                    </telerik:RadCartesianChart.VerticalAxis>
                    <telerik:RadCartesianChart.Grid>
                        <telerik:CartesianChartGrid MajorLinesVisibility="Y"
                                            MajorYLineDashArray="3,4" />
                    </telerik:RadCartesianChart.Grid>
                </telerik:RadCartesianChart>
            </Grid>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <StackPanel DataContext="{StaticResource _myTestVM}">
            <ContentControl Content="{Binding}" ContentTemplate="{StaticResource testVMDataTemplate}"/>
        </StackPanel>
    </Grid>
</Window>

[JackSH]

I try to use ValueConverter:

xaml:

<c:ColorToBrushConverter x:Key="ColorToBrushConverter"/>
.....

<telerik:AreaSeries CategoryBinding="Category"

Fill="{Binding MyColor, Converter={StaticResource ColorToBrushConverter}}"

StrokeThickness="2" ValueBinding="Value" ItemsSource="{Binding Chart1}">

.....

Converter:

public class ColorToBrushConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
        if (null == value) {
            return null;
        }
        if (value is Color) {
            var color = (Color)value;
            return new SolidColorBrush(color);
        }
        var type = value.GetType();
        throw new InvalidOperationException("Unsupported type ["+type.Name+"]");
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

 This property in ViewModel:

public Color MyColor
{
    get { return Colors.Red; }
}

Does not work...

[Missing User]

Hello Jack,

After examining the code you posted, I can suggest that you don't set the Palette property of RadChartView. What happens internally is that the color from the palette overrides the one you specify through a binding. By design, RadChartView can either use colors from a ChartPalette or from a binding, but not both. Therefore, once you use the chart without a palette, the binding will take effect.

I hope this helps.

All the best,
Ivan N.
the Telerik team

[JackSH]

I did not think that the problem is that, because in your example, both properties were present. I just used the "copy-past" from demo and was not able to change the color.

 Problem solved, it works, thanks, marked as answer.