2d画布烟雾与鼠标交互的例子。

Question

我正在寻找使用HTML 2D Canvas的烟雾效果示例，其中烟雾受到用户通过烟雾移动鼠标以便烟雾受到干扰的影响。

Answer 1

我不知道，如果你还在这个有趣的，但是，在这里看一看this 所以，不是检查，如果颗粒感动你应该提供鼠标X边，Y坐标：

function init() { 
    var canvas = document.getElementById('myCanvas'); 
    if (canvas.getContext) { 

     // Set the context variable so it can be re-used 
     context = canvas.getContext('2d'); 

     // Create the particles and set their initial positions and velocities 
     for(var i=0; i < particleCount; ++i){ 
      var particle = new Particle(context); 

      // Set the position to be inside the canvas bounds 
      particle.setPosition(generateRandom(0, canvasWidth), generateRandom(0, canvasHeight)); 

      // Set the initial velocity to be either random and either negative or positive 
      particle.setVelocity(generateRandom(-maxVelocity, maxVelocity), generateRandom(-maxVelocity, maxVelocity)); 
      particles.push(particle);    
     } 
    } 
    else { 
     alert("Please use a modern browser"); 
    } 
}