WPF线系列图表-不同样式的数据点

本文关键字：样式 数据 系列 WPF | 更新日期: 2023-09-27 18:18:47

我正在创建一个WPF/c#图形(使用图表工具包)，显示学生的分数。我要找的是，如果标记低于50，数据点应该显示一个椭圆，高于50，它应该显示一个矩形。目前，它显示矩形的所有值。

XAML是:

<chartingToolkit:Chart Background="{x:Null}" Name="lineChart" Title="Students Result" 
                        VerticalAlignment="Top" Height="450" Width="550">
        <chartingToolkit:LineSeries Name="StudentMarks" Title="Student Marks" Background="Transparent"
                                            DependentValuePath="Value"
                                            IndependentValuePath="Key"
                                            ItemsSource="{Binding [0]}">
            <chartingToolkit:LineSeries.DataPointStyle>
                <Style TargetType="chartingToolkit:LineDataPoint">
                    <Setter Property="Background" Value="DarkBlue"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="chartingToolkit:LineDataPoint">
                                <Grid x:Name="grdDataPointRect">
                                    <Rectangle x:Name="passed" Fill="{TemplateBinding Background}" Stroke="Black"/>
                                    <Ellipse x:Name="failed" Width="5" Height="5" Stroke="Green" StrokeThickness="1"
                                     Fill="Green" Visibility="Hidden"></Ellipse>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </chartingToolkit:LineSeries.DataPointStyle>
        </chartingToolkit:LineSeries>
        <chartingToolkit:Chart.Axes>
            <chartingToolkit:LinearAxis Name="xAxis" Orientation="X" ShowGridLines="True" 
                                Minimum="1" Maximum="5" Interval="1" Title="Students" />
            <chartingToolkit:LinearAxis Name="yAxis" Orientation="Y" ShowGridLines="True" 
                                Minimum="10" Maximum="100" Interval="10" Title="Marks" />
        </chartingToolkit:Chart.Axes>
    </chartingToolkit:Chart>

c#代码是:

       private void DrawGraph()
    {
        List<KeyValuePair<int, int>> Students1 = new List<KeyValuePair<int, int>>();
        List<KeyValuePair<int, int>> Students2 = new List<KeyValuePair<int, int>>();
        var dataSourceList = new List<List<KeyValuePair<int, int>>>();
        Students1.Add(new KeyValuePair<int, int>(1, 40));
        Students1.Add(new KeyValuePair<int, int>(2, 70));
        Students1.Add(new KeyValuePair<int, int>(3, 55));
        Students1.Add(new KeyValuePair<int, int>(4, 35));
        Students1.Add(new KeyValuePair<int, int>(5, 80));
        // if marks are less then 50
        // change datapointstyle to ellipse from rectangle
        dataSourceList.Add(Students1);
        lineChart.DataContext = dataSourceList;
    }

请导游。

WPF线系列图表-不同样式的数据点

如果图表设计正确，每个DataPoint中的DataContext应该是您为图表设置的List<KeyValuePair<int,int>>中的每个数据项。因此，您可以使用Converter来确定数据项的标记是否低于50。转换器只是检查输入标记并输出一个bool值，例如当它为真时，意味着学生通过:

public class MarkToPassedConverter : IValueConverter {
   public object Convert(object value, Type targetType, object parameter, 
                         CultureInfo culture){
       var mark = (int) value;
       return mark >= 50;
   }
   public object ConvertBack(object value, Type targetType, object parameter, 
                             CultureInfo culture){
       throw new NotImplementedException();
   }
}

在XAML中将Converter声明为某种资源，假设它的名称空间在XAML中声明为local:

<local:MarkToPassedConverter x:Key="m2p"/>

使用ControlTemplate's Trigger来切换Visibility的2个形状，根据输入标记指示不同的状态:

<ControlTemplate TargetType="chartingToolkit:LineDataPoint">
     <Grid x:Name="grdDataPointRect">
         <Rectangle x:Name="passed" Fill="{TemplateBinding Background}" Stroke="Black" Visibility="Hidden"/>
         <Ellipse x:Name="failed" Width="5" Height="5" Stroke="Green" StrokeThickness="1"
                                 Fill="Green" Visibility="Visible"></Ellipse>
     </Grid>
     <ControlTemplate.Triggers>
         <DataTrigger Binding="{Binding Value, Converter={StaticResource m2p}}" Value="True">
             <Setter TargetName="passed" Property="Visibility" Value="Visible"/>
             <Setter TargetName="failed" Property="Visibility" Value="Hidden"/>
         </DataTrigger>             
     </ControlTemplate.Triggers>
</ControlTemplate>

注意passed的Visibility默认是隐藏的

相关文章：