【烟花代码】,情人节,情侣生日礼物代码适用

【烟花代码】,情人节,情侣生日礼物代码适用

【烟花代码】,情人节,情侣生日礼物代码适用

老规矩,先上效果图
在这里插入图片描述
图片做了加速处理,放樱花的位置,速度完全由点击控制。

1初始化粒子系统

	var Particle = function(x, y, hue){
   
		this.x = x;
		this.y = y;
		this.coordLast = [
			{
   x: x, y: y},
			{
   x: x, y: y},
			{
   x: x, y: y}
		];
		this.angle = rand(0, 360);
		this.speed = rand(((self.partSpeed - self.partSpeedVariance) <= 0) ? 1 : self.partSpeed - self.partSpeedVariance, (self.partSpeed + self.partSpeedVariance));
		this.friction = 1 - self.partFriction/100;
		this.gravity = self.partGravity/2;
		this.hue = rand(hue-self.hueVariance, hue+self.hueVariance);
		this.brightness = rand(50, 80);
		this.alpha = rand(40,100)/100;
		this.decay = rand(10, 50)/1000;
		this.wind = (rand(0, self.partWind) - (self.partWind/2))/25;
		this.lineWidth = self.lineWidth;
	};

2粒子系统的更新

	Particle.prototype.update = function(index){

var radians = this.angle * Math.PI / 180;
var vx = Math.cos(radians) * this.speed;
var vy = Math.sin(radians) * this.speed + this.gravity;
this.speed *= this.friction;
this.coordLast[2].x = this.coordLast[1].x;
this.coordLast[2].y = this.coordLast[1].y;
this.coordLast[1].x = this.coordLast[0].x;
this.coordLast[1].y = this.coordLast[0].y;
this.coordLast[0].x = this.x;
this.coordLast[0].y = this.y;
this.x += vx * self.dt;
this.y += vy * self.dt;
this.angle += this.wind;				
this.alpha -= this.decay;
if(!hitTest(0,0,self.cw,self.ch,this.x-this.radius, this.y-this.radius, this.radius*2, this.radius*2) || this.alpha < .05){
					
self.particles.splice(index, 1);	
}			
};

3粒子系统的画图

	Particle.prototype.draw = function(){

var coordRand = (rand(1,3)-1);
self.ctx.beginPath();								
self.ctx.moveTo(Math.round(this.coordLast[coordRand].x), Math.round(this.coordLast[coordRand].y));
self.ctx.lineTo(Math.round(this.x), Math.round(this.y));
self.ctx.closePath();				
self.ctx.strokeStyle = 'hsla('+this.hue+', 100%, '+this.brightness+'%, '+this.alpha+')';
self.ctx.stroke();				
if(self.flickerDensity > 0){

var inverseDensity = 50 - self.flickerDensity;					
if(rand(0, inverseDensity) === inverseDensity){

self.ctx.beginPath();
self.ctx.arc(Math.round(this.x), Math.round(this.y), rand(this.lineWidth,this.lineWidth+3)/2, 0, Math.PI*2, false)
self.ctx.closePath();
var randAlpha = rand(50,100)/100;
self.ctx.fillStyle = 'hsla('+this.hue+', 100%, '+this.brightness+'%, '+randAlpha+')';
self.ctx.fill();
}	
}
};

4创建烟花例子

self.createParticles = function(x,y, hue){

var countdown = self.partCount;
while(countdown--){
						
self.particles.push(new Particle(x, y, hue));
}
};

5绑定鼠标时间,mousedown,mouseup

	self.bindEvents = function(){

$(window).on('resize', function(){
			
clearTimeout(self.timeout);
self.timeout = setTimeout(function() {

self.ctx.lineCap = 'round';
self.ctx.lineJoin = 'round';
}, 100);
});
$(self.canvas).on('mousedown', function(e){

var randLaunch = rand(0, 5);
self.mx = e.pageX - self.canvasContainer.offset().left;
self.my = e.pageY - self.canvasContainer.offset().top;
self.currentHue = rand(self.hueMin, self.hueMax);
self.createFireworks(self.cw/2, self.ch, self.mx, self.my);	
$(self.canvas).on('mousemove.fireworks', function(e){

var randLaunch = rand(0, 5);
self.mx = e.pageX - self.canvasContainer.offset().left;
self.my = e.pageY - self.canvasContainer.offset().top;
self.currentHue = rand(self.hueMin, self.hueMax);
self.createFireworks(self.cw/2, self.ch, self.mx, self.my);									
});	
});
$(self.canvas).on('mouseup', function(e){

$(self.canvas).off('mousemove.fireworks');									
});
}

有想要完整源码的小伙伴可以加我,q:2316773638

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/2861.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • ncurses编程文档_nupack软件

    ncurses编程文档_nupack软件Frm:http://blog.csdn.net/Mary_Jane/article/details/50769631介绍ncurses(newcurses)是一套编程库,它提供了一系列的函数

  • SpringCloud与Dubbo的比较

    SpringCloud与Dubbo的比较Dubbo一、dubbo简介Dubbo是阿里巴巴公司开源的一个高性能优秀的服务框架,使得应用可通过高性能的RPC实现服务的输出和输入功能,可以和Spring框架无缝集成。Dubbo是一款高性能、轻量级的开源JavaRPC框架,它提供了三大核心能力:面向接口的远程方法调用,智能容错和负载均衡,以及服务自动注册和发现。现已发展成为Apache的顶级孵化开源项目,详见官网:…

  • 谷歌(google)广告尺寸大小列表

    谷歌(google)广告尺寸大小列表

    2021年11月17日
  • BP神经网络预测模型(神经网络算法模型)

    学习率一般在(0,0.1)区间上取值.隐含层节点数量(√为开根号):①m=(√(i+j))+α②m=log2(i)③m=√(i*j)m:隐含层节点i:输入层节点数j:输出层节点数α:1-10之间的常数

  • MCTS (Monte Carlo Tree Search)[通俗易懂]

    MCTS (Monte Carlo Tree Search)[通俗易懂]以下文章摘录自:《机器学习观止——核心原理与实践》京东:https://item.jd.com/13166960.html当当:http://product.dangdang.com/29218274.html(由于博客系统问题,部分公式、图片和格式有可能存在显示问题,请参阅原书了解详情)MCTS(MonteCarloTreeSearch)1.1MCTS概述在前面的学习中,我们分析了蒙特卡洛方法,本章节将为大家解开蒙特卡洛树搜索的“面纱”。虽…

  • 编译原理之代码生成「建议收藏」

    前面提到了经过了词法分析->语法分析->语义分析->中间代码优化,最后的阶段便是在目标机器上运行的目标代码的生成了。目标代码生成阶段的任务是:将此前的中间代码转换成特定机器上的机器语言或汇编语言,这种转换程序便被称为代码生成器。1.程序移植性和编译器模块设计的关系之所以将编译原理分成这种多阶段多模块的组织形式,本质的考虑其实只有两个方面:一、代码复用:尽可能在不增加程序员工作量的前提下,增

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号