排序
实时光线追踪(3)Ray Casting
合集 - 实时光线追踪(3)1.实时光线追踪(3)Ray Casting06-192.实时光线追踪(2)降噪:Nvidia Real-time Denoiser2022-09-033.实时光线追踪(1)降噪:Spatio-Temporal Filtering2022-08-29收...
OpenGL不够用?为何还要开发Vulkan?
相信不少朋友和我一样有这样的疑问既然已经有广泛应用的OpenGL图形接口,为什么Khronos还要花费精力重新开发一套Vulkan图形API接口呢? 查询相关资料后,总结为一句话为了更高的性能、更低的驱...
EventDispatcher事件分发器
前言 学习目标 创建事件分发器 掌握事件分发器的运行原理 知识点 监听者模式 前情回顾 之前我们说过图案编辑器的整体架构,接下来我们会从最底层的EventDispatcher 对象开始写起。 EventDispatc...
Job System 初探
作者:i_dovelemon 日期:2023-08-24 主题:Fiber, Atomic Operation, MPMC Queue, Multiple thread, Job system 引言 现代 CPU 是多核处理器,为了充分利用 CPU 多核处理的特性...
上车WebGL——用矩阵实战图形变换
哈喽大家好啊,我是广州小井。上一小节我们初步接触了矩阵的数学基础,但我们还不知道学来干嘛?那这一节我们马不停蹄的来应用矩阵进行实战! 因为要更好的学习 WebGL 就需要更多的上手敲代码,...
一文详解Mac搭建Vulkan开发环境
本文为Vukan系列的第二篇文章,上一篇文章对Vulkan进行了简单介绍,并对其与OpenGL的优劣势进行了比较,为应用开发人员在选择图形API方面提供了建议。下边开始本文的主要内容,详细介绍在Mac操...
canvas封装Img对象
前言 学习目标 创建Img对象 知识点 drawImage 矩阵 前情回顾 之前我们创建了Object2D对象,接下来我们接着往上写Img对象。 1-Img对象的功能分析 Img对象是对canvas的drawImage() 方法的封装,若...
canvas封装Text2D对象
前言 学习目标 创建二维文字对象 知识点 ctx.fillText() ctx.strokeText() 1-文字的样式对象 首先咱们先看一下样式对象的架构思路。 最底层的是BasicStyle,再上面的StandStyle和TextStyle依次...
上车WebGL——走进奇妙的3D世界,绘制第一个立方体
哈喽大家好啊,我是广州小井。在学习和铺垫了很多枯燥无味的基础知识后,我们终于要开始接触到 WebGL 神奇的另外一面——三维图形了!于是乎,当我们学成以后,那种炫酷网页上面的 3D 效果对于...
canvas中的二维相机
前言 学习目标 创建相机对象 平移视口 缩放视口 知识点 二维视图投影矩阵 前情回顾 之前我们canvas的矩阵变换原理,接下来我们就可以创建图形对象了,我们先写个相机练练手。 1-相机的功能分析 ...
canvas封装变换任意图形的组件
前言 学习目标 根据任意图形的变换原理,修改之前变换图案的代码,使其可以变换任意图形 知识点 矩阵变换 1-Object2D 整体代码如下: import { Vector2 } from '../math/Vector2' import { Grou...
前端流程图插件对比选型
前言 前端领域有多种流程库可供选择,包括但不限于vue-flow、butterfly、JointJS、AntV G6、jsPlumb和Flowchart.js。这些库都提供了用于创建流程图、图形编辑和交互的功能。然而,它们在特性、...
常用的2d数学工具类
前言 学习目标 创建二维向量对象,并掌握向量的基本算法 创建三阶矩阵对象,并掌握矩阵的基本算法 知识点 向量 矩阵 前情回顾 之前我们创建了vue+vite+ts+vitest 项目,并创建了我们所需要的类...
canvas实战案例-T恤图案编辑器
前言 学习目标 创建T恤图案编辑器 知识点 TransformControler 的应用 canvas 全局合成 canvas 图层控制 DOM和图形组件的数据传递 1-搭建前端静态 1-1-页面结构 T恤图案编辑器的页面结构如下图所...
曲线艺术编程 coding curves 第十四章 其它曲线(Miscellaneous Curves)
第十四章 其它曲线(Miscellaneous Curves) 原作:Keith Peters www.bit-101.com/blog/2022/1… 译者:池中物王二狗(sheldon) 源码:github: github.com/willian1234… 曲线艺术编程系列 第十...
任意图形的变换原理
前言 学习目标 基于某一基点变换任意图形 知识点 矩阵变换 1-基点变换的思路 此时我突然想起一句让人午夜惊醒的话:来,咱们再把这件事情的来龙去脉从头捋一遍。 我现在就想着把这个基点变换的...
计算机图形学(一): 线性代数概览(上)
我正在参加「掘金·启航计划」 本文系原创,转载请注明出处.码字不易,希望大家多多关注,多多点赞! 开新坑啦,本文是系列文章'计算机图形学'的第一篇: 线性代数概览,之所以第一篇就讲线性代数,是因...
渲染路径 – Deferred Texturing
合集 - 渲染路径(3)1.多光源渲染方案 - Light Culling02-212.多光源渲染方案 - Many Lights Sampling03-103.渲染路径 - Deferred Texturing07-11收起 目录Deferred Texturing为什么需要 Deferre...
ImgControler图案控制器
前言 学习目标 创建ImgControler对象 使用ImgControler对象变换图案 知识点 图案选择 图案控制框 鼠标状态与样式 图案变换 前情回顾 之前我们用OrbitControler 对象实现了相机的变换,接下来我...
计算机图形学(二): 线性代数概览(中)
我正在参加「掘金·启航计划」 本文系原创,转载请注明出处.码字不易,希望大家多多关注,多多点赞! 线性变换 在上一篇文章的开头我们说过,线性代数是研究向量空间和它们之间的线性映射的学科,上一...