daily pastebin goal
36%
SHARE
TWEET

Untitled

a guest Apr 16th, 2018 45 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. let animate = requestAnimationFrame(draw);
  2. let w3 = new Wave(300,200,.5);
  3. let w4 = new Wave(100,200,0.5);
  4.  
  5. function setup() {
  6.     Wave.render();
  7.     recordMousePos(Canvas.Element); //setzt die Update-func für das Aufzeichnen der MausPos auf true
  8. }
  9.  
  10. function draw() {
  11.     Wave.render();
  12.     //Observer (Punkt der dargestellt wird) bewegt sich mit der Maus
  13.     Observer.x = (mouseX<Canvas.Element.width/10*4) ? mouseX : Canvas.Element.width/10*4; // (4/10) des Canvas
  14.     Observer.y = mouseY;
  15.     animate = requestAnimationFrame(draw);
  16. }
  17.  
  18. function NoLoop() {
  19.     cancelAnimationFrame(animate);
  20. }
  21.  
  22. function Loop() {
  23. animate = requestAnimationFrame(draw);
  24. }
  25.  
  26. function reload() {
  27.     location.reload();
  28. }
  29. //NoLoop();
  30.  
  31. //Framerate
  32. var before,now,fps;
  33. before=Date.now();
  34. fps=0;
  35. requestAnimationFrame(
  36.     function loop(){
  37.         now=Date.now();
  38.         fps=Math.round(1000/(now-before));
  39.         before=now;
  40.         requestAnimationFrame(loop);
  41.                 if(fps < 58) {
  42.         document.getElementById("Count").innerHTML = fps;
  43.             } else {
  44.                 document.getElementById("Count").innerHTML = 60;
  45.             }
  46.     }
  47.  );
  48.  
  49.  
  50. let res = 10; //pixelgröße
  51. let waves = []; //Array mit Wellenobjekten
  52. let Observer = new V2D(Canvas.Element.width/2/10*4,Canvas.Element.height/2); //Punkt, der dargestellt wird
  53. let Observertime = 0; //Zeit die abläuft
  54.  
  55. class Wave {
  56.   constructor(x,y,Amplitude) {
  57.     this.coords = new V2D(x,y);
  58.     this.time = 0;
  59.     this.amp = Amplitude;
  60.     waves.push(this); //Updated Wellen-Array
  61.   }
  62.  
  63.   static render() {
  64.     Wave.GraphAPoint(Observer.x,Observer.y);
  65.    
  66.     for(let i=0,n=Canvas.Element.width/10*4;i<n;i+=res) {
  67.       for(let z=0,m=Canvas.Element.height;z<m;z+=res) {
  68.         let sum = 0;
  69.         for(let d in waves) {
  70.                 sum += AM.sin(waves[d].coords.dist(new V2D(i,z))/res+waves[d].time);
  71.         }
  72.         let color = Math.round(AM.map(sum,-1,1,0,255)); //stellt einen besseren Kontrast dar. Eig müsste es (-waves.length,waves.length)                            //anstatt (-1,1) sein
  73.             if(color>255) {color = 255} //fängt Overflow ab
  74.             if(color<0) {color = 0} //Undeflow? is das nen Wort..?
  75.         Canvas.ctx.fillStyle = "rgb("+color+","+color+","+color+")";
  76.         Canvas.Rectangle(i,z,res,res,"fill"); //Malt an der Stelle (x,y) oder (i,z) ein Viereck mit entsprechender Farbe
  77.       }
  78.     }
  79.     Wave.addTime(); // lässt die Zeit korrespondierend zur amp weiterlaufen
  80.     Observertime-=0.05; //lässt die Zeit des Observers laufen
  81.     Observer.draw(5,"red"); //Malt die stelle des Observers rot
  82.   }
  83.  
  84.   static addTime() {
  85.     for(let d in waves) {
  86.     Canvas.Circle(waves[d].coords.x,waves[d].coords.y,5,"fill","green");
  87.     waves[d].time-=waves[d].amp;
  88.   }
  89.   }
  90.  
  91.   static GraphAPoint(x,y) {
  92.     Canvas.ctx.clearRect(Canvas.Element.width/10*4,0,Canvas.Element.width/10*6,Canvas.Element.height);
  93.     let time = Observertime; // damit es keine Zeitsprünge gibt
  94.     for(let i=0;i<Canvas.Element.width/10*6/res;i++) {
  95.       let sum = 0;
  96.       for(let d in waves) {
  97.         sum += AM.sin(waves[d].coords.dist(new V2D(x,y))/res+time);
  98.       }
  99.       let h = AM.map(sum,-waves.length,waves.length,-100,100); //Höhe wird evaluiert [diesmal korrekt]
  100.         Canvas.ctx.fillStyle = "black";
  101.       Canvas.Rectangle(Canvas.Element.width/10*4+i*res,Canvas.Element.height/2-h,res,res,"fill");
  102.       time-=0.5; //Zeit schreitet voran [rückwärts, da es sonst iwie aussieht als würde es sich nach innen bewegen #Illusion oder so]
  103.     }
  104.   }
  105. }
RAW Paste Data
Top