<svg width="400" height="400" id="svgFrame0">
<rect x="0" y="0"  width="400" height="400" fill="#f9f9f9" stroke-width="0.5" stroke="grey"/>
</svg>

<script>
function myF() {

for (var i = 0; i < 80; i++) {
var cx = Math.floor(400*Math.random());
var cy = Math.floor(400*Math.random());
var r = Math.floor(18*Math.random())+2;
var x1 = Math.floor(400*Math.random());
var x2 = Math.floor(400*Math.random());
var x3 = Math.floor(400*Math.random());
var y1 = Math.floor(400*Math.random());
var y2 = Math.floor(400*Math.random());
var y3 = Math.floor(400*Math.random());

var circle1 = document.createElementNS(svgFrame0.namespaceURI, 'circle');
    circle1.setAttributeNS(null, 'cx', cx);
    circle1.setAttributeNS(null, 'cy', cy);
    circle1.setAttributeNS(null, 'r', r);
    circle1.setAttributeNS(null, 'fill', 'royalblue');

var g1 = document.createElementNS(svgFrame0.namespaceURI, 'g');

    g1.appendChild(circle1);
    svgFrame0.appendChild(g1);

for (var j = 0; j < 1; j++) {

var animation1 = document.createElementNS(svgFrame0.namespaceURI, 'animateMotion');
    animation1.setAttribute('path', 'M'+cx+' '+cy+'L'+x1+' '+y1+'L'+x2+' '+y2+'L'+x3+' '+y3+'Z');
    animation1.setAttribute('begin', '0s');
    animation1.setAttribute('dur', '1s');
    animation1.setAttribute('repeatCount', 'indefinite');

    g1.appendChild(animation1);

}}}
myF()

</script>