2011-03-03 1 views
0

Silverlight에서 대시 보드를 만들고 있습니다. 나는 다음과 같이 파이 차트를 만들려고 오전 :Silverlight에서 PieChart 만들기

<ria:DomainDataSource AutoLoad="True" Name="orderDomainDataSource" 
    QueryName="GetOrdersQuery"> 
    <ria:DomainDataSource.DomainContext> 
    <my:PresentationDomainContext /> 
    </ria:DomainDataSource.DomainContext> 
</ria:DomainDataSource> 
<toolkit:Chart Name="chart1" Title=""> 
    <toolkit:Chart.Series> 
    <toolkit:PieSeries 
    ItemsSource="{Binding ElementName=orderDomainDataSource, Path=Data}" 
    IndependentValueBinding="{Binding Path=OrderDate.Month}" 
    DependentValueBinding="{Binding Path=TotalAmount}" /> 
    </toolkit:Chart.Series> 
</toolkit:Chart> 

내 데이터 소스 주문의 수백이있다. 주문은 3 개월에 걸쳐 있습니다. 월별로 파이 조각을 그룹화하고 싶습니다. 이러한 이유 때문에 IndependentValueBinding을 OrderDate.Month로 설정했습니다. 그러나 항목이 자동으로 그룹화되지 않는 것으로 나타났습니다. 이 방식으로 금액을 표시하려면 월별로 데이터를 선언적으로 그룹화하려면 어떻게합니까?

도움을 주셔서 감사합니다.

답변

2

툴킷의 차트는 제공된 데이터 차트 만 제공하도록 설계되었습니다. 그것은 당신을 위해 어떤 집계도하지 않습니다, 당신은 차트에 그것을 공급하기 전에 데이터를 완료해야합니다.

이 경우 월별 총 개체 수와 함께 한 달에 하나의 개체 만 포함하는 컬렉션을 반환하는 새 쿼리 메서드를 만들어야합니다.

1

OrderTable에 OrderDate 및 TotalAmount라는 두 개의 열이 있다고 가정합니다 (DataSource).

이제 월별 데이터를 그룹화하는 쿼리를 작성해야합니다. 특정 연도의 3 개월 동안 데이터를 저장 했으므로 여기에서 1 년 동안 돌볼 필요가 없을 수도 있습니다. 따라서 월간 총 금액 계산을위한 LINQ 쿼리는 아래와 같습니다. I, 그래서이 예에서 다음 Visifire

를 사용하여이 원형 차트의 예를 생성하기 전에 Visifire으로 처리 하였다

var totalAmountByMonth = (from record in orders 
           group record by record.Date.Month 
            into groupedOrder 
            select new KeyValuePair<String, Double> 
            (groupedOrder.First().Date.ToString("MMMM"), 
            groupedOrder.Sum(a => a.Amount))); 

결과 폼의 이름 값 쌍으로 주문을 추출하여 누적 totalAmountByMonth에 저장된 . 이것은 AxisXLabel을 Month와 Amount로 YValue로 만들어 차트에 바인딩됩니다. 아래 코드는 다음과 같습니다.

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
using Visifire.Charts; 

namespace BindingDemo 
{ 
    public partial class MainPage : UserControl 
    { 
     public MainPage() 
     { 
      InitializeComponent(); 

      // Temp list of orders 
      List<Order> orders = new List<Order>(); 

      orders.Add(new Order() { Date = new DateTime(2010, 1, 1), Amount = 1213 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 1, 3), Amount = 1273 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 1, 4), Amount = 1253 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 1, 5), Amount = 213 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 1, 5), Amount = 1300 }); 

      orders.Add(new Order() { Date = new DateTime(2010, 2, 1), Amount = 1213 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 2, 3), Amount = 1255 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 2, 4), Amount = 1290 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 2, 5), Amount = 1731 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 2, 5), Amount = 2173 }); 

      orders.Add(new Order() { Date = new DateTime(2010, 3, 1), Amount = 1213 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 3, 3), Amount = 1243 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 3, 4), Amount = 1263 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 3, 5), Amount = 1273 }); 
      orders.Add(new Order() { Date = new DateTime(2010, 3, 5), Amount = 1233 }); 

      var totalAmountByMonth = (from record in orders 
             group record by record.Date.Month 
              into groupedOrder 
              select new KeyValuePair<String, Double>(groupedOrder.First().Date.ToString("MMMM"), 
               groupedOrder.Sum(a => a.Amount))); 

      // Setting DataContext of Chart 
      chart.DataContext = totalAmountByMonth; 

     } 

     public class Order 
     { 
      public DateTime Date; 
      public int Amount; 

     } 
    } 
} 

: XAML :

<vc:Chart Name="chart" Width="500" Height="300" Theme="Theme1" View3D="True"> 
    <vc:Chart.Series> 
     <vc:DataSeries RenderAs="Pie" DataSource="{Binding}"> 
      <vc:DataSeries.DataMappings> 
       <vc:DataMapping MemberName="AxisXLabel" Path="Key"></vc:DataMapping> 
       <vc:DataMapping MemberName="YValue" Path="Value"></vc:DataMapping> 
      </vc:DataSeries.DataMappings> 
     </vc:DataSeries> 
    </vc:Chart.Series> 
</vc:Chart> 

출력 :

enter image description here