如何根据用户输入使用现代 UI 图表生成图表

Question

我正在开发一个涉及根据用户输入生成图表的程序。应根据用户提供的输入从数据库中检索这些图表的数据。我正在使用现代 UI 图表库来生成图表。您可以在此处找到图书馆 http://modernuicharts.codeplex.com/

这是我的 mainWindow.xaml 的屏幕截图： http://imgur.com/eQUBl9w

用户在这里选择他想要的图形类型和模式，并且应该根据数据库中可用的数据生成所需的图形。目前，我已经按照link 上方的现代ui 图表教程进行操作，并且能够仅为一个不基于用户输入的LINQ 查询生成图表。如何在运行时间获取用户输入并根据它们执行不同的查询并在运行时间绑定数据。

这是我的 mainWindo.xaml.cs

public partial class MainWindow : UserControl
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new ChartController();
    }
}

ChartController.CS

public class ChartController : INotifyPropertyChanged
{
    public ObservableCollection<string> ChartTypes { get; set; }

    public ChartController()
    {
        ChartTypes = new ObservableCollection<string>();
        ChartTypes.Add("Pie");
        ChartTypes.Add("Doughnut");
        ChartTypes.Add("Clustered Bar");
        ChartTypes.Add("Clustered Column");
        ChartTypes.Add("Stacked Bar");
        ChartTypes.Add("Stacked Column");
        ChartTypes.Add("Stacked Bar Percentage");
        ChartTypes.Add("Stacked Column Percentage");
    }

    private string _simpleStringProperty;
    public string SimpleStringProperty
    {
        get { return _simpleStringProperty; }
        set
        {
            _simpleStringProperty = value;
            if (value.Equals("Pie"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\PieChart.xaml", UriKind.Relative);
            }
            if (value.Equals("Doughnut"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\DoughnutChart.xaml", UriKind.Relative);
            }
            if (value.Equals("Clustered Column"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\ClusteredColumnChart.xaml", UriKind.Relative);
            }
            if (value.Equals("Clustered Bar"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\ClusteredBarChart.xaml", UriKind.Relative);
            }
            if (value.Equals("Stacked Bar"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\StackedBarChart.xaml", UriKind.Relative);
            }
            if (value.Equals("Stacked Column"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\StackedColumnChart.xaml", UriKind.Relative);
            }
            if (value.Equals("Stacked Bar Percentage"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\StackedBarChart100Percent.xaml", UriKind.Relative);
            }
            if (value.Equals("Stacked Column Percentage"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\StackedColumnChart100Percent.xaml", UriKind.Relative);
            }
            if (value.Equals("Radial Gauge"))
            {
                SelectedPageChart = new Uri("..\Graphs\GraphTemplates\RadialGaugeChart.xaml", UriKind.Relative);
            }
            OnPropertyChanged("SimpleStringProperty");

        }
    }

    private Uri _selectedPageChart;
    public Uri SelectedPageChart
    {
        get { return _selectedPageChart; }
        set
        {
            _selectedPageChart = value;
            OnPropertyChanged("SelectedPageChart");
        }
    }
    protected void OnPropertyChanged(string name)
    {
        PropertyChangedEventHandler handler = PropertyChanged;
        if (handler != null)
        {
            handler(this, new PropertyChangedEventArgs(name));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

}

PieChart.xaml

<Grid>

    <metroChart:PieChart
Style="{StaticResource MinimalChartStyle}"
ChartTitle="Minimal Pie Chart"
SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}" >
        <metroChart:PieChart.Series>
            <metroChart:ChartSeries
        SeriesTitle="Errors"
        DisplayMember="Year"
        ValueMember="Cost"
        ItemsSource="{Binding Path=Errors}" />
        </metroChart:PieChart.Series>
    </metroChart:PieChart>

</Grid>

PieChart.xaml.cs

public Page1()
    {
        InitializeComponent();
        DataContext = new ChartViewModel();
    }

chartViewModel.cs

  namespace ModernUIForWPFSample.WithoutBackButton.Graphs.ViewModels
{
public class ChartViewModel
{
    public ObservableCollection<stockLotsCostByYear> Errors { get; private set; }
    public ChartViewModel()
    {
        adoraDBContext _c = new adoraDBContext();
        var result = from ps in _c.PurchasingShipments
                  group ps by ps.date.Value.Year into grp
                  select new
                  {
                      Year = grp.Key,
                      Cost = grp.Sum(x => x.NoOfPieces * x.PricePerPiece + x.Micelleneous + x.TransportCost + x.SupplierCommission)
                  }; 

        Errors = new ObservableCollection<stockLotsCostByYear>();

        foreach (var d in result)
            Errors.Add(new stockLotsCostByYear() { Year = d.Year, Cost = d.Cost });

    }

    private object selectedItem = null;
    public object SelectedItem
    {
        get
        {
            return selectedItem;
        }
        set
        {
            selectedItem = value;
        }
    }
    public class TestClass
    {
        public string Category { get; set; }

        public int Number { get; set; }
    }

    public class stockLotsCostByYear
    {
        public int Year { get; set; }

        public decimal? Cost { get; set; }
    }
}

}

Answer 1

未测试，但应该是这样的：

SelectedPageChart = new Uri("..\Graphs\GraphTemplates\StackedBarChart.xaml?parameter=test", UriKind.Relative)

在 StackedBarChart cs 中：

protected override void OnNavigatedTo(NavigationEventArgs e)
{
       string parameter = string.Empty;
    if (NavigationContext.QueryString.TryGetValue("parameter", out parameter)) {
        this.label.Text = parameter;
    }
}

如何根据用户输入使用现代 UI 图表生成图表

How generate Graphs using modern UI Charts according to user inputs

c#

wpf

charts

xaml