Alexander Deplov

Animated circles from the center to outside v5

Animated circles from the center to outside v5

Code

var bg = new Path.Rectangle({
    size: view.bounds,
    fillColor: 'black',
    position: view.center
})
var clones = 30
var amountOfRows = 10
var radiusInPeak = 8
var radiusMultiplierOnTheEnd = amountOfRows / clones
var innerRadius = 50
var rootGroup = new Group()
for (var i = 1; i < 10; i++) {
    createCircles(5 * i, 25 * i)
}

function createCircles(max, distanceFromCenter) {
    var angle = 360 / max
    var group = new Group()
    group.applyMatrix = false
    for (var i = 0; i < max; i++) {
        var circle = new Path.Rectangle({
            size: [5, 20],
            fillColor: 'blue',
            center: [view.size.width / 2, view.size.height / 2 + distanceFromCenter],
            parent: group,
            applyMatrix: false
        })
        circle.fillColor.hue += i / max
        circle.onFrame = function(event) {
            group.rotation = Math.sin(i + event.count * 0.04 - i * 20) * 5
            var scaleAnim = (1.5 + Math.sin(i + event.count * 0.02 - i * 10)) / 2.5
            this.scaling.x = scaleAnim * 4
            this.scaling.y = (1.5 + Math.cos(i + event.count * 0.02 - i * 10)) / 2.5
            this.fillColor.hue = 200 + Math.sin(i + event.count * 0.07 - i * 20) * 60
            this.rotate(i / 120)
        }
        circle.rotate(angle * i, view.center)
        group.onFrame = function(event) {}
    }
    rootGroup.addChild(group)
}