CartesianChart(Live-Charts)不适用于DataTemplate

时间:2016-07-12 16:06:50

标签: c# wpf xaml mvvm livecharts

我使用LiveChart Library,我有一个问题来显示图表。实际上,在我的窗口中,我想要许多类型的图表,所以我使用DataTemplateSelector,链接到每种类型的图表的类。但是,当图表出现时,它上面没有数据。我试图在我的" Column Graph"的声明中添加DataContext="{Binding}"。但没有成功。

这是我的代码摘录:

ResultView.xaml

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
    <FrameworkElement.Resources>

        <DataTemplate x:Key="graphEmptyTemlpate">
            <StackPanel Width="Auto" Height="60" Orientation="Horizontal" MaxWidth="700">
                <TextBlock Text="{Binding name}" VerticalAlignment="Center" TextAlignment="Center"  FontSize="20" Margin="0,0,0,0" Foreground="#FF006B93"/>
            </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="columnTemplate">
            <StackPanel Background="#FFBFBFBF">
                <TextBlock Text="{Binding title}"/>
                <TextBlock Text="{Binding subTitle}"/>
                <lvc:CartesianChart Width="400" Height="400" Series="{Binding listSeries}">
                </lvc:CartesianChart>
            </StackPanel>
        </DataTemplate>

        <local:GraphTemplateSelector
        ColumnTemplate="{StaticResource columnTemplate}"
        GraphEmptyTemplate="{StaticResource graphEmptyTemlpate}"
        x:Key="graphTemplateSelector" />

    </FrameworkElement.Resources>
    <StackPanel Orientation="Horizontal" >
        <ItemsControl ItemsSource="{Binding Results}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Expander Header="{Binding Title}"
                              IsExpanded="True"
                              Margin="10 10 10 10"
                              FontSize="20"
                              Foreground="White">
                        <ItemsControl ItemsSource="{Binding Items}" 
                                        ItemTemplateSelector="{DynamicResource graphTemplateSelector}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <WrapPanel Margin="10 10 10 10" Orientation="Vertical"/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                        </ItemsControl>
                    </Expander>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </StackPanel>
</ScrollViewer>

我的ViewModel类的构造函数位于ResultViewModel.cs中 在xaml中,结果对应于c#中的结果,Items对应于c#中的RpAgitation.Items

public ResultsViewModel()
{
    instance = this;
    this.Results = new ObservableCollection<ResultParts>();
    this.RpAgitation = new ResultParts("Results of the Agitation part");

    ColumnGraph gr = new ColumnGraph();
    RpAgitation.Items.Add(gr);

    this.Results.Add(_rpAgitation);

}

并完成ColumnGraph.cs

public class ColumnGraph : IGraph
{
    public SeriesCollection listSeries { get; set; }

    public ColumnGraph()
    {
        listSeries = new SeriesCollection
        {
            new LineSeries
            {
                Title = "Series 1",
                Values = new ChartValues<double> { 4,7,8,9,5,4,2}
            }
        };
    }
}

感谢您的帮助,

1 个答案:

答案 0 :(得分:1)

目前SeriesCollection类不是WPF UiFramework元素,我真的不想,但我想我们需要这样做才能避免这个问题。

我不确定这是WPF的错误,还是我们做错了。

任何方式,我会进一步调查,现在另一种方法是尝试这种语法:

DataSource = new List<ChartValues<double>>
        {
            new ChartValues<double> {r.Next(0, 10), r.Next(0, 10), r.Next(0, 10)},
            new ChartValues<double> {r.Next(0, 10), r.Next(0, 10), r.Next(0, 10)},
            new ChartValues<double> {r.Next(0, 10), r.Next(0, 10), r.Next(0, 10)}
        };

        DataContext = this;

和XAML

<ItemsControl ItemsSource="{Binding DataSource}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <lvc:CartesianChart Height="400">
                        <lvc:CartesianChart.Series>
                            <lvc:LineSeries Values="{Binding}"></lvc:LineSeries>
                        </lvc:CartesianChart.Series>
                    </lvc:CartesianChart>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>