如何在 WPF 中绘制 3D 曲线? [英] How to draw a 3D curve in WPF?
问题描述
是否可以在 WPF 中绘制 3D 曲线?即我需要哪些课程?你能给我一些代码片段吗.
Is it possible to draw a 3D curve in WPF? i.e. Which classes do I need? Can you give me so code snippets.
推荐答案
要在 WPF 中渲染 3D 场景，您必须使用一个名为 ViewPort3D 的元素.这有一个 Camera，一个 Visual3D 的集合.Visual3D 的具体子类型是 ModelVisual3D.此视觉效果有助于呈现 Model3D.所有 3D 形状都由 GeometryModel3D 或更复杂的 Model3DGroup 表示(均源自 Model3D).我们只关心这里的属性 GeometryModel3D.Geometry(Geometry3D 类型).目前，WPF 仅支持仅 1 种 Geometry3D，称为 MeshGeometry3D.但是这个几何图形由大量的三角形组成.为了定义三角形，它有一组 Point3Ds (Positions) 表示三角形的顶点和一组 int (Positions)>TriangleIndices) 用于指示如何连接顶点(保存在 Positions 中)以制作实际三角形.
To render a 3D scene in WPF, you have to use an element called ViewPort3D. This has a Camera, a collection of Visual3D. A concrete sub type of Visual3D is ModelVisual3D. This visual helps render the Model3D. All the 3D shapes are represented by a GeometryModel3D or the more complex Model3DGroup (all derive from Model3D). We just care about the property GeometryModel3D.Geometry (of type Geometry3D) here. Currently, WPF just supports only 1 kind of Geometry3D called MeshGeometry3D. But this geometry consists of a large number of triangles. To define the triangles, it has a collection of Point3Ds (Positions) representing the vertices of the triangles and a collection of int (TriangleIndices) used to indicate how to connect the vertices (saved in Positions) to make the actual triangles.
这意味着你要绘制的曲线应该有某种形状，比如某种圆柱体(比如粉丝)或者就像一条布条……反正这并不容易.下面的演示代码将曲线渲染为一条细条(不是圆形)，但实际上我们把它做得很细，以至于你只能看到它看起来像一条线(取决于我们观察场景的距离).
That means the curve you want to draw should have some shape, such as some kind of cylinder (like vermicelli) or just like a strip of cloth... Anyway it's not easy. The following demo code renders the curve as a thin strip (not round), however in fact we make it so thin that you can just see it looks like a line (depending on how close we view the scene).
正如我上面所说的，我们需要为MeshGeometry3D填充信息(Positions和TriangleIndices)来构建曲线.我们需要曲线的一些方程，进行一些循环以获取Point3Ds(属于曲线)的集合，同时适当地填充TriangleIndices.
As I said above, what we need to build the curve is fill the info (Positions and TriangleIndices) for a MeshGeometry3D. We need some equation of the curve, make some loop to get a collection of Point3Ds (belong to the curve) and at the same time fill the TriangleIndices appropriately.
这里是代码细节:
XAML:
<Grid Name="grid">
<Viewport3D>
<Viewport3D.Camera>
<PerspectiveCamera Position="55,55,55" LookDirection="-1,-1,-1"
UpDirection="0,1,0" FieldOfView="20"/>
</Viewport3D.Camera>
<Viewport3D.Children>
<ModelVisual3D>
<ModelVisual3D.Content>
<Model3DGroup>
<DirectionalLight Color="White" Direction="1,0,-1"/>
<AmbientLight Color="Black"/>
<GeometryModel3D>
<GeometryModel3D.Material>
<MaterialGroup>
<DiffuseMaterial Brush="Red"/>
<EmissiveMaterial Brush="#330000ff"/>
</MaterialGroup>
</GeometryModel3D.Material>
<GeometryModel3D.BackMaterial>
<MaterialGroup>
<DiffuseMaterial Brush="Red"/>
<EmissiveMaterial Brush="#330000ff"/>
</MaterialGroup>
</GeometryModel3D.BackMaterial>
<GeometryModel3D.Geometry>
<MeshGeometry3D x:Name="geo"/>
</GeometryModel3D.Geometry>
<GeometryModel3D.Transform>
<RotateTransform3D>
<RotateTransform3D.Rotation>
<AxisAngleRotation3D Axis="0,1,0"
Angle="0" x:Name="rot"/>
</RotateTransform3D.Rotation>
</RotateTransform3D>
</GeometryModel3D.Transform>
</GeometryModel3D>
</Model3DGroup>
</ModelVisual3D.Content>
</ModelVisual3D>
</Viewport3D.Children>
<Viewport3D.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard>
<Storyboard Storyboard.TargetName="rot">
<DoubleAnimation Storyboard.TargetProperty="Angle" By="360"
RepeatBehavior="Forever" Duration="00:00:10"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Viewport3D.Triggers>
</Viewport3D>
</Grid>
注意XAML代码中MeshGeometry3D的Name是geo，使用代码构建曲线需要参考这个.
Note about the Name of the MeshGeometry3D in XAML code is geo, we need to refer to this to build the curve using code.
背后的代码:
int k = 0;
for (float n = 0f; n < 1; n += 0.01f, k++) {
//calculate the current Point3D based on the equations of the curve
var x = -13 * Math.Pow(n, 3) - 12 * n * n;
var y = 35 * Math.Pow(n, 5) - 13 * n * n + 3 * n + 1;
var z = -30 * Math.Pow(n, 3) + 20 * n * n - n - 1;
//the current Point3D
var p = new Point3D(x, y, z);
//here is where we make it thin,
//you can replace .1 with such as 10 to enlarge the strip
var u = new Point3D(x, y - .1, z);
geo.Positions.Add(p);
geo.Positions.Add(u);
if (k > 0) {
geo.TriangleIndices.Add(k);
geo.TriangleIndices.Add(k - 1);
geo.TriangleIndices.Add(k + 1);
geo.TriangleIndices.Add(k);
}
geo.TriangleIndices.Add(k);
geo.TriangleIndices.Add(k + 1);
k++;
}
注意:我强烈建议您先阅读 WPF 中的基本 3D 概念，至少您应该了解如何连接点(在 Positions 中)以指示三角形表面如你所愿.理解之后，就可以理解上面的代码了.
NOTE: I highly recommend you to read about basic 3D concepts in WPF first, at least you should understand how to connect the points (in Positions) to indicate the triangle surfaces as what you want. Once understand that, you can understand the code above.
这篇关于如何在 WPF 中绘制 3D 曲线?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
