现代UI(Metro)图表WPF未显示

时间:2015-03-28 08:14:35

标签: c# .net wpf charts modern-ui

我正在为我的项目使用.NET Framework 4.5和WPF。我需要生成几种类型的图表,所以我想用http://modernuicharts.codeplex.com/库来做这件事。我按照那个codeplex页面中的文档:http://modernuicharts.codeplex.com/documentation完成了步骤。

现在我没有在Visual Studio 13中收到任何类型的错误或警告消息,但只是图表没有显示出来。我只能看到图表的标题和副标题。

此问题的可能原因是什么以及如何纠正?

谢谢

XAML代码:

<Canvas Margin="570,90,29,92" Background="White" >
                <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>
            </Canvas>

ViewModel类,用作dataContext:

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace ModernUIForWPFSample.WithoutBackButton.Views
{
    public class MainViewModel
    {
        public ObservableCollection<TestClass> Errors { get; private set; }

        public MainViewModel()
        {
            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; }        
    }

}

代码Bihind:

public FinalAnalysis()
        {
            InitializeComponent();
            this.DataContext = new MainViewModel();
        }

1 个答案:

答案 0 :(得分:2)

这是一个有效的例子:

App XAML:

<Application x:Class="WpfApplication1.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             StartupUri="MainWindow.xaml"
             xmlns:chart="clr-namespace:De.TorstenMandelkow.MetroChart;assembly=De.TorstenMandelkow.MetroChart">
    <Application.Resources>
        <ResourceDictionary>
            <Style x:Key="MinimalChartStyle" TargetType="chart:ChartBase">
                <Setter Property="Width" Value="500"/>
                <Setter Property="Height" Value="500"/>
            </Style>
        </ResourceDictionary>
    </Application.Resources>
</Application>

MainWindow XAML:

<Window 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        x:Class="WpfApplication1.MainWindow"
        Title="MainWindow" Height="1500" Width="1525"
        xmlns:metroChart="clr-namespace:De.TorstenMandelkow.MetroChart;assembly=De.TorstenMandelkow.MetroChart">


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

</Window>

MainWindow cs:

public MainWindow()
{

    InitializeComponent();
    DataContext = new MainViewModel();
}

MainWindowViewModel与你的相同,我不会复制粘贴在这里。注意装配声明:

 xmlns:metroChart="clr-namespace:De.TorstenMandelkow.MetroChart;assembly=De.TorstenMandelkow.MetroChart"

并且不要忘记在App xaml中添加样式