webgl
6篇文章 · 0订阅
  • WebGL模板测试中的“视觉欺骗”
    我们在工作中或多或少都会接触到三维可视化的相关内容，神秘而酷炫它可以更直观地描述物质和更清晰地传递讯息，给产品带来更高的可玩性及更多创造力。
    JavaScript WebGL 前端
    WebGL模板测试中的“视觉欺骗”
  • WebGL坐标系基础（二）
    在上一篇文章：《WebGL 坐标系基础（一）》中，我们介绍了WebGL 中常见的几种坐标系以及他们之间的关系。本期将更加“硬核”一些，从数学的角度，推导上期讲到的各个变换矩阵。 在下面的推导中，我们统一使用列向量来表示一个坐标，所谓列向量就是一个N*1 矩阵。例如坐标(x, y…
    JavaScript
    WebGL坐标系基础（二）
  • 乘风破浪的WebGL系列-使用 WebGL 构建基础 2d 几何形体
    WebGL 没有提供一些基础的 API 来帮助你构建矩形、圆形或则立方体和球体等基础几何形体，如果你想用原生的 WebGL 来绘制这些形体的话，就需要了解 WebGL 支持直接绘制的基础图元，以及如果通过这些基础图元去构建更加复杂的几何形体。 图元（primitive） 是指绘…
    JavaScript
    乘风破浪的WebGL系列-使用 WebGL 构建基础 2d 几何形体
  • WebGL坐标系基础（一）
    对于坐标系相信大家都不陌生，写css的时候大量使用的绝对定位就通过坐标系来描述一个dom的位置。而在WebGL中不仅大量使用了坐标系，还使用了各种各样的坐标系，有的用来描述一个模型自身，有的用来描述一个3d场景。 这些坐标系有各自的使用场景，之间相互独立。但我们能通过坐标变换来…
    WebGL
    WebGL坐标系基础（一）
  • 乘风破浪的WebGL系列-初识WebGL
    在前端领域我们可以通过四种方式来绘制图形，包括 HTML+CSS、SVG、Canvas2d 还有 WebGL，其中 WebGL 属于非常少用的一种绘图方式，尽管如此，其却有着无可替代的位置。接下来，让我们从这四种绘图方式开始，来了解下 WebGL 吧。 HTML+CSS 是最常…
    JavaScript
    乘风破浪的WebGL系列-初识WebGL
  • 乘风破浪的WebGL系列-着色器语言基础
    学习 WebGL 程序需要学习两个新东西，一个是WebGL API，另一个是着色器语言。其中着色器语言是用来控制 GPU 渲染的编程语言，而 WebGL API 则是 JavaScript 和着色器语言之间的桥梁，JavaScript 通过 WebGL API 间接地控制 GP…
    JavaScript
    乘风破浪的WebGL系列-着色器语言基础