canvas定点燃放烟花效果代码-html代码-BFW代码库

canvas定点燃放烟花效果代码

代码语言：html

所属分类：上传

代码描述：canvas定点燃放烟花效果代码，鼠标点击屏幕任意位置即可发射烟花。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">



    <style>
        * { margin: 0; padding: 0; }
        
        html, body { height: 100%; }
        
        body {
          background: #000;
        }
        
        canvas {
          display: block;
          cursor: crosshair;
        }
    </style>

</head>

<body>
    <canvas id="canvas">Canvas is not supported by your browser.</canvas>

    <script >
        // Options
        var options = {
          /* Which hue should be used for the first batch of rockets? */
          startingHue: 120,
          /* How many ticks the script should wait before a new firework gets spawned, if the user is holding down his mouse button. */
          clickLimiter: 5,
          /* How fast the rockets should automatically spawn, based on ticks */
          timerInterval: 40,
          /* Show pulsing circles marking the targets? */
          showTargets: true,
          /* Rocket movement options, should be self-explanatory */
          rocketSpeed: 2,
          rocketAcceleration: 1.03,
          /* Particle movement options, should be self-explanatory */
          particleFriction: 0.95,
          particleGravity: 1,
          /* Minimum and maximum amount of particle spawns per rocket */
          particleMinCount: 25,
          particleMaxCount: 40,
          /* Minimum and maximum radius of a particle */
          particleMinRadius: 3,
          particleMaxRadius: 5 };
        
        
        // Local variables
        var fireworks = [];
        var particles = [];
        var mouse = { down: false, x: 0, y: 0 };
        var currentHue = options.startingHue;
        var clickLimiterTick = 0;
        var timerTick = 0;
        var cntRocketsLaunched = 0;
        
        // Helper function for canvas animations
        window.requestAnimFrame = function () {
          return window.requestAnimationFrame ||
          window.webkitRequestAnimationFrame ||
          window.mozRequestAnimationFrame ||
          function (cb) {
            window.setTimeout(callback, 1000 / 60);
     .........完整代码请登录后点击上方下载按钮下载查看