just another inlet to tributary

inlet.js

var text = 'tributary'
var iterations = 14;
var step_size = 0.8942;

var startoffet = 0;
var toogle  = 1;


var svg = d3.select('svg')
  .attr('width',1000)
  .attr('height',1000)

    
    
var g = svg.append('g')
		.attr('transform','translate('+77+','+100+')') 
      	.attr('width',1000)
  		.attr('height',1000)
  
var basic = g.append('text')
  	.text(text)
  	.attr('font-size',200)
    .attr('font-weight','bold')
    .attr('stroke','white')
    .attr('stroke-width',5)
    .attr('y',200)
    .attr('fill',"#5ACDE2") 

var defs = d3.select('svg').append('defs')
    
var filter = defs.append('filter')
    			.attr('id','texty')
    			.attr('width',2.1)
        		.attr('height',2.6)


for(var i = 0; i < iterations;i++){ 

  filter.append('feOffset')
  	.attr('dx', 2.16)
  	.attr('dy', 9)
  	.attr('result','ctt'+i)
    
  startoffet = startoffet+step_size;
    console.log('off',startoffet)
   // toogle = toogle *-1;
filter.append('feFlood')
  
  .attr('flood-color','rgba('+(i*1)+',600,'+(i*0.5)+',1)')
  .attr('flood-opacity',1)
  .attr('result',"cFT"+i)

filter.append('feComposite')
  .attr('operator','in')
    .attr('in1',"cFT"+i)
    .attr('in2','ctt'+i)
  .attr('result','cCH'+i)

}  

console.log('ff', startoffet)

 filter.append('feOffset')
  	.attr('dx', -20)
  	.attr('dy', -20)
  	.attr('result','cttx')
    
   // toogle = toogle *-1;
filter.append('feFlood')
  .attr('flood-color','red')
  .attr('result',"cFTx")

filter.append('feComposite')
  .attr('operator','in')
    .attr('in1',"cFTx")
    .attr('in2','cttx')
  .attr('result','cCHx')

var merge = filter.append('feMerge')
    
for(var i = (iterations-1); i >= 0;i--){ 
	merge.append('feMergeNode').attr('in','cCH'+i)
} 


//merge.append('feMergeNode').attr('in','cCHx')
//merge.append('feMergeNode').attr('in','SourceGraphic')
  
basic.attr('filter','url(#texty)')