WPF:如何删除多点后我的图表可见的点

时间:2015-06-17 12:40:49

标签: wpf charts

我每隔一秒通过chart填充timer tick event,这是在开头:

here

ObservableCollection<KeyValuePair<int, int>> points

private void dispatcherTimer_Tick(object sender, EventArgs e)
{
    points.Add(new KeyValuePair<int, int>(0, r.Next(1000)));
    if (points.Count > 60)
        points.RemoveAt(0);
}

我的chart

<Grid>
            <chartingToolkit:Chart Name="lineChart" Margin="16,90,30,483" Background="Transparent" >
                <chartingToolkit:LineSeries Name="seriesChart" DependentValuePath="Value" IndependentValuePath="Key"
                 ItemsSource="{Binding}" IsSelectionEnabled="True" Margin="0,-37,0,37" >
                    <chartingToolkit:LineSeries.Template>
                        <ControlTemplate TargetType="chartingToolkit:LineSeries">
                            <Canvas x:Name="PlotArea">
                                <Polyline x:Name="polyline"
                                          Points="{TemplateBinding Points}" 
                                          Stroke="Yellow" 
                                          StrokeThickness="2"
                                          Style="{TemplateBinding PolylineStyle}" />

                            </Canvas>
                        </ControlTemplate>
                    </chartingToolkit:LineSeries.Template>
                </chartingToolkit:LineSeries>
            </chartingToolkit:Chart>
        </Grid>

在几分钟内,我有太多的观点,我几乎看不到我的chart stroke line所以在60 points代表1分钟后我删除了第一个point所以在这种情况下我的图表将只有60 points,但再过几分钟,这就是我能看到的:

http://s24.postimg.org/v7ous1plx/image.png

1 个答案:

答案 0 :(得分:0)

我在其中一个项目中有一些相关的代码:

<Window x:Class="WPFToolkitProject.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    Title="MainWindow" Height="350" Width="525" Loaded="MainWindow_OnLoaded">
<Grid>
    <Grid.Resources>
        <Style x:Key="EmptyPointsStyle" TargetType="{x:Type chartingToolkit:LineDataPoint}">
            <Setter Property="Template" Value="{x:Null}"/>
        </Style>

        <Style x:Key="aa" TargetType="{x:Type chartingToolkit:LineSeries}">
            <Setter Property="DataPointStyle" Value="{StaticResource EmptyPointsStyle}"/>
            <Setter Property="PolylineStyle">
                <Setter.Value>
                    <Style TargetType="{x:Type Polyline}">
                        <Setter Property="StrokeThickness" Value="2"/>
                        <Setter Property="StrokeMiterLimit" Value="1"/>
                    </Style>
                </Setter.Value>
            </Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type chartingToolkit:LineSeries}">
                        <Canvas x:Name="PlotArea">
                            <Polyline Stroke="{TemplateBinding BorderBrush}" Style="{TemplateBinding PolylineStyle}" Points="{TemplateBinding Points}"/>
                        </Canvas>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>
    <chartingToolkit:Chart  Name="lineChart" Title="Line Series Demo" VerticalAlignment="Top" Margin="50" Height="254">
        <chartingToolkit:LineSeries  DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding points}" IsSelectionEnabled="True"/>
    </chartingToolkit:Chart>
</Grid>

这就是代码隐藏:我正在开始一个新的线程,以避免阻止UI,并在对有界集合进行操作时,在Dispatcher的帮助下返回到它。

public partial class MainWindow : Window
{
    public ObservableCollection<KeyValuePair<int, int>> points { get; set; }

    public MainWindow()
    {
        InitializeComponent();
        points = new ObservableCollection<KeyValuePair<int, int>>();
        points.Add(new KeyValuePair<int, int>(1, 60));
        points.Add(new KeyValuePair<int, int>(2, 20));
        points.Add(new KeyValuePair<int, int>(3, 50));
        points.Add(new KeyValuePair<int, int>(4, 30));
        points.Add(new KeyValuePair<int, int>(5, 40));
        points.Add(new KeyValuePair<int, int>(6, 200));
        points.Add(new KeyValuePair<int, int>(7, 1));
        points.Add(new KeyValuePair<int, int>(8, 450));
        points.Add(new KeyValuePair<int, int>(4, 30));
        points.Add(new KeyValuePair<int, int>(5, 40));

        this.DataContext = this;
    }


    private void MainWindow_OnLoaded(object sender, RoutedEventArgs e)
    {
        #region Adding points at runtime - test

        Task.Run(() =>
        {

            System.Threading.Thread.Sleep(5000);

            int pos = 300;
            var r = new Random();

            for (int i = 0; i < 1000; i++)
            {
                Dispatcher.Invoke(() =>
                {
                    points.Add(new KeyValuePair<int, int>(i, r.Next(1000)));
                    points.RemoveAt(0);
                });
                System.Threading.Thread.Sleep((100));
            }
        });

        #endregion Adding points at runtime - test
    }
}

所以,每次我添加一个点,我都会删除第一个点。它工作正常,但你可以选择另一种方法,不要在每次添加时删除第一种方法。取决于您的需求。