Alexander Deplov

Rainbow along the path, hue

Rainbow along the path, hue

Code

var amount = 50
var group = new Group()

var path = new Path.Line({
    from: view.center - [200,0],
    to: view.center + [200, 0],
    strokeColor: 'red',
    strokeWidth: 0,
    fullySelected: true,

})

for (var i = 1; i < amount; i++){
    var step = path.length / amount
    path.insert(1*i, path.getLocationAt(i * step))
}

function createCircle(center, fillColor){
    var circle = new Path.Circle({
        center: center,
        radius: 20,
        fillColor: fillColor,
        parent: group,
        onFrame: function(event){
            this.fillColor.hue += Math.sin(i / amount - amount) * Math.sin(event.count/60)
        }
    })
    
}

for (var i = 1; i < amount; i++){
    var color = new Color('blue')
    
    if (path){
        
        if (path.segments.length > 1){
        
            color.hue += i * 1
            createCircle(path.segments[i].point, color)
        }
    }
}