Hey,
Das ist natürlich völliger Unsinn. Die Ringe sind mit wenigen Zeilen SVG gemacht und mit wenigen Zeilen CSS animiert.
JavaScript und canvas sind hier völlig fehl am Platz.
Da ist auch kein Javascript involviert. Egal lenken wir das Thema auf die eigentliche für mich wichtige Frage.
<canvas id="particle1_2" width="40" height="510"></canvas>
<script>
var canvas = document.getElementById('particle1_2');
var context = canvas.getContext('2d');
context.beginPath();
context.lineTo(10, 80);
context.lineTo(0, 65);
context.lineTo(0, 15);
context.lineTo(10, 0);
context.lineTo(10, 80);
context.closePath();
context.lineWidth = 1;
context.fillStyle = 'rgba(2,254,255,0.3)';
context.fill();
context.strokeStyle = 'transparent';
context.stroke();
</script>
Dies finde ich sehr interessant, vorallem weil ich keine Ahnung habe wie ich .svg's schreibe und mich besser hiermit auskenne. Aber die W3C eben sagt: "This specification is no longer in active maintenance and the HTML Working Group does not intend to maintain it further".
Gruß
Jo