【数学篇】06 # 可视化中你必须要掌握的向量乘法知识

凯小默

已于 2022-10-12 20:45:18 修改

阅读量1.1k

点赞数 2

CC 4.0 BY-SA版权

分类专栏：动画 / 可视化

于 2022-10-12 20:42:04 首次发布

本文链接：https://blog.csdn.net/kaimo313/article/details/126833509

动画 / 可视化专栏收录该内容

51 篇文章

订阅专栏

本文详细介绍了向量的点乘和叉乘运算原理及其几何意义，包括如何通过这些运算判断向量之间的关系，并给出了实际应用案例，如使用归一化向量判断点是否位于特定扫描范围内。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

说明

【跟月影学可视化】学习笔记。

向量的点乘

假设有两个 N 维向量 a 和 b，a = [a1, a2, ...an]，b = [b1, b2, ...bn]，那向量的点积代码如下：

a•b = a1*b1 + a2*b2 + ... + an*bn

在 N 维线性空间中，a、b 向量点积的几何含义，是 a 向量乘以 b 向量在 a 向量上的投影分量。

在这里插入图片描述

当 a、b 两个向量平行时：

a.x * b.x + a.y * b.y === a.length * b.length；

当 a、b 两个向量垂直时：

a.x * b.x + a.y * b.y === 0;

向量的叉乘

向量 a 和 b 的叉积，就相当于向量 a（蓝色带箭头线段）与向量 b 沿垂直方向的投影（红色带箭头线段）的乘积。

在这里插入图片描述
数学里计算叉乘：假设有两个三维向量 a(x1, y1, z1) 和 b(x2, y2, z2)，那么，a 与 b 的叉积可以表示为一个如下图的行列式：

在这里插入图片描述
行列式展开，公式如下：

a X b = [y1 * z2 - y2 * z1, - (x1 * z2 - x2 * z1), x1 * y2 - x2 * y1]

在右手系中求向量 a、b 叉积的方向时，大拇指所指的方向就是 a、b 叉积的方向，这个方向是垂直纸面向外（即朝向我们）。

在这里插入图片描述
在二维空间里，由于 z 的值为 0，a X b 的数值，就等于 x1 * y2 - x2 * y1。二维空间中向量叉乘的物理意义就是 a 和 b 的力矩（力矩你可以理解为一个物体在力的作用下，绕着一个轴转动的趋向。它是一个向量，等于力臂 L 和力 F 的叉乘。

叉乘和点乘不同点

向量叉乘运算的结果不是标量，而是一个向量
两个向量的叉积与两个向量组成的坐标平面垂直

归一化

归一化就是让向量 v0除以它的长度（或者说是模）。归一化后的向量方向不变，长度为 1。

实例：扫描器

要检查某个点是否在扫描范围里

在这里插入图片描述

我们可以添加一个单位向量v (0,1) 与这个点的向量求叉积

点在扫描范围内，如向量 a，就一定满足：

|a X v| <= ||a||v|sin(30°)| = |sin(30°)| = 0.5；

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>扫描器</title>
</head>
<body>
    <script type="module">
        import { Vector2D } from './common/lib/vector2d.js';
        
        function isInRange(v, a) {
            // a.normalize() 即将 a 归一化
            // dot(v) => this.x * v.x + v.y * this.y
            return v.dot(a.normalize()) >= Math.cos(Math.PI/6);
        }
        console.log("向量（1,1）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(1, 1)))
        console.log("向量（0, 0）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(0, 0)))
        console.log("向量（0, 2）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(0, 2)))
        console.log("向量（0, -2）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(0, -2)))
        console.log("向量（2, 0）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(2, 0)))
        console.log("向量（-2, 0）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(-2, 0)))
        console.log("向量（1, 4）在扫描范围里吗", isInRange(new Vector2D(0, 1), new Vector2D(1, 4)))
    </script>
</body>
</html>