PieChart不会出现

时间:2016-05-11 18:22:31

标签: c# wpf xaml charts

我需要显示<UserControl x:Class="Projet.Recources0.Statistique.Ad_Aj" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mui="http://firstfloorsoftware.com/ModernUI" xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls" xmlns:chart="clr-namespace:De.TorstenMandelkow.MetroChart;assembly=De.TorstenMandelkow.MetroChart" mc:Ignorable="d" d:DesignWidth="1000" Height="670"> <UserControl.Resources> <Style x:Key="MinimalChartStyle" TargetType="{x:Type chart:ChartBase}"> <Setter Property="Width" Value="500"/> <Setter Property="Height" Value="500"/> </Style> </UserControl.Resources> <Grid > <chart:PieChart Style="{StaticResource MinimalChartStyle}" ChartTitle="Minimal Pie Chart" ChartSubTitle="Chart with fixed width and height" SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" > <chart:PieChart.Series> <chart:ChartSeries SeriesTitle="Errors" DisplayMember="Category" ValueMember="Number" ItemsSource="{Binding Path=Errors}" /> </chart:PieChart.Series> </chart:PieChart> </Grid> ,我目前正在使用Modern UI (Metro) Charts。我确实复制了文档中的代码,问题是我总是在屏幕上有边框和标题,但没有图表。

XAML

using MySql.Data.MySqlClient;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Configuration;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Projet.Recources0.Statistique
{
    /// <summary>
    /// Interaction logic for Ad_Aj.xaml
    /// </summary>

    public partial class Ad_Aj : UserControl
    {
        public ObservableCollection<TestClass> Errors { get; private set; }

        public Ad_Aj()
        {
            Errors = new ObservableCollection<TestClass>();
            Errors.Add(new TestClass() { Category = "Globalization", Number = 75 });
            Errors.Add(new TestClass() { Category = "Features", Number = 2 });
            Errors.Add(new TestClass() { Category = "ContentTypes", Number = 12 });
            Errors.Add(new TestClass() { Category = "Correctness", Number = 83});
            Errors.Add(new TestClass() { Category = "Best Practices", Number = 29 });
        }

        private object selectedItem = null;
        public object SelectedItem
        {
            get
            {
                return selectedItem;
            }
            set
            {
                // selected item has changed
                selectedItem = value;                
            }
        }
    }

    // class which represent a data point in the chart
    public class TestClass
    {
        public string Category { get; set; }

        public int Number { get; set; }
    }
}

CS

SELECT Custodian Field
    ,FlagName
    ,count(1) Counts
FROM DocumentMetadata t
INNER JOIN documentreview.dbo.documentflags df ON t.documentid = df.documentid
INNER JOIN documentreview.dbo.flags f ON df.flagid = f.flagid
WHERE t.documentId IN (
        SELECT DocumentId
        FROM DocumentReview.dbo.DocumentsInSample
        WHERE SampleId = 10039
        )
    AND df.flagid = 10117

UNION

SELECT Custodian Field
    ,f2.FlagName
    ,count(1) Counts
FROM DocumentMetadata t2
INNER JOIN DocumentReview.dbo.DocumentVetting dv2 ON t2.documentid = dv2.documentid
INNER JOIN DocumentReview.dbo.FlagRelevancyMapping frm2 ON frm2.CategoryFolderId = dv2.CategoryId
INNER JOIN DocumentReview.dbo.Flags f2 ON f2.FlagId = frm2.FlagId
WHERE dv2.DocumentId IN (
        SELECT DocumentId
        FROM DocumentReview.dbo.DocumentsInSample
        WHERE SampleId = 10039
        )
    AND f2.FlagId IN (10117)
    AND f2.IsCategoryFlag = 1
    AND (
        frm2.Relevancy = dv2.Relevancy
        OR (
            frm2.Relevancy = 'MR'
            AND dv2.MaybeResolved = 1
            )
        OR (
            frm2.Relevancy = 'CCA'
            AND dv2.CrossCheckAgree = 1
            )
        OR (
            frm2.Relevancy = 'CCD'
            AND dv2.CrossCheckDisagree = 1
            )
        OR (
            frm2.Relevancy = 'VM'
            AND dv2.VettingMismatch = 1
            )
        OR (
            frm2.Relevancy = 'VMR'
            AND dv2.VettingMismatchResolved = 1
            )
        )
GROUP BY Custodian
    ,FlagName
ORDER BY Custodian
    ,FlagName

Pie Chart

3 个答案:

答案 0 :(得分:1)

创建ViewModel来保存图表的数据,并将其分配给DataContext,如下所示:

XAML:

<Window x:Class="WpfApplication222.Window2"
    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:chart="clr-namespace:De.TorstenMandelkow.MetroChart;assembly=De.TorstenMandelkow.MetroChart" 
    xmlns:local="clr-namespace:WpfApplication222"
    mc:Ignorable="d"
    Title="Window2" Height="350" Width="525">

<Window.DataContext>
    <local:PieChartViewModel/>
</Window.DataContext>

<Grid>
    <chart:PieChart
        ChartTitle="Minimal Pie Chart"
        ChartSubTitle="Chart with fixed width and height"
        SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" >
        <chart:PieChart.Series>
            <chart:ChartSeries
                SeriesTitle="Errors"
                DisplayMember="Category"
                ValueMember="Number"
                ItemsSource="{Binding Path=Errors}" />
        </chart:PieChart.Series>
    </chart:PieChart>
</Grid>

视图模型:

public class PieChartViewModel
{
    public ObservableCollection<TestClass> Errors { get; private set; }

    public PieChartViewModel()
    {
        Errors = new ObservableCollection<TestClass>();
        Errors.Add(new TestClass() { Category = "Globalization", Number = 75 });
        Errors.Add(new TestClass() { Category = "Features", Number = 2 });
        Errors.Add(new TestClass() { Category = "ContentTypes", Number = 12 });
        Errors.Add(new TestClass() { Category = "Correctness", Number = 83 });
        Errors.Add(new TestClass() { Category = "Best Practices", Number = 29 });
    }
}

enter image description here

编辑:您可以按照以下方式动态执行,而不是像以前一样在XAML中创建ViewModel

XAML:

Window x:Class="WpfApplication222.Window2"
    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:chart="clr-namespace:De.TorstenMandelkow.MetroChart;assembly=De.TorstenMandelkow.MetroChart" 
    xmlns:local="clr-namespace:WpfApplication222"
    mc:Ignorable="d"
    Title="Window2" Height="350" Width="525" Loaded="Window_Loaded">

<Grid>
    <chart:PieChart
        ChartTitle="Minimal Pie Chart"
        ChartSubTitle="Chart with fixed width and height"
        SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" >
        <chart:PieChart.Series>
            <chart:ChartSeries
                SeriesTitle="Errors"
                DisplayMember="Category"
                ValueMember="Number"
                ItemsSource="{Binding Path=Errors}" />
        </chart:PieChart.Series>
    </chart:PieChart>
</Grid>

CS:

public partial class Window2 : Window
{
    PieChartViewModel viewModel;

    public Window2()
    {
        InitializeComponent();
    }

    private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        viewModel = new PieChartViewModel();

        viewModel.Errors.Add(new TestClass() { Category = "Globalization", Number = 75 });
        viewModel.Errors.Add(new TestClass() { Category = "Features", Number = 2 });
        viewModel.Errors.Add(new TestClass() { Category = "ContentTypes", Number = 12 });
        viewModel.Errors.Add(new TestClass() { Category = "Correctness", Number = 83 });
        viewModel.Errors.Add(new TestClass() { Category = "Best Practices", Number = 29 });

        DataContext = viewModel;
    }
}

视图模型:

public class PieChartViewModel
{
    public ObservableCollection<TestClass> Errors { get; private set; }

    public PieChartViewModel()
    {
        Errors = new ObservableCollection<TestClass>();
    }
}

答案 1 :(得分:1)

所以你走到了正确的轨道!你只缺少一行代码!

public partial class Ad_Aj : UserControl
{
    public ObservableCollection<TestClass> Errors { get; private set; }

    public Ad_Aj()
    {
        /*
         * ----------------------------
         * This is line you're missing.
         * ----------------------------
         */
        DataContext = this;
        /*
         * ----------------------------
         */
        Errors = new ObservableCollection<TestClass>();
        Errors.Add(new TestClass() { Category = "Globalization", Number = 75 });
        Errors.Add(new TestClass() { Category = "Features", Number = 2 });
        Errors.Add(new TestClass() { Category = "ContentTypes", Number = 12 });
        Errors.Add(new TestClass() { Category = "Correctness", Number = 83});
        Errors.Add(new TestClass() { Category = "Best Practices", Number = 29 });
    }
}

这是MVVM,但它不是 true MVVM。真正的MVVM有一个单独的ViewModel类。你在这里做的是使用View的Code-Behind作为ViewModel。它有效,没有人会打你。但是,如果您正在尝试使用真正的MVVM,那么您需要将您的类分开。

jstreet has a great answer/example如何在XAML中将DataContext(也就是“绑定”)设置为ViewModel。

<Window.DataContext>
    <local:PieChartViewModel />
</Window.DataContext>

但请注意,他正在使用单独的ViewModel课程。您在问题中提供的代码执行此操作,因此我不确定如何以相同的方式执行此操作。此外,值得一提的是,如果您的ViewModel类使用构造函数依赖注入或具有参数,那么您将不得不使用一些魔法来使其工作。如果是这种情况,那么在构造函数中设置它会更容易。

答案 2 :(得分:0)

我不是控件的专家,但我猜你的ItemsSource绑定失败了。 Errors集合作为属性在用户控件上,默认情况下,ItemsSource上的绑定将脱离DataContext,我认为在您的情况下为空。要通过绑定直接获取控件,您可能会通过执行类似(假设您将&#34; local&#34;映射到Ad_Aj所在的命名空间)来使其与RelativeSource标记扩展一起使用:

ItemsSource = "{Binding RelativeSource={RelativeSource AncestorType=local:Ad_Aj, Mode=FindAncestor}, Path=Errors}"

我认为您希望将Errors信息放在视图模型中,然后将其设置为数据上下文并使用绑定,因为Errors信息实际上是数据并与UI分开。