Wilde View

Houdini API 提供了一组 API 允许在 Javascript 中处理 CSS 值，其中包含 ：

• CSS Properties and Values API
• CSS Typed OM
• CSS Painting API
• Worklets
• …

其中还有些功能处于初级阶段，后续还会有些变更，这里先介绍下 CSS Properties and Values API。

Https 流量在传输的过程中是经过加密的，如果直接使用 wireshark 查看 https 传输的内容，将看到加密后的数据，无法看到明文数据。之前也曾经使用 wireshark 查看过 https 的明文数据，不过时间太久，已经忘记了配置的方式。现在将配置的过程记录下来，以便后续的查看。

配置的过程主要分为两步：

1. Chrome 导出 SSL/TLS 的 secret key
2. Wireshark 配置导出的 secret key file

最近的工作又涉及到了 3D 空间内的坐标系变换。虽然之前也有接触过相关的工作内容，但都只了解了其中的一部分。这次从头开始进行开发便有点捉襟见肘了。没得办法，从头开始学习下变换矩阵相关的内容了。本文将从简单的 2D 变换矩阵开始，扩展到 3D 变换矩阵。最后再应用变换矩阵进行坐标系变换。

变换矩阵(Transformation matrix)的定义可以从维基百科中查找到，这里就不在赘言。本篇文章会涉及到向量、矩阵等知识的内容。关于向量和矩阵的定义、性质以及计算等信息不在本文中描述。如有需要可自行查阅相关知识后再阅读后续内容。

在开始之前，需要先同步以下约定信息：

1. 向量统一为列向量，即 $\begin{bmatrix} x \\ y \\ z \\ \end{bmatrix}$ 或者写为行向量的转置 $\begin{bmatrix} x & y & z \end{bmatrix} ^\mathsf{T}$

2. 原向量左乘变换矩阵得到目标向量，即 $\begin{bmatrix} X & Y & Z \end{bmatrix} ^\mathsf{T} = M * \begin{bmatrix} x & y & z \end{bmatrix} ^\mathsf{T}$

3. 因使用列向量来表示，下文中的矩阵乘法除额外指出外均为左乘

欧拉角是 Leonhard Euler 引入的三个角度，用于描述刚体相对于固定坐标系的方向。

固定坐标系(x, y, z)，也成为静态坐标系，世界坐标系，方向轴保持固定不变
旋转坐标系(X, Y, Z)， 刚体自身的坐标系
交点线(N) ，xOy 平面与 XOY 平面的交线