CSS3 透视 : Visualising the view pyramid

标签 css css-transforms perspective perspectivecamera

阅读本文: http://www.eleqtriq.com/2010/05/understanding-css-3d-transforms/ 我可以理解如何将 perspective 属性可视化为在 3d 空间中创建金字塔。

enter image description here

我不太清楚的是这句话,“立方体的边被扭曲并投影到金字塔上”,然后是“视角越高,金字塔越陡,所以转换后的物体大小将是更接近它未转换的大小。”

该图似乎显示了如果光线从右侧照射会发生什么情况,立方体右侧的正方形在金字塔上转换出扭曲的阴影。但由于这是在金字塔的边缘——在我们视野的边缘,这到底有什么用?

而且我知道更高的视角会产生更陡峭的金字塔 - 但为什么这会产生较少扭曲的物体?

任何人都可以澄清这些要点吗?谢谢。

最佳答案

我不认为这张图特别清楚。

金字塔的作用是将您的元素(立方体)投影到金字塔的“地板”——投影平面,其中 z=0。

如果您完全忘记了透视,那么您的绘图系统就是通过垂直线将元素投影到投影平面上。即设置坐标的z为0.(x y z) >>> (x y 0).

当你有一个步进金字塔时,金字塔的 Angular 更接近垂直,这就是较少失真的原因

关于CSS3 透视 : Visualising the view pyramid,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16878112/

相关文章:

javascript - 通过脚本文件添加 jquery 脚本

CSS3 微调器、预加载器

javascript - 使用变换比例时防止像素小数

css - 3D 变换在过渡结束时失去视角

opencv - Opencv,具有已知旋转和平移的逆透视映射

css - 如何使 html 链接看起来像一个按钮?

css - 奇怪的 jQuery 动画行为 - 不断运行

jQuery-ui 可拖动在旋转后更改轴

css - 透视导致 Firefox 溢出错误

css - 对于符合 XHTML 标准的固定间距,我的最佳选择是什么?