【threejs】火焰特效制作

2024-06-26 08-57-16火焰

shader

来源

   //shadertory:https://www.shadertoy.com/view/ctVGD1//shadertory:https://www.shadertoy.com/view/ml3GWs 

代码

	import { DoubleSide, ShaderChunk, ShaderMaterial } from "three";export default function getFireMaterial() {//https://www.shadertoy.com/view/ctVGD1/**一个从玻璃花纹修改来的火焰特效shadertory:https://www.shadertoy.com/view/ctVGD1shadertory:https://www.shadertoy.com/view/ml3GWs */const vertex = `
${ShaderChunk.logdepthbuf_pars_vertex}
bool isPerspectiveMatrix(mat4) {return true;
}varying vec4 m_pos;
varying vec2 vUv;
varying vec3 _flame;uniform float uTime;vec2 hash( vec2 p ){p = vec2( dot(p,vec2(127.1,311.7)), dot(p,vec2(269.5,183.3)) );return -1.0 + 2.0*fract(sin(p)*43758.5453123);
}
float noise1( in vec2 p ){// noise function from IQ himselfconst float K1 = 0.366025404; // (sqrt(3)-1)/2;const float K2 = 0.211324865; // (3-sqrt(3))/6;vec2  i = floor( p + (p.x+p.y)*K1 );vec2  a = p - i + (i.x+i.y)*K2;float m = step(a.y,a.x); vec2  o = vec2(m,1.0-m);vec2  b = a - o + K2;vec2  c = a - 1.0 + 2.0*K2;vec3  h = max( 0.5-vec3(dot(a,a), dot(b,b), dot(c,c) ), 0.0 );vec3  n = h*h*h*h*vec3( dot(a,hash(i+0.0)), dot(b,hash(i+o)), dot(c,hash(i+1.0)));return dot( n, vec3(70.0) );
}
float noise2(in vec2 p){return0.500*noise1(p*1.0)+0.250*noise1(p*2.0)+0.125*noise1(p*4.0)+0.063*noise1(p*8.0);
}
vec2 noise3(in vec2 p){return vec2(noise2(p), noise2(p + 20.0));
}vec2 noise4(in vec2 p){return noise3(p + noise3(p));
}vec2 transform(in vec2 p){return p + 0.2 * noise4(1.4 * p - vec2(0.0, uTime * 0.8));
}vec3 ud(vec2 p) {p.x = abs(p.x);float q = p.x * (p.y * 11.0 + 1.7);p.x = max(p.x, q);return vec3(1.0, 0.1, 0.0) / pow(length(p), 5.0) * 0.000008;
}void main () {vUv = uv;vec2 st = uv-.5;_flame = ud(transform(st * vec2(1.0, 0.5)));    vec3 newPosition = normal*vec3(0,0,0)+position;gl_Position = projectionMatrix * modelViewMatrix * vec4(newPosition, 1.0);${ShaderChunk.logdepthbuf_vertex}
}`;// 片元着色器代码const fragment = `
${ShaderChunk.logdepthbuf_pars_fragment}
precision mediump float;varying vec2 vUv;
varying vec3 _flame;void main() {vec2 uv = vUv;vec3 color = vec3(0.,0.,1.);gl_FragColor = vec4(_flame,length(_flame));${ShaderChunk.logdepthbuf_fragment}
}`;const uniforms = {uTime: { value: 1.0 },};const material = new ShaderMaterial({uniforms: {uTime: { value: 1.0 },},vertexShader: vertex,fragmentShader: fragment,side: DoubleSide,transparent: true,depthWrite:true,depthTest:true,alphaTest: 0.5});return material;
}

Mesh

  let geometry = new PlaneGeometry(1, 1, 50, 50);let material = getFireMaterial();this.geometry = geometry;this.material = material;let mesh = new Mesh(geometry, material);this.mesh = mesh;let mesh2 = mesh.clone();mesh2.rotation.y = Math.PI / 2;this.add(mesh, mesh2);

动画

	  let loop = () => {requestAnimationFrame(loop);if ( this.material) {this.material.uniforms.uTime.value += 0.01;}};loop();

效果展示

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/35190.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

4、广告-考核标准

在程序化广告中,评估广告效果是衡量广告活动成功与否的关键。本章将详细介绍广告效果的定义、层次和评估方法,并提供中文名词与英文名词的一一对应。 一、广告效果的定义(Definition of Advertising Effectiveness) 广告效果是指…

华为OD机试【高矮个子排队】(java)(100分)

1、题目描述 现在有一队小朋友,他们高矮不同,我们以正整数数组表示这一队小朋友的身高,如数组{5,3,1,2,3}。 我们现在希望小朋友排队,以“高”“矮”“高”“矮”顺序排列,每一个“高”位置的小朋友要比相邻的位置高或…

利用BFS解决每个零售店到仓库最短距离之和问题

1、题目 矩阵中有3种类型:0仓库,-1障碍,1零售店。现在每个零售店要去距离它最近的仓库取货物,请计算出所有零售店到最近仓库距离之和,假设矩阵中每个单元格之间距离为1。如果遇到障碍物,则表示无法通过。可…

图神经网络实战(15)——SEAL链接预测算法

图神经网络实战(15)——SEAL链接预测算法 0. 前言1. SEAL 框架1.1 基本原理1.2 算法流程 2. 实现 SEAL 框架2.1 数据预处理2.2 模型构建与训练 小结系列链接 0. 前言 我们已经学习了基于节点嵌入的链接预测算法,这种方法通过学习相关的节点嵌…

决策树回归原理详解及Python代码示例

决策树回归原理详解 决策树回归(Decision Tree Regression)是一种非参数监督学习方法,它使用树形结构来对目标变量进行预测。与线性回归模型不同,决策树回归不需要预先假设数据的分布形式,因此能够很好地处理非线性和高…

2024年上半年软件设计师上午真题及答案解析

1.在计算机网络协议五层体系结构中,( B )工作在数据链路层。 A.路由器 B.以太网交换机 C.防火墙 D.集线器 网络层:路由器、防火墙 数据链路层:交换机、网桥 物理层:中继器、集线器 2.软件交付之后&#xff…

数据可视化期末考试(编程)

1.KNN 1.新增数据的分类 import pandas as pd # 您的原始数据字典 data { 电影名称: [电影1, 电影2, 电影3, 电影4, 电影5], 打斗镜头: [10, 5, 108, 115, 20], 接吻镜头: [110, 89, 5, 8, 200], 电影类型: [爱情片, 爱情片, 动作片, 动作片, 爱情片] } …

uni-app uni-data-picker级联选择器无法使用和清除选中的值

出现问题&#xff1a; 使用点击右边的叉号按钮无法清除已经选择的uni-data-picker值 解决办法&#xff1a; 在uni-app uni-data-picker使用中&#xff0c;要添加v-model&#xff0c;v-model在官网的示例中没有体现&#xff0c;但若不加则无法清除。 <uni-data-picker v-m…

OpenAI用GPT-4o打造癌症筛查AI助手;手机就能检测中风,准确率达 82%!中国气象局发布AI气象大模型...

AI for Science 企业动态速览—— * 皇家墨尔本大学用 AI 检测患者中风&#xff0c;准确率达 82% * OpenAI 用 GPT-4o 模型打造癌症筛查 AI 助手 * 中国气象局发布 AI 气象大模型风清、风雷、风顺 * AI 药企英矽智能&#xff1a;小分子抑制剂已完成中国 IIa 期临床试验全部患者…

GPT-5智能新纪元的曙光

在美国达特茅斯工程学院周四公布的采访中&#xff0c;OpenAI首席技术官米拉穆拉蒂被问及GPT-5是否会在明年发布&#xff0c;给出了肯定答案并表示将在一年半后发布。穆拉蒂在采访中还把GPT-4到GPT-5的飞跃描述为高中生到博士生的成长。 这一爆炸性的消息&#xff0c;震动了整体…

linux下进度条的实现

目录 一、代码一版 1.processbar.h 2.processbar.c 3.main.c 二、代码二版 1.processbar.h 2.processbar.c 3.main.c 三、改变文字颜色 一、代码一版 使用模块化编程 1.processbar.h #include<stdio.h> #define capacity 101 //常量使用宏定义 #define style…

Perl文件句柄深度解析:掌握文件操作的核心

Perl中的文件句柄是进行文件输入输出操作的关键。它们提供了一种机制&#xff0c;允许Perl脚本打开文件、读写数据、定位文件指针&#xff0c;以及关闭文件。理解文件句柄的使用对于编写高效的Perl脚本至关重要。本文将深入探讨Perl文件句柄的概念、使用方法和最佳实践。 1. 文…

【Pytorch使用教程】torch.backends.cudnn.benchmark = True的作用

在 PyTorch 中,设置 torch.backends.cudnn.benchmark = True 是一种优化深度学习应用程序性能的方法,特别是当你有固定输入大小的时候。 解释 CuDNN:CUDA Deep Neural Network library(CuDNN)是 NVIDIA 提供的一个 GPU 加速库,用于深度神经网络。PyTorch 在底层使用 Cu…

代码随想录——买股票的最佳时机Ⅱ(Leecode122)

添加链接描述 贪心 局部最优&#xff1a;手机每天的正利润 全局最优&#xff1a;求最大利润 class Solution {public int maxProfit(int[] prices) {int res 0;for(int i 1; i < prices.length; i){res Math.max(prices[i] - prices[i - 1], 0);}return res;} }

【计算机视觉】mmcv库详细介绍

文章目录 MMVC库概览特点和优势主要组件应用案例示例一:数据加载和处理示例二:模型训练和验证MMVC库概览 MMCV 是一个用于计算机视觉研究的开源库,它为各种视觉任务提供了底层的、高度优化的 API。该库涵盖了从数据加载到模型训练的各个方面,广泛应用于开源项目,如 MMDet…

webstorm无法识别tsconfig.json引用项目配置文件中的路径别名

问题 vite项目模板中&#xff0c;应用的ts配置内容写在tsconfig.app.json文件中&#xff0c;并在tsconfig.json通过项目引用的方式导入 {"files": [],"references": [{"path": "./tsconfig.app.json"},{"path": "./t…

2024-06-25 问AI: 在大语言模型中, Hugging Face 是什么?

文心一言 Hugging Face 在大语言模型领域中是一个非常重要的存在&#xff0c;它主要提供了一系列自然语言处理&#xff08;NLP&#xff09;相关的工具和资源。以下是关于 Hugging Face 的详细介绍&#xff1a; 公司背景&#xff1a;Hugging Face 是一家成立于2016年的开源模型…

2024年第十五届蓝桥杯青少组大赛8月24日开启

据蓝桥杯青少组官网显示&#xff0c;2024年第十五届蓝桥杯青少组大赛8月24日开启。 蓝桥杯青少组历届题库地址&#xff1a;http://www.6547.cn/question/cat/2 蓝桥杯青少组历届真题下载&#xff1a;http://www.6547.cn/wenku/list/10

python基础1.2----爬虫基础

python基础内容之爬虫 ## 1. 关于爬虫的特殊性 爬虫是一个很蛋疼的东西, 可能今天讲解的案例. 明天就失效了. 所以, 不要死盯着一个网站干. 要学会见招拆招(爬虫的灵魂) 爬虫程序如果编写的不够完善. 访问频率过高. 很有可能会对服务器造成毁灭性打击, 所以, 不要死盯着一个网…

MySQL用户管理和高级SQL语句

一、用户管理 1.新建用户 mysql> create user zhangsanlocalhost identified by pwd123; Query OK, 0 rows affected (0.00 sec)mysql> create user lisilocalhost identified by pwd123; Query OK, 0 rows affected (0.00 sec)mysql> create user wangwulocalhost …