WPF 290万数据点走势曲线图绘制及水平滚动条实现
以下是一个简单的WPF走势曲线图代码,其中包含了水平滚动条的实现:
XAML代码:
<Window x:Class='WpfApp1.MainWindow'
xmlns='http://schemas.microsoft.com/winfx/2006/xaml/presentation'
xmlns:x='http://schemas.microsoft.com/winfx/2006/xaml'
Title='MainWindow' Height='450' Width='800'>
<Grid>
<ScrollViewer VerticalScrollBarVisibility='Auto' HorizontalScrollBarVisibility='Auto'>
<Canvas Name='canvas' Width='3000' Height='3000'/>
</ScrollViewer>
</Grid>
</Window>
C#代码:
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
namespace WpfApp1
{
public partial class MainWindow : Window
{
private const int DataCount = 2900000;
private const double XScale = 0.1;
private const double YScale = 0.1;
private const double Margin = 50;
private const double PointRadius = 2;
private double[] xData = new double[DataCount];
private double[] yData = new double[DataCount];
public MainWindow()
{
InitializeComponent();
// 生成测试数据
Random random = new Random();
for (int i = 0; i < DataCount; i++)
{
xData[i] = i * XScale;
yData[i] = random.NextDouble() * 100 * YScale;
}
// 绘制坐标轴
DrawAxis();
// 绘制曲线
DrawCurve();
}
private void DrawAxis()
{
// 绘制X轴
Line xLine = new Line
{
X1 = Margin,
Y1 = canvas.Height - Margin,
X2 = canvas.Width - Margin,
Y2 = canvas.Height - Margin,
Stroke = Brushes.Black,
StrokeThickness = 1
};
canvas.Children.Add(xLine);
// 绘制Y轴
Line yLine = new Line
{
X1 = Margin,
Y1 = canvas.Height - Margin,
X2 = Margin,
Y2 = Margin,
Stroke = Brushes.Black,
StrokeThickness = 1
};
canvas.Children.Add(yLine);
// 绘制X轴刻度
for (int i = 0; i < DataCount; i += 100)
{
double x = i * XScale;
Line tick = new Line
{
X1 = x + Margin,
Y1 = canvas.Height - Margin,
X2 = x + Margin,
Y2 = canvas.Height - Margin + 5,
Stroke = Brushes.Black,
StrokeThickness = 1
};
canvas.Children.Add(tick);
}
// 绘制Y轴刻度
for (int i = 0; i < 100; i += 10)
{
double y = i * YScale;
Line tick = new Line
{
X1 = Margin,
Y1 = canvas.Height - Margin - y,
X2 = Margin - 5,
Y2 = canvas.Height - Margin - y,
Stroke = Brushes.Black,
StrokeThickness = 1
};
canvas.Children.Add(tick);
}
}
private void DrawCurve()
{
Polyline curve = new Polyline
{
Stroke = Brushes.Red,
StrokeThickness = 1
};
for (int i = 0; i < DataCount; i++)
{
double x = xData[i];
double y = yData[i];
Point point = new Point(Margin + x, canvas.Height - Margin - y);
curve.Points.Add(point);
}
canvas.Children.Add(curve);
}
}
}
这段代码会生成一个带有水平滚动条的窗口,其中包含了一条随机生成的走势曲线。X轴表示数据的序号,Y轴表示数据的值。水平滚动条可以让用户在横向上滚动窗口,查看曲线的不同部分。
注意:
- 此代码示例仅用于演示,实际应用中需要根据实际数据进行调整。
- 290万数据点的绘制可能会导致性能问题,需要优化代码和图形渲染方式。
- 可以通过添加事件处理程序来实现鼠标悬停显示数据等功能。
- 还可以考虑使用其他图表库来实现更强大的数据可视化功能。
原文地址: https://www.cveoy.top/t/topic/jM7V 著作权归作者所有。请勿转载和采集!