说明

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

向量的点乘

假设有两个 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.yreturn 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>

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

  1. Unity3D热更新之LuaFramework篇[06]--Lua中是怎么实现脚本生命周期的

    前言 用c#开发的时候,新建的脚本都默认继承自Monobehaviour, 因此脚本才有了自己的生命周期函数,如Awake,Start, Update, OnDestroy等. 在相应的方法中实现游戏 ...

  2. [再寄小读者之数学篇](2014-07-16 二阶中值)

    设 $f(x)$ 在 $[a,b]$ 上二阶可微, 试证: 对任意 $c\in (a,b)$, 存在 $\xi\in (a,b)$ 使得 $$\bex \frac{f''(\xi)}{2}=\frac ...

  3. 再寄小读者之数学篇[2014.07.01-2014.12.31]

    [再寄小读者之数学篇](2014-12-24 乘积型不等式) [再寄小读者之数学篇](2014-12-04 $\left(1+\frac{1}{x}\right)^x>\frac{2ex}{2x ...

  4. Python-Matplotlib可视化(番外篇)——Matplotlib中的事件处理详解与实战

    Python-Matplotlib可视化(番外篇)--Matplotlib中的事件处理详解与实战 前言 事件连接 事件属性 实战1:直方图中矩形的拖拽 实战2:鼠标进入和离开 相关链接与参考 前言 在 ...

  5. 再寄小读者之数学篇[2014.01.01-2014.06.30]

    [再寄小读者之数学篇](2014-06-28 证明级数几乎处处收敛) 设 $f\in L(\bbR)$, 试证: $$\bex \vsm{n}f(n^2x) \eex$$ 在 $\bbR$ 上几乎处处 ...

  6. C/C++基础讲解(二十九)之数值计算与趣味数学篇(百钱百鸡问题、爱因斯坦的数学题、三色球问题与马克思手稿中的数学题)

    C/C++基础讲解(二十九)之数值计算与趣味数学篇(百钱百鸡问题.爱因斯坦的数学题.三色球问题与马克思手稿中的数学题) 程序之美 前言 很多时候,特别是刚步入大学的学子们,对于刚刚开展的计算机课程基本 ...

  7. 《(数学篇)》 复数运算

    [译文连载]<(数学篇)>--第六章 复数运算 虚数有一个直观化的解释:它把数字"旋转",就像负数把数字做了"镜像"一样.这种深刻的见解使得我们理解 ...

  8. OD使用教程6 - 调试篇06|解密系列

    OD使用教程6 - 调试篇06 让编程改变世界 Change the world by program   这一讲开始,小甲鱼带大家接触真正程序的逆向.其实也没啥大不了的,也就是对之前所学的知识进行巩 ...

  9. 傅里叶变换音频可视化_Web Audio在音频可视化中的应用

    Web Audio在音频可视化中的应用 本文有两个关键词:音频可视化和Web Audio.前者是实践,后者是其背后的技术支持. Web Audio 是很大的知识点,本文会将重点放在如何获取音频数据这块 ...

最新文章

  1. Linux_Bash脚本基础
  2. 各种 分页存储过程整理
  3. Navicat for MySQL 连接 Mysql 8.0.11 出现1251- Client does not support authentication protocol
  4. One order event display tool
  5. 学习总结——Selenium元素定位
  6. UE4角色Location远距离时动画抖动问题(float精度不够)解决方案
  7. python中绝对角度是什么意思_Python中的角度转换功能
  8. c语言字符串拼接变量,C语言实现字符串拼接
  9. 淘宝商品历史价格接口/商品历史价走势接口对接代码分享
  10. java从键盘上输入一位整数_当输入1到7时_从键盘上输入一位整数,当输入1~7时,显示对应的英文星期名称的缩写。...
  11. 纪念短暂而美好的恋情:愿得一人心 白首不相离
  12. 软件测试管理工具——禅道(安装、讲解)
  13. 深圳高中女生街头版someone like you
  14. pythoon_interview_redit
  15. 个人理财类书籍推荐 -- From一亩三分地 帖子
  16. 数据可视化——R语言绘制散点相关图并自动添加相关系数和拟合方程
  17. 【OpenHarmony】napi基础知识学习
  18. NCC轻量化开发数据结构总结
  19. 项目管理:PMP、IPMP、CPMP之间区别
  20. 数字选择控件TimeDragPicker

热门文章

  1. iPhone/iPad的正确充电方法,有实验证明!
  2. 删除某一个字段oracle,oracle添加字段或者删除字段-转载
  3. CCNet: Criss-Cross Attention for Semantic Segmentation论文读书笔记
  4. PDF转html怎么转?几个步骤让你学会
  5. 使用pdf.js展示pdf文件(亲测可用)
  6. Tableau 数据可视化之项目二 网站用户访问行为分析
  7. An unexpected error was encountered while executing a WSL command. Common ca
  8. STM32的异常与中断
  9. xml文件解析的几种方式(一)
  10. c语言编写1000以内素数的函数6,C语言求1000以内的素数