將平均線，最小線和最大線添加到散點圖

Question

我在wpf，C＃，.NET 3.5中使用ScatterDataPoint圖表，我必須添加3條水平線，最小值，最大值和平均值可以根據我引入的值而有所不同。

基本上我從數據庫中獲取一些值，我必須在圖表中顯示它們，下面你有我開始創建我的應用程序的基本代碼，但我不知道如何添加這3行。

這是XAML代碼：

 <Window.Resources>
        <Style x:Key="BubbleDataPointStyle" TargetType="chartingToolkit:ScatterDataPoint">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="chartingToolkit:ScatterDataPoint">
                        <Viewbox x:Name="viewbox">
                            <Ellipse Width="1px" Height="1px" Fill="Black"/>
                        </Viewbox>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="Width" Value="3"/>
            <Setter Property="Height" Value="3"/>
        </Style>
    </Window.Resources>
    <Grid>
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Margin="0,-28,0,28">
            <Grid Height="921" Background="WhiteSmoke">
                <chartingToolkit:Chart Name="lineChart" Title="Power Graph" Background="WhiteSmoke" Foreground="Black" VerticalAlignment="Top" Margin="16,36,20,0" Height="800"  IsEnabled="True">
                    <chartingToolkit:ScatterSeries Title="Points" ItemsSource="{Binding}"  DependentValueBinding="{Binding Path=Value}" IndependentValueBinding="{Binding Path=Key}" IsSelectionEnabled="True" DataPointStyle="{StaticResource BubbleDataPointStyle}">

                        <chartingToolkit:ScatterSeries.IndependentAxis>
                            <chartingToolkit:LinearAxis Orientation="X" Title="Time (Mins)" Interval="5"  />
                        </chartingToolkit:ScatterSeries.IndependentAxis>
                        <chartingToolkit:ScatterSeries.DependentRangeAxis>
                            <chartingToolkit:LinearAxis Orientation="Y" Title="Lenght" x:Name="Yaxis"/>
                        </chartingToolkit:ScatterSeries.DependentRangeAxis>
                    </chartingToolkit:ScatterSeries>
                </chartingToolkit:Chart>  
            </Grid>
        </ScrollViewer>
    </Grid>
</Window>

這是后面的代碼，現在它只是生成一個隨機點：

 public partial class MainWindow : Window
    {
        DispatcherTimer timer = new DispatcherTimer();
        ObservableCollection<KeyValuePair<double, double>> Power = new ObservableCollection<KeyValuePair<double, double>>();
        public MainWindow()
   `enter code here`     {
            InitializeComponent();
            showColumnChart();

            timer.Interval = new TimeSpan(0,0,0,0,1);  // per 5 seconds, you could change it
            timer.Tick += new EventHandler(timer_Tick);
            timer.IsEnabled = true;

        }


        double i = 1;
        Random random = new Random();
        void timer_Tick(object sender, EventArgs e)
        {

         Power.Add(new KeyValuePair<double, double>(i, random.NextDouble()));
                i += 1;

                if(Power.Count==500)
            {
                timer.IsEnabled = false;

            }

        }

        private void showColumnChart()
        {
            lineChart.DataContext = Power;
        }

    }
}

Answer 1

通常你會使用StripLine ，但工具包似乎沒有。 所以請使用額外的LineSeries ：

XAML：

<Window x:Class="WpfApplication336.MainWindow"
    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:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    xmlns:local="clr-namespace:WpfApplication336"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <Style x:Key="BubbleDataPointStyle" TargetType="chartingToolkit:ScatterDataPoint">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="chartingToolkit:ScatterDataPoint">
                    <Viewbox x:Name="viewbox">
                        <Ellipse Width="1px" Height="1px" Fill="Black"/>
                    </Viewbox>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Width" Value="3"/>
        <Setter Property="Height" Value="3"/>
    </Style>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="10*"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>
    <chartingToolkit:Chart Grid.Row="0" Name="lineChart" Title="Power Graph" Background="WhiteSmoke" Foreground="Black"  IsEnabled="True">

        <chartingToolkit:Chart.Series>

            <chartingToolkit:ScatterSeries Title="Points" ItemsSource="{Binding Power}"  DependentValueBinding="{Binding Path=Value}" IndependentValueBinding="{Binding Path=Key}" IsSelectionEnabled="True" DataPointStyle="{StaticResource BubbleDataPointStyle}"/>
            <chartingToolkit:LineSeries Title="Average" ItemsSource="{Binding PowerAvg}"  DependentValueBinding="{Binding Path=Value}" IndependentValueBinding="{Binding Path=Key}" />

        </chartingToolkit:Chart.Series>

    </chartingToolkit:Chart>

    <Button Grid.Row="1" Click="Button_Click">START</Button>
</Grid>

視圖模型：

public class MyViewModel
{
    public ObservableCollection<KeyValuePair<double, double>> Power { get; set; }
    public ObservableCollection<KeyValuePair<double, double>> PowerAvg { get; set; }

    public MyViewModel()
    {
        Power = new ObservableCollection<KeyValuePair<double, double>>();
        PowerAvg = new ObservableCollection<KeyValuePair<double, double>>();
    }

    public void Add(double x, double y)
    {
        Power.Add(new KeyValuePair<double, double>(x, y));

        double xmin = Power.Min(kvp => kvp.Key);
        double xmax = Power.Max(kvp => kvp.Key);

        double ymin = Power.Min(kvp => kvp.Value);
        double ymax = Power.Max(kvp => kvp.Value);
        double yavg = Power.Average(kvp => kvp.Value);

        PowerAvg.Clear(); 
        PowerAvg.Add(new KeyValuePair<double, double>(xmin, yavg));
        PowerAvg.Add(new KeyValuePair<double, double>(xmax, yavg));
    }
}

主窗口：

public partial class MainWindow : Window
{
    DispatcherTimer timer = new DispatcherTimer();
    MyViewModel vm;

    public MainWindow()
    {
        InitializeComponent();

        vm = new MyViewModel();
        DataContext = vm;

        //showColumnChart();

        timer.Interval = new TimeSpan(0, 0, 0, 0, 1);  // per 5 seconds, you could change it
        timer.Tick += new EventHandler(timer_Tick);
        //timer.IsEnabled = true;
    }


    double i = 1;
    Random random = new Random();
    void timer_Tick(object sender, EventArgs e)
    {

        vm.Add(i, random.NextDouble());
        i += 1;

        if (vm.Power.Count == 250)
        {
            timer.Stop();

        }

    }

    private void showColumnChart()
    {
        lineChart.DataContext = vm;
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        timer.Start();
    }
}

您可以輕松地為min和max添加額外的LineSeries ，就像我們對平均值一樣。