图形学共0篇
图形学
渲染路径 - Deferred Texturing-五八三

渲染路径 – Deferred Texturing

合集 - 渲染路径(3)1.多光源渲染方案 - Light Culling02-212.多光源渲染方案 - Many Lights Sampling03-103.渲染路径 - Deferred Texturing07-11收起 目录Deferred Texturing为什么需要 Deferre...
admin的头像-五八三admin2年前
0690
ImgControler图案控制器-五八三

ImgControler图案控制器

前言 学习目标 创建ImgControler对象 使用ImgControler对象变换图案 知识点 图案选择 图案控制框 鼠标状态与样式 图案变换 前情回顾 之前我们用OrbitControler 对象实现了相机的变换,接下来我...
admin的头像-五八三admin2年前
090
计算机图形学(二): 线性代数概览(中)-五八三

计算机图形学(二): 线性代数概览(中)

我正在参加「掘金·启航计划」 本文系原创,转载请注明出处.码字不易,希望大家多多关注,多多点赞! 线性变换 在上一篇文章的开头我们说过,线性代数是研究向量空间和它们之间的线性映射的学科,上一...
admin的头像-五八三admin2年前
0130
一文学会TextureID渲染到Surface-五八三

一文学会TextureID渲染到Surface

最近遇到一个需求,要求将一个GL_TEXTURE_2D类型的纹理ID写入到ImageReader生成的Surface中。 其实这个需求与我之前写过的一篇文章 一文学会MediaCodeC与OpenGL录制mp4视频需求比较接近,只需要...
admin的头像-五八三admin2年前
0300
二维相机轨道控制器-五八三

二维相机轨道控制器

前言 学习目标 创建相机轨道控制器 操控相机变换视图 知识点 位移 缩放 前情回顾 之前我们创建了Scene对象,接下来我们建立OrbitControler对象。 1-OrbitControler对象的功能分析 OrbitControle...
admin的头像-五八三admin2年前
0170
计算机图形学(三): 线性代数概览(下)-五八三

计算机图形学(三): 线性代数概览(下)

我正在参加「掘金·启航计划」 傅里叶变换(Fourier Transform) 书接上文,我们知道在RnR^nRn空间中我们可以找到一个正交基来构成其基向量,通过之前关于向量空间的介绍我们也知道向量不仅仅是一个...
admin的头像-五八三admin2年前
040
canvas中的矩阵变换-五八三

canvas中的矩阵变换

前言 学习目标 canvas 内置变换方法里的矩阵逻辑 知识点 translate(x,y) rotate(ang) scale(x,y) transform(e0,e1,e3,e4,e6,e7) 前情回顾 之前我们完成了图案编辑器的整体架构,创建了vue+vite+...
admin的头像-五八三admin2年前
080
上车WebGL——相机-五八三

上车WebGL——相机

哈喽大家好啊,我是广州小井。从上两个小节我们已经掌握了立方体的绘制方式,并且我们可以通过一定的手段(旋转)来观察出我们绘制的是一个立方体而不是普通的矩形。那么在这其中,涉及到了一些...
admin的头像-五八三admin2年前
0140
canvas封装Scene场景-五八三

canvas封装Scene场景

前言 学习目标 创建Scene对象 理解Scene对象的功能和运行逻辑 知识点 渲染封装 坐标转换 前情回顾 之前我们创建了Group对象,接下来我们建立Scene对象。 1-Scene对象的功能分析 Scene 对象是场...
admin的头像-五八三admin2年前
080
计算机图形学(四): 渲染管线-光栅化/采样-五八三

计算机图形学(四): 渲染管线-光栅化/采样

我正在参加「掘金·启航计划」 从本篇文章开始,我们将正式开启计算机图形学之旅,本系列文章将一步步深入介绍计算机在渲染输出呈现一张图片经历的各种步骤细节以及涉及到的相关其他领域的知识串...
admin的头像-五八三admin2年前
080
《canvas进阶-矩阵变换》课程概述-五八三

《canvas进阶-矩阵变换》课程概述

前言 课前准备 具备前端基础,如HTML、css、js。 多多少少敲过一点vue。 具备canvas基础,若没有,可以看一下我的《canvas从入门到放飞自我-基础篇》 学习目标 以面向对象的思路架构canvas。 使...
admin的头像-五八三admin2年前
060
计算机图形学(六): 渲染管线-空间变换(下)-五八三

计算机图形学(六): 渲染管线-空间变换(下)

空间变换-下(Spatial Transformation) 书接上文,本章我们继续讲变换,上一章介绍了旋转和反射,这章我们开始介绍剩下几种变换:缩放/平移/错切 缩放 均匀缩放 每一个向量被映射到自身与缩放因子的...
admin的头像-五八三admin2年前
0240
canvas封装Group对象-五八三

canvas封装Group对象

前言 学习目标 创建Group对象 知识点 集合 前情回顾 之前我们创建了Img对象,接下来我们建立Group对象。 1-Group对象的功能 Group 是二维图形的集合,它可以对这些图形进行管理,比如增删改查。...
admin的头像-五八三admin2年前
040
曲线艺术编程 coding curves 第十二章 超级椭圆与超级方程(Superellipses and Superformulas)-五八三

曲线艺术编程 coding curves 第十二章 超级椭圆与超级方程(Superellipses and Superformulas)

第十三章 超级椭圆与超级方程(Superellipses and Superformulas) 原作:Keith Peters www.bit-101.com/blog/2022/1… 译者:池中物王二狗(sheldon) 源码:github: github.com/willian1234… ...
admin的头像-五八三admin2年前
050
图案编辑器概述-五八三

图案编辑器概述

前言 学习目标 对图案编辑器进行整体架构 认识各种常见的矩阵 知识点 图形架构 矩阵 1-架构思想 图形项目的基本架构思想是面向对象。 我在架构图形项目的时候,一般会架构两棵树,一个棵是用于...
admin的头像-五八三admin2年前
020
相机的奥秘——推导视图矩阵-五八三

相机的奥秘——推导视图矩阵

哈喽大家好啊,我是广州小井。上一节我们初步了解了相机和视图矩阵,并且通过 three.js 的 lookAt 方法实战感受了通过相机观测图形的效果,get 到了变换相机位置观测图形和变换图形自身是一个反...
admin的头像-五八三admin2年前
0180
上车WebGL——初探图形学的数学基础-五八三

上车WebGL——初探图形学的数学基础

哈喽大家好啊,我是广州小井。上一小节我们初步接触了图形的二维变换,但每一个变换我们都是通过不同的数学公式计算顶点坐标实现的,那有没有统一的计算方式呢?不急,我们先来学点数学知识吧! ...
admin的头像-五八三admin2年前
080
上车WebGL——图形的复合变换-五八三

上车WebGL——图形的复合变换

哈喽大家好啊,我是广州小井。上一小节我们初步用矩阵实战了图形平移,但它的应用远不如此!本文,我们将继续深入矩阵,看看它是如何在复合变换中发光发热的吧~ 因为要更好的学习 WebGL 就需要...
admin的头像-五八三admin2年前
090
Object2D二维对象-五八三

Object2D二维对象

前言 学习目标 创建二维对象 理解二维对象的基本功能 知识点 矩阵变换 前情回顾 之前我们创建了EventDispatcher 对象,接下来我们接着往上写Object2D对象。 1-Object2D对象的功能分析 我们之前...
admin的头像-五八三admin2年前
060
上车WebGL——推导视图矩阵-五八三

上车WebGL——推导视图矩阵

哈喽大家好啊,我是广州小井。上一节我们初步了解了相机和视图矩阵,并且通过 three.js 的 lookAt 方法实战感受了通过相机观测图形的效果,get 到了变换相机位置观测图形和变换图形自身是一个反...
admin的头像-五八三admin2年前
0170