CsGrafeq: 比 Desmos 更"能折腾"的几何函数画板（.NET + Avalonia）
作为一名编程讲师，我经常需要向学生展示函数图像和几何变换。Desmos 虽然好用，但总让人感觉"不够折腾"------你不能自定义渲染管线，不能嵌入自己的算法，也不能在离线环境下做深度计算。今天，我要介绍一个开源项目 CsGrafeq ，它基于 .NET 和 Avalonia 框架，让你从底层控制函数绘图，甚至可以用 C# 编写自定义扩展。## 什么是 CsGrafeq？CsGrafeq 是一个跨平台的几何函数画板应用，使用 C# 语言编写，UI 框架采用 Avalonia（支持 Windows、macOS、Linux）。与 Desmos 相比，它的核心优势在于：- 完全可控的渲染流程 ：你可以修改着色器、坐标系变换逻辑- 可编程性 ：内置脚本支持，能动态生成复杂的参数方程- 开源 ：代码托管在 GitHub，可自由修改和分发接下来，我们将从基础概念开始，一步步掌握它的核心用法。## 基础概念：坐标系统与函数定义在 CsGrafeq 中，所有图形都基于"数学坐标系统"。默认情况下，屏幕中心是原点 (0,0)，x 轴向右，y 轴向上。你可以通过鼠标滚轮缩放，拖拽平移。### 示例 1：绘制基础函数图像打开 CsGrafeq，在左侧的表达式输入框中，直接输入函数公式即可。例如，绘制一个正弦波：plaintexty = sin(x)按下回车，图像立刻显示。但这只是基础，CsGrafeq 的真正威力在于 参数化 和 动态更新 。### 示例 2：使用 C# 脚本绘制动态曲线CsGrafeq 支持在"脚本面板"中编写 C# 代码，动态生成图形。下面是一个完整的可运行示例，它绘制一个随参数 t 变化的螺旋线：csharp// 在 CsGrafeq 的脚本面板中运行// 定义参数 t，范围 0 到 4πdouble t = 0;double step = 0.01;// 创建一个点集合来存储轨迹List<Point> points = new List<Point>();// 循环生成螺旋点while (t < 4 * Math.PI){ double x = t * Math.Cos(t); // 极坐标转直角坐标 double y = t * Math.Sin(t); points.Add(new Point(x, y)); t += step;}// 将点集添加到画板Graph.AddPoints(points, color: "blue", thickness: 2);这段代码展示了如何用循环生成坐标点，并一次性渲染。注意，CsGrafeq 的 Graph 对象提供了 AddPoints 方法，允许你批量绘制。## 中级用法：自定义变换与交互CsGrafeq 允许你重写坐标变换逻辑。例如，你想实现一个"鱼眼"扭曲效果，让图像在中心区域放大。### 示例 3：自定义坐标变换在脚本中，你可以重写 Transform 方法：csharp// 自定义变换：鱼眼效果double fisheye(double x, double y){ double r = Math.Sqrt(x * x + y * y); // 计算到原点的距离 double scale = 1.0 + 0.5 * r; // 距离越远，放大倍数越大 return new Point(x * scale, y * scale);}// 应用变换到整个坐标系Graph.SetTransform(fisheye);之后，所有绘制的图形都会自动应用这个扭曲效果。你可以实时修改 scale 系数，观察图像变化。## 高级应用：实现分形与迭代函数系统结合 .NET 的强大计算能力，CsGrafeq 可以轻松绘制分形。下面是一个使用迭代函数系统（IFS）生成谢尔宾斯基三角形的例子：csharp// 谢尔宾斯基三角形 IFSRandom rand = new Random();Point current = new Point(0, 0); // 起始点// 定义三个仿射变换Func<Point, Point>[] transforms = new Func<Point, Point>[]{ p => new Point(p.x / 2, p.y / 2), // 左上 p => new Point(p.x / 2 + 0.5, p.y / 2), // 右上 p => new Point(p.x / 2 + 0.25, p.y / 2 + 0.433) // 底部};// 迭代生成 50000 个点List<Point> points = new List<Point>();for (int i = 0; i < 50000; i++){ int index = rand.Next(3); // 随机选择一个变换 current = transforms[index](current); points.Add(current);}// 绘制到画板Graph.AddPoints(points, color: "red", size: 1);这个例子展示了如何用随机迭代生成分形。注意，由于点数量大，建议先收集再一次性渲染，以提高性能。## 深入定制：着色器与性能优化对于高级用户，CsGrafeq 支持自定义 GPU 着色器（通过 .NET 的 SkiaSharp 绑定）。你可以编写 GLSL 代码来控制每个像素的颜色。例如，实现一个"热力图"效果：glsl// 自定义片段着色器（伪代码）uniform vec2 resolution;void main() { vec2 pos = (gl_FragCoord.xy / resolution) * 2.0 - 1.0; float dist = length(pos); gl_FragColor = vec4(dist, 0.0, 1.0 - dist, 1.0);}在 CsGrafeq 中，你可以将这段着色器代码加载到渲染管线中，实现动态颜色映射。## 总结CsGrafeq 是一个比 Desmos 更"能折腾"的几何函数画板，它基于 .NET 和 Avalonia，提供了从基础绘图到高级自定义的完整能力。通过本文，你学会了：- 基础函数绘制和参数化曲线- 使用 C# 脚本生成动态图形- 自定义坐标变换实现扭曲效果- 迭代函数系统生成分形- 着色器级别的渲染控制对于编程讲师和学习者来说，CsGrafeq 不仅是教学工具，更是一个可扩展的实验平台。你可以让学生直接修改代码，观察即时反馈，从而深入理解数学与编程的结合。如果你喜欢折腾，不妨下载源码，尝试添加自己的功能------毕竟，能动手的才是最好的学习方式。