c# - WPF 座標系の更新

Question

キャンバス要素に座標系を作成しました。得られた値ごとに赤い点を描き、それを古い点と結び付けます。

ここを参照してください：

私は毎秒約10個の値を取得しています。

1 つの値 = 1 ピクセル

赤い線は値を表しています。テスト用に一定の値を取得しています。

私の目標は、座標系の終わりに達したときに図面を更新することです。図面を左に押して、次の点を描きたいです。

私の目標は：

• 後でズームインおよびズームアウトしたいので、グラフのポイントを失いたくない
• システムの速度をできるだけ低下させたくない...

これは私のコードですが、最後の部分でグラフを更新する方法がわかりません....

        static double xOld = 32;
        static double yOld = 580;
        static double t = 32;
        System.Windows.Shapes.Path path;
        static GeometryGroup lineGroupDrw1 = new GeometryGroup();
        ....


  public void drawPoly(double value)
    {

            //increase point position
            t++;


            //generate 2 point for the connection
            Point pOne = new Point(xOld, yOld);
            Point pTwo = new Point(t, value);

            //connect old point with new
            GeometryGroup lineGroup = new GeometryGroup();
            LineGeometry connectorGeometry = new LineGeometry();
            connectorGeometry.StartPoint = pOne;
            connectorGeometry.EndPoint = pTwo;
            lineGroup.Children.Add(connectorGeometry);
            path = new System.Windows.Shapes.Path();
            path.Data = lineGroup;
            path.StrokeThickness = 1;
            path.Stroke = path.Fill = Brushes.Red;


            //fill the static linegroup with a new point
            lineGroupDrw1.Children.Add(connectorGeometry);

            if (coordinateSystem.Width > t)
            {
                // draw graph
                coordinateSystem.Children.Add(path);
            }
            else 
            {
                //To do : update drawing
                updateDrawingEnd();
            }

            //refresh values
            xOld = t;
            yOld = value;

        }
           ....

          public void updateDrawingEnd() 
        {
            path = new System.Windows.Shapes.Path();
            path.Data = lineGroupDrw1;
            path.StrokeThickness = 1;
            path.Stroke = path.Fill = Brushes.Yellow;

            coordinateSystem.Children.Add(path);
            t = 145;
        }

Answer 1

UI を scrollviewer 内に配置するだけです。行を「移動」しようとすることを忘れてください。

<Window x:Class="MiscSamples.SignalGraph"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="SignalGraph" Height="300" Width="300">
    <ScrollViewer VerticalScrollBarVisibility="Auto"
                  HorizontalScrollBarVisibility="Auto">
        <Grid x:Name="coordinateSystem">

        </Grid>
    </ScrollViewer>
</Window>

コード ビハインド (コードから取得し、少し改善)

 public partial class SignalGraph : Window
    {
        private System.Threading.Timer timer;
        private Random random = new Random();

        public SignalGraph()
        {
            InitializeComponent();

            timer = new System.Threading.Timer(x => DrawRandomLine(), null, 0, 100);
        }

        private void DrawRandomLine()
        {
            Dispatcher.BeginInvoke((Action) (() => drawPoly(random.Next(0,100))), null);
        }

        static double xOld = 32;
        static double yOld = 580;
        static double t = 32;
        Path path;
        static GeometryGroup lineGroupDrw1 = new GeometryGroup();

        public void drawPoly(double value)
        {
            //increase point position
            t = t+5;


            //generate 2 point for the connection
            var pOne = new Point(xOld, yOld);
            var pTwo = new Point(t, value);

            //connect old point with new
            var lineGroup = new GeometryGroup();

            var connectorGeometry = new LineGeometry {StartPoint = pOne, EndPoint = pTwo};

            lineGroup.Children.Add(connectorGeometry);
            path = new Path
                       {
                           Data = lineGroup, 
                           StrokeThickness = 1,
                           Stroke = Brushes.Red,
                           Fill = Brushes.Red
                       };

            //fill the static linegroup with a new point
            lineGroupDrw1.Children.Add(connectorGeometry);

            //if (coordinateSystem.ActualWidth > t)
            //{
                // draw graph
                coordinateSystem.Children.Add(path);
            //}
            //else 
            //{
            //    //To do : update drawing
            //    updateDrawingEnd();
            //}

            //refresh values
            xOld = t;
            yOld = value;

        }
    }

結果：