chartingToolkit : 각 원형의 값을 표시하는 방법을 차트로 표시합니다.

Question

저는 PieChart를 그리는 데 System.Windows.Controls.DataVisualization.Charting을 사용하고 있습니다. 그러나 각 파이 슬라이스의 비율/값을 차트에 표시하는 방법을 모르겠습니다. 그게 가능합니까?

Answer 1

레이블을 관리하기위한 속성이 없으므로 System.Windows.Controls.DataVisualization.Charting PieChart에 비율을 추가하는 것은 그렇게 당황하지 않습니다.

어쨌든 목표 달성에 몇 가지 방법이 있습니다. 나는 내가 사용했던 것을 설명하기 위해 article on my blog를 썼다. 원래 Geometry로는 (비율로)를 FormattedText 형상을 추가합니다 볼 수 있듯이

public class PieDataPoint : System.Windows.Controls.DataVisualization.Charting.PieDataPoint 
{ 
    public static readonly DependencyProperty TextedGeometryProperty = 
     DependencyProperty.Register("TextedGeometry", typeof(Geometry), typeof(PieDataPoint)); 

    public Geometry TextedGeometry 
    { 
     get { return (Geometry)GetValue(TextedGeometryProperty); } 
     set { SetValue(TextedGeometryProperty, value); } 
    } 

    static PieDataPoint() 
    { 
     DefaultStyleKeyProperty.OverrideMetadata(typeof(PieDataPoint), 
      new FrameworkPropertyMetadata(typeof(PieDataPoint))); 
    } 

    public PieDataPoint() 
    { 
     DependencyPropertyDescriptor dependencyPropertyDescriptor 
      = DependencyPropertyDescriptor.FromProperty(GeometryProperty, GetType()); 

     dependencyPropertyDescriptor.AddValueChanged(this, OnGeometryValueChanged); 
    } 

    private double LabelFontSize 
    { 
     get 
     { 
      FrameworkElement parentFrameworkElement = Parent as FrameworkElement; 
      return Math.Max(8, Math.Min(parentFrameworkElement.ActualWidth, 
       parentFrameworkElement.ActualHeight)/30); 
     } 
    } 

    private void OnGeometryValueChanged(object sender, EventArgs arg) 
    { 
     Point point; 
     FormattedText formattedText; 

     CombinedGeometry combinedGeometry = new CombinedGeometry(); 
     combinedGeometry.GeometryCombineMode = GeometryCombineMode.Exclude; 

     formattedText = new FormattedText(FormattedRatio, 
      CultureInfo.CurrentCulture, 
      FlowDirection.LeftToRight, 
      new Typeface("Arial"), 
      LabelFontSize, 
      Brushes.White); 

     if (ActualRatio == 1) 
     { 
      EllipseGeometry ellipseGeometry = Geometry as EllipseGeometry; 

      point = new Point(ellipseGeometry.Center.X - formattedText.Width/2, 
       ellipseGeometry.Center.Y - formattedText.Height/2); 
     } 
     else if (ActualRatio == 0) 
     { 
      TextedGeometry = null; 
      return; 
     } 
     else 
     { 
      Point tangent; 
      Point half; 
      Point origin; 

      PathGeometry pathGeometry = Geometry as PathGeometry; 
      pathGeometry.GetPointAtFractionLength(.5, out half, out tangent); 
      pathGeometry.GetPointAtFractionLength(0, out origin, out tangent); 

      point = new Point(origin.X + ((half.X - origin.X)/2) - formattedText.Width/2, 
       origin.Y + ((half.Y - origin.Y)/2) - formattedText.Height/2); 

     } 

     combinedGeometry.Geometry1 = Geometry; 
     combinedGeometry.Geometry2 = formattedText.BuildGeometry(point); 

     TextedGeometry = combinedGeometry; 
    } 
} 

:

첫 번째 단계는 사용자 정의 PieDataPoint 클래스를 만드는 것입니다. 그런 다음 새 지오메트리 속성 (이름이 TextedGeometry)을 사용하기 위해 기본 스타일 (generic.xaml 사전에 있음)을 만들어야합니다.

<Path Name="Slice" Data="{TemplateBinding local:PieDataPoint.TextedGeometry}" 
      Fill="{TemplateBinding Control.Background}" 
      Stroke="{TemplateBinding Control.BorderBrush}" 
      StrokeMiterLimit="1"> 
    <ToolTipService.ToolTip> 
     <StackPanel> 
      <ContentControl Content="{TemplateBinding chartingToolkit:DataPoint.FormattedDependentValue}" /> 
      <ContentControl Content="{TemplateBinding chartingToolkit:PieDataPoint.FormattedRatio}" /> 
     </StackPanel> 
    </ToolTipService.ToolTip> 
</Path> 

는 "슬라이스"경로 TextedGeometry에 바인더 제본의 Data 속성이 볼 수 있듯이 : - 이상 - 그런 일을

스타일은 포함한다.

지금 사용자 정의 PieSeries으로 우리가 사용하는 Chart 제어를 강제 할 수 우리의 PieDataPoint :

public class PieSeries : System.Windows.Controls.DataVisualization.Charting.PieSeries 
{ 
    protected override DataPoint CreateDataPoint() 
    { 
     return new PieDataPoint(); 
    } 
} 

그래서 당신의 XAML에서 사용할 수 : local 사용자 정의 네임 스페이스를 참조

<chartingToolkit:Chart Name="pieChart" Title="Pie Series Demo"> 
    <local:PieSeries DependentValuePath="Value" IndependentValuePath="Key" 
         ItemsSource="{Binding}" IsSelectionEnabled="True" /> 

</chartingToolkit:Chart> 

. 나는 그것이 당신을 도울 수 있기를 바랍니다.