ShaderJoy —— 超实用 GLSL 函数之 “绕任意轴旋转点”（一）

已于 2024-12-23 14:05:02 修改
阅读量2.3k 收藏 2
点赞数 3
CC 4.0 BY-SA版权
分类专栏： ShaderJoy —— Shader 实例详解【重制版】 文章标签： glsl opengl shader
于 2020-12-13 19:29:09 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/panda1234lee/article/details/111142711
本文详细介绍了GLSL中绕任意轴旋转点的数学原理和实现方法，通过代码示例展示了如何使用该函数，解释了旋转过程中涉及的投影、混合和叉乘等概念，并探讨了不同旋转角度下的效果。

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

三维空间中绕任意轴旋转点

以下代码中的函数的作用是 返回三维点 p 绕 ax 轴旋转 ro 角度的后的三维点 p' 。

值得 注意 的是该算法默认旋转轴是从原点出发的，所以 ax 必须标准化（normalized）。

了解本专栏 订阅专栏 解锁全文
ShaderJoy —— 纯 shader 实现立方体绕任意轴旋转（四元数）【GLSL】
ShaderJoy 的兴趣技术杂货铺
02-20 1788
效果图 球面线性插值旋转的效果 简单线性插值旋转的效果 基础知识 四元数是什么呢？简单来说，四元数本质上是一种高阶复数，是一个四维空间，相对于复数的二维空间。一个复数由实部和虚部组成，即 ，i 是虚数单位，有。而四元数其实和我们学到的这种是类似的，不同的是，它的虚部包含了三个虚数单位，i、j、k，即一个四元数可以表示为。 我们现在已知一个四元数可以表示为 ，现在就来回答这样一个简单的式子是怎么和三维旋转结合在一起的。为了方便，我们下面使用 ，其中 v 是向量，w 是实...
ShaderJoy —— 简单又神奇的 “合体” 函数【GLSL】
ShaderJoy 的兴趣技术杂货铺
09-20 1564
smin 函数 它实际上有两种常见的实现方式 多项式 指数 多项式 smin 函数图 其对应的代码为 float smin( float a, float b ) { // 多项式 const float k = 0.5; float h = clamp(0.5 + 0.5 * (b - a) / k, 0.0, 1.0); return mix(b, a, h) - k * h * (1.0 - h); } 从上图中我们可以很明显的看出有两处不连...
opengl中如何绕轴旋转物体
08-19
如何绕轴旋转这些物体。glRotatef(Angle,Xvector,Yvector,Zvector) 用于绕轴旋转物体， 这是一条十分有用的函数。 Angle 是一个用于指定旋转角度的数字(通常存储于变量中)。 Xvector， Yvector 和 Zvector 这三个参数用于描述一条向量， 以规定物体的旋转轴。 如果你使用 (1,0,0) 这样的值， 你就描述了一条长度为1个单位的、顺着x轴指向右方的向量； 而 (-1,0,0) 这样的值就描述了一条长度为1个单位的、顺着x轴 但指向左方的向量。
ShaderGraph节点解析(124):绕轴旋转节点（Rotate About Axis Node）详解
最新发布
分享知识，拥抱变化
07-04 874
Unity ShaderGraph中的绕轴旋转节点(RotateAboutAxisNode)是实现3D向量绕任意轴旋转的核心工具。它基于罗德里格斯旋转公式，精确计算旋转矩阵，支持弧度或角度两种单位输入。该节点具有广泛的应用场景，包括角色骨骼动画、相机环绕控制、粒子螺旋轨迹以及地形扭曲效果等。使用时需注意旋转轴归一化、角度单位选择和性能优化等事项。作为3D空间变换的基础组件，该节点为复杂旋转效果提供了灵活且准确的实现方案，并能与其他功能结合实现更丰富的动态效果。
GLSL矩阵变换详解（二、旋转变换、平移变换以及QMatrix4x4）
热门推荐
liji_digital的博客
02-25 1万+
本篇博客展示4个例子，都是关于旋转变换、平移变换和QMatrix的操作。在QT的帮助中，提到QMatrix是行主序。而opengl的矩阵是列主序的。乍一看，将QMatrix传入shader之前，qmatrix需要做转置处理。但是在实际的尝试中，我发现矩阵不应转置。我们从前面的博客 Qt结合GLSL贴出纹理（二、采用QOpenGLShaderProgram和QOpenGLTexture）出发，在那篇...
ShaderJoy —— 3D 跳动的心 ♥ 【GLSL】
ShaderJoy 的兴趣技术杂货铺
02-24 1638
效果图 主要思路介绍 首先我们通过 SDF 在场景中构造了一个平面和球体 vec2 res = vec2( q.y, 2.0 ); ///< 默认是 plane ... ... // float d = sqrt(x * x + y * y + z * z) - r; float d = length(vec3(x, y, z)) - r; ///< 同上 然后通过对球体进行拉伸（抛物线公式），构造一个如下的形状（♥ 的半边） float y ...
ShaderJoy —— 最简单的 “RayTrace（光线追踪）” 的实现 【GLSL】
ShaderJoy 的兴趣技术杂货铺
08-27 3569
判断 “直线和圆是否相交” 的理论推导。 延伸阅读：“直线和平面是否相交” 的理论推导。 效果图： GLSL代码： vec2 iResolution = vec2(512., 512.); // 简单的光线结构体，更高级的Ray Tracer所需的字段更多 struct Ray { vec3 origin; // 光源点 vec3 di
Shader 使图片围绕自己中心旋转(主要是用于旋转的loading界面)
qq_34884421的博客
09-02 1095
Shader "LoadingImage" { Properties { _MainTex ("Texture", 2D) = "white" {} _Speed ("Speed",float) = 2 } SubShader { // No culling or depth //Cull Off ZWrite Off ZTest Always T...
ShaderJoy —— “百叶窗” 特效的实现【GLSL】
ShaderJoy 的兴趣技术杂货铺
01-31 1797
效果图 静态图 ​ 动态图 ​ 代码及详解： 代码很简单，让我们直接来看代码和注释 varying vec2 texcoord; // uniform float iGlobalTime; // uniform vec2 iResolution; #define PI 3.1415926f #define PIx2 2.*PI #define PI_HALF PI/2. #iChannel0 "file://./yeah_0.jpg" #iChannel1 "file://./yeah.jpg" ..
ShaderJoy —— 五种超实用的 GLSL 函数代码（二）
ShaderJoy 的兴趣技术杂货铺
12-13 1870
当我们标准化一个高斯分布的向量，我们得到一个均匀随机的单位向量【相对均匀】。换句话说，它创建的矩阵除了对角线之外都是零，对角线上的值就是你传入的值。该函数找到直线上最接近 p 点的点，然后返回到 p 点的距离。这是通过把这个点投影到直线上，然后截断它的投影，使它在端点之间。我们所做的是将两个 int 值放入一个特殊的多项式函数中，然后将其转换为浮点数，并将结果映射到 (- 1,1) 的范围内。假设我们直接将一个方框中的向量映射到一个球面上的向量，我们会得到的是。没有它，我们得到的值就不是随机的。
ShaderJoy —— 漫画 sketch 效果【GLSL】
ShaderJoy 的兴趣技术杂货铺
08-14 1770
效果图 原图 核心算法思路 该效果的核心思路一共分为以下几步【参考 Photoshop 中的图层操作】 先根据图像的亮度，人为设定阈值，分为（6个）不同等级的灰度图； 然后构造（6个）不同旋转方向的 “木刻纹” 图像，如下图所示； 该核心的 “木刻纹” 是由以下正弦和取模函数搭配实现的 float dist = mod(rotuv.y - sin(rotuv.x * frecuencia) * amplitud, divisor); 函数示意图如下所示 等高线图如下所示 接着，将 “木刻
glsl-y-rotate:生成旋转矩阵的GLSL模块
05-18
glsl-y-rotate 生成旋转矩阵的GLSL模块。 推荐使用 。 用法 2D（垫子2） #pragma glslify : rotate = require(glsl - y - rotate) const float DEG_TO_RAD = 3.141592653589793 / 180.0 ; void main( void ) { vec2 pos = vec2 ( 1.0 , 0.0 ); pos = rotate( 45.0 * DEG_TO_RAD) * pos; } 3D（mat3） #pragma glslify : rotateX = require(glsl - y - rotate / rotateX) #pragma glslify : rotateY = require(glsl - y - rotate / rotateY)
ShaderJoy —— 新人所不知道的 GLSL 函数坑
ShaderJoy 的兴趣技术杂货铺
06-10 4218
前言 前几天在技术群里看到有人吐槽踩了 fract函数的坑，其实这个坑我很早以前也遇到过，不过以前只是写在自己的笔记当中，为了大家少走弯路，不再 “前赴后继” 地踩坑，我决定把这个坑给填上。 正文： 通常意义上，我们觉得取小数部分，应该产生的是如下的效果，即正数取正数的小数，负数取负数的小数部分。 但是 OpenGL的 fract却不按套路出牌（小朋友，你是否有很多问号？？？） 首先我们来看 OpenGL官方文档的说明 /// @note /// 返回 x-floor(x)......
ShaderJoy —— ❤の霓虹（Neon）【GLSL】
ShaderJoy 的兴趣技术杂货铺
06-14 1569
效果视频 ShaderJoy －－♡ 的霓虹 效果图 核心算法解析 第一步，我们来看看心形线是怎么绘制的：由于最终的效果是曲线随着时间绕中心进行旋转，所以很自然得会想到极坐标，通过查找心形线的公式，我们选择极坐标形式的公式： 其结果如下图所示 心形线 第二步，有了心形线，我们就可以在它上面选取若干点生成一条 bezier 曲线线段，为了同时显示两条曲线，需要将第二条曲线段和第一条曲线段选取的点的位置进行错开（offset）；为了实现曲线运动的效果...
ShaderJoy —— “雪花飞舞 ”的实现 【GLSL】
ShaderJoy 的兴趣技术杂货铺
10-22 6086
效果图： 是不是有点 “落雪无声掩尘嚣”的感觉~ GLSL 代码： // ------------------- #define _SnowflakeAmount 400 // 雪花数 #define _BlizardFactor 0.25 // 风的大小 #define fragCoord gl_FragCoord #define fragColor gl...
Shader GLSL 3D旋转函数
字节流动
05-24 242
【代码】Shader GLSL 3D旋转函数。
ShaderJoy —— 有空间感的 “星云” 特效 【GLSL】
ShaderJoy 的兴趣技术杂货铺
01-20 6880
theme: channing-cyan highlight: vs2015 “ PK创意闹新春，我正在参加「春节创意投稿大赛」，详情请看：春节创意投稿大赛” ShaderJoy —— Shader 特效乐趣无穷 效果图 动态图 静态图 核心代码分析 话不多说，先看核心代码，我们从简单的二维坐标入手（之后再推广到三维），如下 /// @note 将屏幕坐标换算为 [-.5, .5] 的范围 vec2 p = fragCoord.xy / iResolution.xy - .5; float pa, .
ShaderJoy —— 两种瘦脸+大眼特效【附完整参数】【GLSL】
ShaderJoy 的兴趣技术杂货铺
06-04 4475
效果对比图 不带人脸特征点 原图瘦脸效果图 带人脸特征点 原图瘦脸效果图 原代码参考自这篇博文，不过很遗憾的是作者并没有提供完整参数，也没有对代码进行解释。所以我在他的基础上进行了补充并且发现了一些问题。 完整代码和注释 #define MAX_CONTOUR_POINT_COUNT 9 #define RED vec3(1., 0., 0.) #define WID...
【ShaderToy】基本操作——旋转
weixin_30376453的博客
05-29 255
*继续：ShaderToy基础学习中d(`･∀･)b 对每个像素点进行旋转，其实加个公式就ok了啊。 对网格进行旋转： 代码如下： #define TUTORIAL 2 #define PI 3.14159265359 #if TUTORIAL == 1 float linearstep(float edge0, float edge1, floa...
glsl normalize(vPosition - sunPosition); 如何绕一个点旋转
10-17
如果你想要绕一个特定点旋转向量，你可以使用矩阵旋转或旋转变换函数。在 GLSL 中，可以使用 `mat4` 类型的旋转矩阵来完成旋转。例如，假设你有一个旋转角度 `angle` 和一个旋转中心 `(pivotX, pivotY)`，可以按照...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

ShaderJoy

您的打赏是我继续写博客的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值