पाइचर्ट नहीं दिखता

Question

मुझे PieChart प्रदर्शित करने की आवश्यकता है, मैं वर्तमान में Modern UI (Metro) Charts का उपयोग कर रहा हूं। मैंने दस्तावेज़ में कोड कॉपी किया था और समस्या यह है कि मैं हमेशा स्क्रीन में सीमा और शीर्षक रखता हूं लेकिन कोई चार्ट नहीं।

XAML

<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> 

सीएस

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; } 
    } 
} 

Answer 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> 

ViewModel:

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 }); 
    } 
} 

संपादित करें: बल्कि की तुलना में अपने ViewModel से पहले के रूप में XAML में बनाए गए हैं, आप भी यह गतिशील रूप से कर सकते हैं इस प्रकार है:

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> 

सीएस:

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

Answer 2

मैं नियंत्रण के साथ एक विशेषज्ञ नहीं हूँ, लेकिन मुझे लगता है कि अनुमान लगा रहा हूँ आपके ItemsSource बाध्यकारी असफल रहा है। Errors संग्रह उपयोगकर्ता के नियंत्रण पर एक संपत्ति के रूप में है और ItemsSource पर आपके बाध्यकारी डिफ़ॉल्ट रूप से DataContext से बाहर जाने जा रहा है जो मैं सोच रहा हूं कि आपके मामले में शून्य है।

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

मैं: एक बाध्यकारी आप की संभावना यह RelativeSource मार्कअप एक्सटेंशन के साथ की तरह (यह सोचते हैं कि आप मैप "स्थानीय" नाम स्थान जहां Ad_Aj स्थित है करने के लिए) कुछ कर रही द्वारा काम करने के लिए मिलता है के माध्यम से सीधे नियंत्रण प्राप्त करने के लिए हालांकि सोचें कि आप एक दृश्य मॉडल में अपनी Errors जानकारी डालना चाहते हैं और उसके बाद डेटा संदर्भ में सेट करें और बाइंडिंग का उपयोग करें क्योंकि आपके पास Errors जानकारी वास्तव में डेटा है और यूआई से अलग है।

Answer 3

तो आप सही रास्ते पर हैं! आप केवल कोड की एक पंक्ति गायब हैं!

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 है, लेकिन यह सच MVVM नहीं है। सही एमवीवीएम में एक अलग व्यू मॉडेल क्लास है।आप यहां क्या कर रहे हैं अपने व्यूमोडेल के रूप में अपने व्यू के कोड-बैहिंड का उपयोग कर रहा है। यह काम करता है, और कोई भी उस पर आपसे लड़ नहीं पाएगा। हालांकि, अगर आप सही एमवीवीएम करने की कोशिश कर रहे हैं, तो आपको अपनी कक्षाएं अलग करने की आवश्यकता होगी।

jstreet has a great answer/example एक्सएएमएल में व्यूमोडेल में अपना डेटाकॉन्टेक्स्ट (उर्फ "बाध्यकारी") कैसे सेट करें।

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

हालांकि, ध्यान दें कि वह एक अलग ViewModel वर्ग उपयोग कर रहा है ले लो। आपके प्रश्न में प्रदान किया गया कोड ऐसा नहीं करता है, इसलिए मुझे यकीन नहीं है कि यह वही तरीका कैसे करें। साथ ही, यह उल्लेखनीय है कि यदि आपकी ViewModel कक्षा कन्स्ट्रक्टर निर्भरता इंजेक्शन का उपयोग करती है या पैरामीटर है, तो आपको इसे काम करने के लिए कुछ जादू का उपयोग करना होगा। यदि ऐसा है, तो इसे केवल निर्माता में सेट करना आसान है।