3D圆柱体透视效果

总效果

原理:

3D面+面在摄像机方向上的2D投影点的集合

3D面效果

2D线:

画线时需要注意两个点:

1 在圆柱体上下两个圆之间有两条竖着的棱边代表圆柱体边缘

2 被遮盖的圆面后半面显示为虚线

1 如何确定两条棱边的位置

我们需要确定上下两个圆面最左边和最右边的点。

随着摄像机的移动,上面的左右两个点和下面的左右两个点也随之变化

点的变化和Y轴无关,所以我们可以把它看作是个2维关系。

其中直线是摄像机位置视角与面中心的连线,两个红点则是这个面最左边的点和最右边的点。

即问题转变为:求一条过圆心的点直线的垂线与圆的交点。

即:

			Point3D cameraRealPosition = transform.Transform(carema.Position);
Point caremaRealPoint = new Point(cameraRealPosition.X, cameraRealPosition.Z);
var l1 = caremaRealPoint.X - center.X;
var l2 = caremaRealPoint.Y - center.Y;
var l3 = Math.Sqrt(l1 * l1 + l2 * l2);
var sinb = l2 / l3;
var cosb = l1 / l3;
var x1 = r * sinb + center.X;
var y1 = -r * cosb + center.Y;
var x2 = -r * sinb + center.X;
var y2 = r * cosb + center.Y;

此时我们求出一个面的点(x1,y1)(x2,y2)

在三维中,y是z轴,则点为

    		    new Point3D(x1, pointTopCenter.Y, y1)
new Point3D(x2, pointTopCenter.Y, y2)
new Point3D(x1, pointBottomCenter.Y, y1)
new Point3D(x2, pointBottomCenter.Y, y2)

上下点连线则为圆柱体的侧边。

2 如何确定虚线位置。

2.1分离实线点和虚线点

我们可以发现虚线与实线是以(x1,y1)(x2,y2)分离的。

由于线是以投影点的集合组合而成。

我们可以根据每个点在(x1,y1)-(x2,y2)这条直线的左边还是右边把这个集合分成两部分。

根据向量叉乘来判断在左边还是右边。

 bool IsPointOnLineLeftOrRight(Point a, Point b, Point p)
{
Vector pa = new Vector(a.X - p.X, a.Y - p.Y);
Vector pb = new Vector(b.X - p.X, b.Y - p.Y);
return Vector.CrossProduct(pa, pb) < 0;
}

其中ab为分别为x1y1左边两个点。

2.2确定上面存在虚线还是下面存在虚线

思路:从四个集合中选取位置相同四个点,通过和摄像机的距离比较来判断哪个集合是虚线集合

1 通过上下面相同位置的点F1,F2的距离,判断是上面存在被遮盖的面还是下面存在被遮盖的面。

如图:

DistanceF2ToCamera>DistanceF1ToCamera

则虚线应该在下边这个圆上。

2.3 确定面左边集合是虚线还是右边集合

同样DistanceF3ToCamera>DistanceF4ToCamera

所以F3所在的集合是虚线点集

由此就可以判断虚线点集了。

3 点集的顺序一致性。

我们画的是开放的半圆,在画2D半圆线的时候,我们需要保证从左边第一个点开始画,画到最右边的点,

如果是从中间开始画,那么就会是个封闭的半圆了。

开放的半圆:

封闭的半圆:

所以我们要保证点集的顺序是从左到右的:

正常视角:

那我们存在两种情况:

若以A为起点,则按顺序有三个点集:A1,B,A2

点集A=A2+A1

点集B=B

若以A为起点,则按顺序有三个点集:A1,B,A2

点集A=A2+A1

点集B=B

两种情况统一:

我们需要注意的是A=A2+A1

两个集合添加的时候顺序要变一下。

WPF-3D圆柱体透视的更多相关文章

  1. WPF 3D 知识点大全以及实例

    引言 现在物联网概念这么火,如果监控的信息能够实时在手机的客服端中以3D形式展示给我们,那种体验大家可以发挥自己的想象. 那生活中我们还有很多地方用到这些,如上图所示的Kinect 在医疗上的应用,当 ...

  2. WPF 3D model - Sphere, Cone, and Cylinder

    原文:WPF 3D model - Sphere, Cone, and Cylinder   Extending Visual3D - Sphere, Cone, and Cylinder http: ...

  3. WPF 3D编程介绍

    原文:WPF 3D编程介绍 上一篇文章简单的介绍了WPF编程的相关的内容,也推荐了本书.今天要来讲一下在WPF如何开展3D编程. 使用的xmal 和C#开发的时候:需要使用如下的关键要素: 1:摄像机 ...

  4. 【CSS3进阶】酷炫的3D旋转透视

    之前学习 react+webpack ,偶然路过 webpack 官网 ,看到顶部的 LOGO ,就很感兴趣. 最近觉得自己 CSS3 过于薄弱,想着深入学习一番,遂以这个 LOGO 为切入口,好好研 ...

  5. 优化WPF 3D性能

    Maximize WPF 3D Performance .NET Framework 4.5   As you use the Windows Presentation Foundation (WPF ...

  6. WPF 3D 小小小小引擎 - ·WPF 3D变换应用

    原文:WPF 3D 小小小小引擎 - ·WPF 3D变换应用 WPF可以提供的3D模型使我们可以轻松地创建3D实体,虽然目前来看还很有一些性能上的问题,不过对于一些简单的3D应用应该是可取的,毕竟其开 ...

  7. WPF 3D 常用类(1)

    原文:WPF 3D 常用类(1) 几何数据相关类 Geometry3D 抽象类, 用于定义物体的几何数据, 可用于计算HitTest和BoundingBox MeshGeometry3D Geomet ...

  8. WPF 3D:使用GeometryModel3D的BackMaterial

    原文 WPF 3D:使用GeometryModel3D的BackMaterial 使用BackMaterial,我们可以定义3D物体的内部材质(或者说是背面),比如,我们定义一个四方体容器,外面现实的 ...

  9. WPF 3D:MeshGeometry3D的定义和光照

    原文 WPF 3D:MeshGeometry3D的定义和光照 由于WPF计算光照会根据整个平面的方向向量,所以如果在不同面上使用同一个点可能会达到不同的光照效果.让我们用不同的定义Mesh的方法来演示 ...

  10. WPF 3D: MeshGeometry3D纹理坐标的正确定义

    原文 WPF 3D: MeshGeometry3D纹理坐标的正确定义 为了使基于2D的纹理显示在3D对象中,我们必须定义3D Mesh对象的纹理贴图坐标.在WPF中,此项功能则通过MeshGeomet ...

随机推荐

  1. C++算法代码——快速排序

    题目来自:http://218.5.5.242:9018/JudgeOnline/problem.php?cid=1371&pid=1 题目描述 第一行一个数字n, n<=100000. ...

  2. Vue3组件(九)Vue + element-Plus + json = 动态渲染的表单控件

    一个成熟的表单 表单表单,你已经长大了,你要学会: 动态渲染 支持单列.双列.多列 支持调整布局 支持表单验证 支持调整排列(显示)顺序 依据组件值显示需要的组件 支持 item 扩展组件 可以自动创 ...

  3. [报错集]ubuntu中安装oracle java报错

    1.因为版本更新,JAVA15以前的版本都已经没办法下载了,所以要使用oracle java必须使用最近的java15 $ sudo apt-get install oracle-java15-ins ...

  4. react新手入坑

    1.vscode保存react项目的时候由于js-css-html插件格式化代码导致react代码缩进错误 解决方法:禁用js-css-html插件 2.react和vue不同,react方法的定义需 ...

  5. IntelliJ IDEA 还能画思维导图,果然最强 IDE!

    最近栈长发现 IntelliJ IDEA 居然还能画思维导图,太牛逼了! 当然这得借助 IDEA 的 UML 插件,因为它本身也是一个 UML 图,所以这篇就从 UML 图开撕,看 IDEA 怎么画思 ...

  6. 【随便写写】印象笔记,WordPress,CSDN 等 写博客的不同

    之前有的文章,写在了印象笔记里面,有的文章,写在了自己的WordPress博客里面,但是,感觉还是需要在主流平台分享一下文章的.就再次写写文章吧.(PS:公众号最重要的不是写作,而是排版) 说说几个这 ...

  7. TextView 的append后面 马上调用fullScroll(),会发现无法滚动到真正的底部

    如果在TextView的append后面马上调用fullScroll,会发现无法滚动到真正的底部,这是因为Android下很多(如果不是全部的话)函数都是基于消息的,用消息队列来保证同步,所以函数调用 ...

  8. ISC BIND9 - 最详细、最认真的从零开始的BIND 9 服务讲解

    DNS and BIND 服务的搭建说明 目录 目录 DNS and BIND 服务的搭建说明 1. 背景 1.1 DNS 1.2 FQDN 1.3 BIND 1.4 本文中搭建模拟DNS服务网络虚拟 ...

  9. 1.2 Python3基础-规范

    >>返回主目录 总的来说,如果安装的不是安装的Anaconda,pip命令还是经常会用到的(cmd模式使用),当然也可以在PyCharm中直接安装 PEP8规范,我另有一篇博客已经写好,可 ...

  10. 用vue.js实现的期货,股票的实时K线

    用vue.js实现的期货,股票的实时k线 项目地址:https://github.com/zhengquantao/vue-Kline vue-kline 效果图 Build Setup 本项目基于V ...