Code
var bg = new Path.Rectangle({
size: view.size,
fillColor: 'black'
})
var amount = 20
var strokeWidth = 10
var waveAmplitude = 22
var waveLength = 0.1
var animationSpeed = 0.05
var padding = 20
var colorWidth = -8
var array = []
var rootGroup = new Group()
function createPath(i, angle){
var path = new Path.Line({
from: [0, 0],
to: [0, 60],
strokeColor: 'blue',
strokeWidth: strokeWidth,
strokeCap: 'round',
position: view.center,
applyMatrix: false,
// dashArray: [59, 20]
dashArray: [10, 40, 60, 20]
})
path.rotate(angle, view.center)
path.onFrame = function(event){
this.strokeColor.hue = colorWidth * i + (-event.count * 0.5)
this.segments[0].point.y = Math.sin(animationSpeed * event.count + i * waveLength) * waveAmplitude
}
return path
}
for (var i = 0; i < amount; i++){
var path = createPath(i, 360/amount)
array.push(path)
rootGroup.addChild(path)
path.position.x += i * padding
path.rotate(360/amount * i, view.center)
}
rootGroup.position = view.center