标签：Canvas 矩阵 (matrix)

前端 Canvas 使用矩阵 (matrix) + 向量 (vector) 操控画布绘图之二维向量 (vector2) 函数库

前言

上一篇《前端 Canvas 用法之 – 使用矩阵 (matrix) + 向量 (vector) 操控画布绘图》介绍了在 canvas 中如何使用矩阵（matrix），及如何使用矩阵进行图形变换（transform）。但里面有用到的向量并没有详细介绍，本篇通过结合一个向量的函数工具库来介绍一下向量的应用，因为向量主要是用来描述对象的长度 / 运动距离，一般会在 canvas 动画里面会派上用场， 继续阅读“前端 Canvas 使用矩阵 (matrix) + 向量 (vector) 操控画布绘图之二维向量 (vector2) 函数库”

前端 Canvas 用法之 – 使用矩阵 (matrix) + 向量 (vector) 操控画布绘图

前言

使用 canvas 画布来操控图形或者图片的二维变化的方式一般是平移、缩放、和旋转。canvas 已相应提供了相关的 api。如：translate(), scale() 和 rotate()，但这些功能无法统一处理并且无法描述当前画布的处于某种状态。为了实现这种统一连贯性的状态描述，canvas 给我们提供了另外一种思路及方法，即使用：transform() / setTransform()；因为画布上的每个对象都拥有一个当前的 3 x 3 变换矩阵， 继续阅读“前端 Canvas 用法之 – 使用矩阵 (matrix) + 向量 (vector) 操控画布绘图”