📝 WebGL教程

22篇技术文档
  WebGL-翻译

📅  最后修改于: 2020-10-17 05:34:17        🧑  作者: Mango

到目前为止,我们讨论了如何使用WebGL绘制各种形状并在其中应用颜色。在本章中,我们将以一个示例来说明如何平移三角形。翻译翻译是WebGL提供的仿射转换之一。使用平移,我们可以在xyz平面上移动三角形(任何对象)。假设我们有一个三角形[a,b,c],我们想将三角形移动到一个位置,该位置朝X轴正方向5个单位,朝Y轴正方向3个单位。那么新的顶点将是[a + 5,b + 3,c + 0]。这意味着,要平...

  WebGL-缩放

📅  最后修改于: 2020-10-17 05:34:51        🧑  作者: Mango

在本章中,我们将以一个示例来演示如何使用WebGL修改三角形的比例。缩放比例缩放不过是增加或减小对象的大小而已。例如,如果三角形的顶点的大小为[a,b,c],则顶点为[2a,2b,2c]的三角形将是其大小的两倍。因此,要缩放三角形,必须将每个顶点与缩放因子相乘。您还可以缩放特定的顶点。要缩放三角形,请在程序的顶点着色器中创建一个统一矩阵,并将坐标值与该矩阵相乘。然后,我们传递一个在对角位置(最后一...

  WebGL-旋转

📅  最后修改于: 2020-10-17 05:35:12        🧑  作者: Mango

在本章中,我们将以一个示例来演示如何使用WebGL旋转三角形。示例–旋转三角形以下程序显示了如何使用WebGL旋转三角形。现场演示如果运行此示例,它将产生以下输出-...

  WebGL-多维数据集旋转

📅  最后修改于: 2020-10-17 05:35:39        🧑  作者: Mango

在本章中,我们将以一个示例来演示如何使用WebGL绘制旋转的3D立方体。示例–绘制旋转3D立方体以下程序显示了如何绘制旋转的3D立方体-现场演示如果运行此示例,它将产生以下输出-...

  WebGL-交互式多维数据集

📅  最后修改于: 2020-10-17 05:36:15        🧑  作者: Mango

在本章中,我们将以一个示例演示如何绘制可使用鼠标控件旋转的3D立方体。示例–绘制交互式多维数据集以下程序显示了如何使用鼠标控件旋转立方体-现场演示如果运行此示例,它将产生以下输出-...

  WebGL-有用的资源

📅  最后修改于: 2020-10-17 05:36:32        🧑  作者: Mango

以下资源包含有关WebGL的其他信息。请使用它们来获得有关此方面的更深入的知识。WebGL上的有用链接WebGL Wiki–WebGL的维基百科参考。WebGL-WebGL官方网站。WebGL上的有用书籍要在此页面上注册您的网站,请发送电子邮件至...

  讨论WebGL

📅  最后修改于: 2020-10-17 05:36:44        🧑  作者: Mango

WebGL(Web图形库)是Web上3D图形的新标准,旨在渲染2D图形和交互式3D图形。本教程从WebGL,OpenGL和HTML-5的Canvas元素的基本介绍开始,然后是一个示例应用程序。本教程包含专门章节,介绍编写基本WebGL应用程序所需的所有步骤。它还包含解释如何使用WebGL进行仿射变换(例如平移,旋转和缩放)的章节。...